@samitouri / QOS-React / commits / b9ffb59478

[playground] remove multi-file support and preview (#767)

Jan Kassens committed Nov 11, 2022 at 12:11 UTC b9ffb594781167ad4fa9c95e7b58d354e0673845

15 files changed +47 -1761

compiler/forget/packages/playground/components/Editor/Input.tsx

+8 -27

@@ -8,9 +8,7 @@ import invariant from "invariant";

8 import type { editor } from "monaco-editor";

9 import { useEffect, useState } from "react";

10 import { renderForgetMarkers } from "../../lib/forgetMonacoDiagnostics";

11 -import { createInputFile, getSelectedFile } from "../../lib/stores";

11 import { useStore, useStoreDispatch } from "../StoreContext";

13 -import InputTabSelector from "./InputTabSelector";

12 import { monacoOptions } from "./monacoOptions";

13 // TODO: Make TS recognize .d.ts files, in addition to loading them with webpack.

14 // @ts-ignore

@@ -20,37 +18,25 @@ export default function Input({ diagnostics }: { diagnostics: Diagnostic[] }) {

18 const [monaco, setMonaco] = useState<Monaco | null>(null);

19 const store = useStore();

20 const dispatchStore = useStoreDispatch();

23 - const selectedFile = getSelectedFile(store);

22 useEffect(() => {

23 if (!monaco) return;

27 - const uri = monaco.Uri.parse(`file:///${selectedFile.id}`);

24 + const uri = monaco.Uri.parse(`file:///index.js`);

25 const model = monaco.editor.getModel(uri);

26 invariant(model, "Model must exist for the selected input file.");

27 renderForgetMarkers({ monaco, model, diagnostics });

31 - }, [diagnostics, monaco, selectedFile.id]);

28 + }, [diagnostics, monaco]);

30 // Set tab width to 2 spaces for the selected input file.

31 useEffect(() => {

32 if (!monaco) return;

36 - const uri = monaco.Uri.parse(`file:///${selectedFile.id}`);

33 + const uri = monaco.Uri.parse(`file:///index.js`);

34 const model = monaco.editor.getModel(uri);

35 invariant(model, "Model must exist for the selected input file.");

36 // N.B. that `tabSize` is a model property, not an editor property.

37 // So, the tab size has to be set per model.

38 model.updateOptions({ tabSize: 2 });

42 - }, [monaco, selectedFile.id]);

43 -

44 - useEffect(() => {

45 - if (!monaco) return;

46 - // Let Monaco Editor know of the input files so that its language

47 - // service can correctly resolve import statements.

48 - store.files.forEach((file) => {

49 - const lib = [file.content, `file:///${file.id}`] as const;

50 - monaco.languages.typescript.javascriptDefaults.addExtraLib(...lib);

51 - monaco.languages.typescript.typescriptDefaults.addExtraLib(...lib);

52 - });

53 - }, [monaco, store.files]);

39 + }, [monaco]);

41 const handleChange = (value: string | undefined) => {

42 if (!value) return;

@@ -58,7 +44,7 @@ export default function Input({ diagnostics }: { diagnostics: Diagnostic[] }) {

44 dispatchStore({

45 type: "updateFile",

46 payload: {

61 - file: createInputFile(store.selectedFileId, value),

47 + source: value,

48 },

49 });

50 };

@@ -113,21 +99,16 @@ export default function Input({ diagnostics }: { diagnostics: Diagnostic[] }) {

100 return (

101 <div className="relative flex flex-col flex-none border-r border-gray-200">

116 - <InputTabSelector />

102 {/* Restrict MonacoEditor's height, since the config autoLayout:true

103 will grow the editor to fit within parent element */}

104 <div className="w-full h-monaco_small sm:h-monaco">

105 <MonacoEditor

121 - path={selectedFile.id}

106 + path={"index.js"}

107 // .js and .jsx files are specified to be TS so that Monaco can actually

108 // check their syntax using its TS language service. They are still JS files

109 // due to their extensions, so TS language features don't work.

125 - language={

126 - selectedFile.language === "javascript"

127 - ? "typescript"

128 - : selectedFile.language

129 - }

130 - value={selectedFile.content}

110 + language={"javascript"}

111 + value={store.source}

112 onMount={handleMount}

113 onChange={handleChange}

114 options={monacoOptions}

compiler/forget/packages/playground/components/Editor/InputTab.tsx deleted

-108

@@ -1,108 +0,0 @@

1 -/*

2 - * Copyright (c) Facebook, Inc. and its affiliates.

3 - */

4 -

5 -import XIcon from "@heroicons/react/solid/XIcon";

6 -import clsx from "clsx";

7 -import type { RefObject } from "react";

8 -import { memo, useEffect, useRef, useState } from "react";

9 -

10 -const MemoizedInputTab = memo(InputTab);

11 -

12 -export default MemoizedInputTab;

13 -

14 -function InputTab({

15 - tabId,

16 - autoFocus,

17 - allowEdit,

18 - isDeletable,

19 - borderColor,

20 - cursorStyle,

21 - onMountEffect,

22 - onSubmit,

23 - onDelete,

24 - onSwitchTab,

25 -}: {

26 - tabId: string;

27 - autoFocus: boolean;

28 - allowEdit: boolean;

29 - isDeletable: boolean;

30 - borderColor: string;

31 - cursorStyle: string;

32 - onMountEffect: (tabId: string, tabRef: RefObject<HTMLDivElement>) => void;

33 - onSubmit: (oldTabId: string, newTabId: string) => void;

34 - onDelete: (tabId: string) => void;

35 - onSwitchTab: (tabId: string) => void;

36 -}) {

37 - const [newTabId, setNewTabId] = useState(tabId);

38 - const tabIdWidth = `${newTabId.length}ch`;

39 - const [isEditing, setIsEditing] = useState(autoFocus);

40 - const tabRef = useRef<HTMLDivElement>(null);

41 -

42 - useEffect(() => {

43 - onMountEffect(tabId, tabRef);

44 - }, [tabId, onMountEffect]);

45 -

46 - return (

47 - <div

48 - ref={tabRef}

49 - className={clsx(

50 - "border-b-2 border-white px-2.5 py-0.5 h-full flex flex-1 items-center cursor-pointer",

51 - borderColor

52 - )}

53 - onClick={() => {

54 - onSwitchTab(tabId);

55 - }}

56 - >

57 - {isEditing ? (

58 - <form

59 - spellCheck={false}

60 - onSubmit={(e) => {

61 - e.preventDefault();

62 - onSubmit(tabId, newTabId);

63 - }}

64 - >

65 - <input

66 - type="text"

67 - autoFocus

68 - value={newTabId}

69 - style={{ width: tabIdWidth }}

70 - className={clsx("text-center bg-white outline-none", {

71 - "text-gray-500": isEditing,

72 - })}

73 - onChange={(e) => setNewTabId(e.target.value)}

74 - onBlur={(e) => {

75 - // Stop if clicking on delete button.

76 - if (e.relatedTarget && e.relatedTarget.id === "delete-button")

77 - return;

78 - setIsEditing(false);

79 - onSubmit(tabId, newTabId);

80 - }}

81 - />

82 - </form>

83 - ) : (

84 - <div

85 - style={{ width: tabIdWidth }}

86 - className={clsx("text-center", cursorStyle)}

87 - onClick={() => {

88 - if (allowEdit) setIsEditing(true);

89 - }}

90 - >

91 - {tabId}

92 - </div>

93 - )}

94 - {isDeletable ? (

95 - <button

96 - id="delete-button"

97 - className="relative top-[1px] z-10"

98 - onClick={(e) => {

99 - e.stopPropagation();

100 - onDelete(tabId);

101 - }}

102 - >

103 - <XIcon className="w-[18px] h-[18px] transition-colors duration-150 ease-in hover:fill-gray-800 fill-gray-500" />

104 - </button>

105 - ) : null}

106 - </div>

107 - );

108 -}

compiler/forget/packages/playground/components/Editor/InputTabSelector.tsx deleted

-203

@@ -1,203 +0,0 @@

1 -/*

2 - * Copyright (c) Facebook, Inc. and its affiliates.

3 - */

4 -

5 -import { PlusIcon } from "@heroicons/react/solid";

6 -import invariant from "invariant";

7 -import { useSnackbar } from "notistack";

8 -import { useState, type RefObject } from "react";

9 -import {

10 - checkInputFile,

11 - createInputFile,

12 - createMessage,

13 - MessageLevel,

14 - MessageSource,

15 - type Store,

16 -} from "../../lib/stores";

17 -import { useStore, useStoreDispatch } from "../StoreContext";

18 -import InputTab from "./InputTab";

19 -

20 -export default function InputTabSelector() {

21 - const store = useStore();

22 - const dispatchStore = useStoreDispatch();

23 - const [isCreating, setIsCreating] = useState(false);

24 - const tabIds = isCreating

25 - ? [...store.files.map((f) => f.id), generateUniqueFileId(store.files)]

26 - : store.files.map((f) => f.id);

27 - const { enqueueSnackbar } = useSnackbar();

28 -

29 - const handleMountEffect = (

30 - tabId: string,

31 - tabRef: RefObject<HTMLDivElement>

32 - ) => {

33 - const isPendingCreation = isCreating && tabIds[tabIds.length - 1] === tabId;

34 - if (isPendingCreation || store.selectedFileId === tabId) {

35 - // Scroll new or selected tab into view when loading the page, switching tabs,

36 - // and adding new tabs.

37 - tabRef.current?.scrollIntoView({

38 - block: "nearest",

39 - inline: "start",

40 - behavior: "smooth",

41 - });

42 - }

43 - };

44 -

45 - // Create a new tab.

46 - const handleAddTab = (_oldTabId: string, newTabId: string) => {

47 - try {

48 - const newTab = createInputFile(newTabId, "");

49 - checkInputFile(newTab, undefined, store);

50 -

51 - dispatchStore({

52 - type: "addFile",

53 - payload: { file: newTab },

54 - });

55 - setIsCreating(false);

56 - } catch (e) {

57 - if (e instanceof Error) {

58 - enqueueSnackbar(e.message, {

59 - variant: "message",

60 - ...createMessage(

61 - e.message,

62 - MessageLevel.Error,

63 - MessageSource.Playground

64 - ),

65 - });

66 - }

67 - }

68 - };

69 -

70 - // Update ID of an existing tab.

71 - const handleUpdateId = (oldTabId: string, newTabId: string) => {

72 - if (newTabId === oldTabId) return;

73 - const oldTab = store.files.find((f) => f.id === oldTabId);

74 - invariant(oldTab, "Tab being updated must exist.");

75 -

76 - try {

77 - const newTab = createInputFile(newTabId, oldTab.content);

78 - checkInputFile(newTab, oldTab, store);

79 -

80 - dispatchStore({

81 - type: "updateFile",

82 - payload: { oldFileId: oldTabId, file: newTab },

83 - });

84 - } catch (e) {

85 - if (e instanceof Error) {

86 - enqueueSnackbar(e.message, {

87 - variant: "message",

88 - ...createMessage(

89 - e.message,

90 - MessageLevel.Error,

91 - MessageSource.Playground

92 - ),

93 - });

94 - }

95 - }

96 - };

97 -

98 - const handleDeleteTab = (tabId: string) => {

99 - // Tab being created.

100 - if (isCreating) {

101 - setIsCreating(false);

102 - }

103 - // Existing tabs.

104 - else {

105 - const ok = confirm(`Are you sure you want to delete ${tabId}?`);

106 - if (!ok) return;

107 -

108 - dispatchStore({

109 - type: "deleteFile",

110 - payload: { fileId: tabId },

111 - });

112 - }

113 - };

114 -

115 - const handleSwitchTab = (tabId: string) => {

116 - const isPendingCreation = isCreating && tabIds[tabIds.length - 1] === tabId;

117 - if (!isPendingCreation) {

118 - dispatchStore({

119 - type: "switchInputTab",

120 - payload: { selectedFileId: tabId },

121 - });

122 - }

123 - };

124 -

125 - return (

126 - <div className="relative flex w-full border-b border-gray-200 h-9">

127 - <div className="flex h-full overflow-x-auto no-scrollbar">

128 - {tabIds.map((tabId, index) => {

129 - // Hide _app.js on UI.

130 - if (tabId === "_app.js") return;

131 -

132 - const isSelected = store.selectedFileId === tabId;

133 - const isPendingCreation = isCreating && index === tabIds.length - 1;

134 - const isIndexTab = index === 1;

135 - const isDeletable = !isIndexTab || isPendingCreation;

136 - const shouldDivide = index < tabIds.length - 1;

137 -

138 - return (

139 - <div

140 - className="flex items-center h-full"

141 - // So that once the new tab is created its states are reset,

142 - // essentially blurring its input field (especially when creating

143 - // the tab by pressing Enter).

144 - key={`${tabId}${isPendingCreation ? "_new" : ""}`}

145 - >

146 - <InputTab

147 - tabId={tabId}

148 - autoFocus={isPendingCreation}

149 - allowEdit={isSelected}

150 - isDeletable={isDeletable}

151 - borderColor={

152 - isPendingCreation

153 - ? "border-gray-400"

154 - : isSelected

155 - ? "border-link"

156 - : "border-white"

157 - }

158 - cursorStyle={

159 - isSelected || isPendingCreation

160 - ? "cursor-text"

161 - : "cursor-pointer"

162 - }

163 - onMountEffect={handleMountEffect}

164 - onSubmit={isPendingCreation ? handleAddTab : handleUpdateId}

165 - onDelete={handleDeleteTab}

166 - onSwitchTab={handleSwitchTab}

167 - />

168 - {shouldDivide && (

169 - <div className="w-[1px] h-[18px] border-gray-200 border-l mx-1" />

170 - )}

171 - </div>

172 - );

173 - })}

174 - </div>

175 - <button

176 - className="z-10 flex items-center justify-center flex-none w-8 h-full bg-transparent group"

177 - onClick={() => setIsCreating(true)}

178 - >

179 - <PlusIcon className="w-[18px] h-[18px] transition-colors duration-150 ease-in group-hover:fill-gray-800 fill-gray-500" />

180 - </button>

181 - <div className="absolute w-16 h-full right-8 bg-gradient-to-l from-white" />

182 - </div>

183 - );

184 -}

185 -

186 -/**

187 - * Generate a file ID different from those of exsiting @param inputFiles.

188 - */

189 -function generateUniqueFileId(inputFiles: Store["files"]) {

190 - let name = "Component";

191 - const ext = "js";

192 -

193 - let i = 0;

194 - while (true) {

195 - if (inputFiles.find((f) => f.id === `${name}.${ext}`)) {

196 - name = `Component${++i}`;

197 - } else {

198 - break;

199 - }

200 - }

201 -

202 - return `${name}.${ext}`;

203 -}

compiler/forget/packages/playground/components/Editor/Output.tsx

+2 -4

@@ -15,9 +15,8 @@ import {

15 } from "babel-plugin-react-forget";

16 import { memo, useEffect, useMemo } from "react";

17 import compile from "../../lib/compilerDriver";

18 -import { getSelectedFile, type Store } from "../../lib/stores";

18 +import type { Store } from "../../lib/stores";

19 import GraphView from "../GraphView";

20 -import Preview from "../Preview";

20 import { monacoOptions } from "./monacoOptions";

21 import HIRTabContent from "./HIRTabContent";

@@ -32,7 +31,7 @@ type Props = {

32 function Output({ store, updateDiagnostics }: Props) {

33 const { outputs, diagnostics } = useMemo(

35 - () => compile(getSelectedFile(store), store.compilerFlags),

34 + () => compile(store.source, store.compilerFlags),

35 [store]

36 );

37 useEffect(() => {

@@ -42,7 +41,6 @@ function Output({ store, updateDiagnostics }: Props) {

41 <TabbedWindow

42 defaultTab="HIR"

43 tabs={{

45 - Preview: <Preview store={store} />,

44 IR: <TextTabContent outputs={outputs} kind={OutputKind.IR} />,

45 HIR: <HIRTabContent source={getSelectedFile(store).content} />,

46 CFG: <TextTabContent outputs={outputs} kind={OutputKind.CFG} />,

compiler/forget/packages/playground/components/Preview.tsx deleted

-137

@@ -1,137 +0,0 @@

1 -/*

2 - * Copyright (c) Facebook, Inc. and its affiliates.

3 - */

4 -

5 -import LightBulbIcon from "@heroicons/react/solid/LightBulbIcon";

6 -import { FormControlLabel, Switch } from "@mui/material";

7 -import clsx from "clsx";

8 -import invariant from "invariant";

9 -import { useEffect, useRef, useState } from "react";

10 -import { useMountEffect } from "../hooks";

11 -import { bundle, BundleResult, defaultBundleRes } from "../lib/moduleBundler";

12 -import { Store } from "../lib/stores";

13 -

14 -const srcDoc = `

15 -<!DOCTYPE html>

16 -<html lang="en">

17 - <head>

18 - <meta charset="UTF-8" />

19 - <meta name="viewport" content="width=device-width, initial-scale=1.0" />

20 - <meta http-equiv="X-UA-Compatible" content="ie=edge" />

21 - <script>

22 - // Enable DevTools to inspect React inside of an <iframe>

23 - // This must run before React is loaded

24 - __REACT_DEVTOOLS_GLOBAL_HOOK__ = parent.__REACT_DEVTOOLS_GLOBAL_HOOK__;

25 - </script>

26 - <script>

27 - window.addEventListener("message", async ({ data }) => {

28 - try {

29 - const { event, source, id } = data;

30 - if (event === "CodeUpdate") {

31 - const encodedCode = encodeURIComponent(source);

32 - const dataUri = "data:text/javascript;charset=utf-8," + encodedCode;

33 - await import(dataUri);

34 - }

35 - } catch (e) {

36 - console.error(e);

37 - }

38 - });

39 - </script>

40 - </head>

41 - <body>

42 - <div id="app" />

43 - </body>

44 -</html>

45 -`;

46 -

47 -enum MessageType {

48 - CodeUpdate = "CodeUpdate",

49 -}

50 -

51 -export default function Preview({ store }: { store: Store }) {

52 - const [iframeReady, setIframeReady] = useState(false);

53 - const iframeRef = useRef<HTMLIFrameElement>(null);

54 - const [bundleRes, setBundleRes] = useState<BundleResult>(defaultBundleRes);

55 - const [enableForget, setEnableForget] = useState<boolean>(true);

56 - // used to invalidate import cache (when toggling enableForget)

57 - const [toggleCount, setToggleCount] = useState<number>(0);

58 -

59 - useMountEffect(() => {

60 - if (!iframeRef || !iframeRef.current) return;

61 - iframeRef.current.srcdoc = srcDoc;

62 - iframeRef.current.addEventListener("load", () => {

63 - setIframeReady(true);

64 - });

65 - });

66 -

67 - // Perform async operations which will trigger a 2nd render.

68 - useEffect(() => {

69 - async function bundleInputs() {

70 - const bundleRes = await bundle(store.files, store.compilerFlags);

71 - setBundleRes(bundleRes);

72 - }

73 - bundleInputs();

74 - }, [store.files, store.compilerFlags]);

75 -

76 - // Synchronzie with iframe and messaging UIs.

77 - useEffect(() => {

78 - if (!bundleRes) return;

79 - const { res } = bundleRes;

80 -

81 - if (iframeReady && res) {

82 - iframeRef.current!.contentWindow!.postMessage({

83 - event: MessageType.CodeUpdate,

84 - source: res.getCode(enableForget ? "after" : "before", toggleCount),

85 - });

86 - }

87 - }, [iframeReady, bundleRes, store.selectedFileId, enableForget, toggleCount]);

88 -

89 - const diff = bundleRes.res?.codeSizeDiff;

90 - const showCodeSizeChange = diff != null && enableForget;

91 -

92 - const ticker = (percentage: number) => (

93 - <>

94 - {percentage >= 0 ? "increased" : "decreased"} by{" "}

95 - <span

96 - className={clsx("text-red-600", {

97 - "text-emerald-600": percentage <= 0,

98 - })}

99 - >

100 - {Math.abs(percentage).toFixed(2)}%

101 - </span>

102 - </>

103 - );

104 -

105 - return (

106 - <div className="flex flex-col w-full h-full">

107 - <FormControlLabel

108 - className={"mx-3"}

109 - control={

110 - <Switch

111 - checked={enableForget}

112 - onChange={(e) => {

113 - setEnableForget(e.target.checked);

114 - setToggleCount(toggleCount + 1);

115 - }}

116 - />

117 - }

118 - label="Compile using Forget?"

119 - />

120 - {showCodeSizeChange && (

121 - <div className="flex items-center gap-1 p-2 bg-slate-200">

122 - <LightBulbIcon className="flex-none w-5 h-5 text-yellow-500" />

123 - <p className="text-sm">

124 - Compiled code size {ticker(diff.minPercent)} ({diff.min} minified)

125 - and {ticker(diff.gzipPercent)} ({diff.gzip} minified & gzipped) from

126 - the original.

127 - </p>

128 - </div>

129 - )}

130 - <iframe

131 - title="React Forget Playground"

132 - ref={iframeRef}

133 - className="flex-1 w-full"

134 - />

135 - </div>

136 - );

137 -}

compiler/forget/packages/playground/components/StoreContext.tsx

+4 -64

@@ -6,7 +6,7 @@ import type { Dispatch, ReactNode } from "react";

6 import { useReducer } from "react";

7 import createContext from "../lib/createContext";

8 import { emptyStore } from "../lib/defaultStore";

9 -import type { InputFile, Store } from "../lib/stores";

9 +import type { Store } from "../lib/stores";

10 import { saveStore } from "../lib/stores";

11 import { ForgetCompilerFlags } from "../lib/compilerDriver";

@@ -46,27 +46,12 @@ type ReducerAction =

46 store: Store;

47 };

48 }

49 - | {

50 - type: "addFile";

51 - payload: {

52 - file: InputFile;

53 - };

54 - }

49 | {

50 type: "updateFile";

51 payload: {

58 - file: InputFile;

59 - oldFileId?: string;

52 + source: string;

53 };

54 }

62 - | {

63 - type: "deleteFile";

64 - payload: { fileId: string };

65 - }

66 - | {

67 - type: "switchInputTab";

68 - payload: { selectedFileId: string };

69 - }

55 | {

56 type: "setCompilerFlag";

57 payload: { flag: keyof ForgetCompilerFlags; value: boolean };

@@ -80,57 +65,12 @@ function storeReducer(store: Store, action: ReducerAction): Store {

65 saveStore(newStore);

66 return newStore;

67 }

83 - case "addFile": {

84 - const { file } = action.payload;

85 -

86 - const newStore = {

87 - ...store,

88 - files: [...store.files, file],

89 - selectedFileId: file.id,

90 - };

91 -

92 - saveStore(newStore);

93 - return newStore;

94 - }

68 case "updateFile": {

96 - const { file, oldFileId } = action.payload;

97 -

98 - const newStore = {

99 - ...store,

100 - files: store.files.map((f) =>

101 - f.id === file.id || f.id === oldFileId ? file : f

102 - ),

103 - selectedFileId: file.id,

104 - };

105 -

106 - saveStore(newStore);

107 - return newStore;

108 - }

109 - case "deleteFile": {

110 - const { fileId } = action.payload;

111 -

112 - // If the current selected file is deleted, fall back to selecting

113 - // the index file (at index 1 of the files array).

114 - const fallbackFileId =

115 - store.selectedFileId === fileId

116 - ? store.files[1].id

117 - : store.selectedFileId;

118 -

119 - const newStore = {

120 - ...store,

121 - files: store.files.filter((f) => f.id !== fileId),

122 - selectedFileId: fallbackFileId,

123 - };

124 -

125 - saveStore(newStore);

126 - return newStore;

127 - }

128 - case "switchInputTab": {

129 - const { selectedFileId } = action.payload;

69 + const { source } = action.payload;

71 const newStore = {

72 ...store,

133 - selectedFileId: selectedFileId,

73 + source,

74 };

76 saveStore(newStore);

compiler/forget/packages/playground/lib/compilerDriver.ts

+4 -13

@@ -18,7 +18,6 @@ import {

18 import { PassName } from "../../../dist/Pass";

19 // @ts-ignore

20 import ESLint from "eslint-browser";

21 -import type { InputFile } from "./stores";

21 import { getBabelPlugins } from "./utils";

23 declare global {

@@ -54,19 +53,11 @@ function validateNoUseBeforeDefine(source: string) {

53 }

55 export default function compile(

57 - file: InputFile,

56 + source: string,

57 compilerFlags: ForgetCompilerFlags

58 ): CompileResult {

59 const outputs = createCompilerOutputs();

62 - // Bail out if file is CSS.

63 - if (file.language === "css") {

64 - return {

65 - outputs,

66 - diagnostics: [],

67 - };

68 - }

69 -

61 const forgetLogs: string[] = [];

62 const forgetPlaygroundOptions: Partial<CompilerOptions> = {

63 logger: createArrayLogger(forgetLogs),

@@ -78,18 +69,18 @@ export default function compile(

69 }

71 const babelPlugins = getBabelPlugins(

81 - file.language,

72 + "javascript",

73 true,

74 forgetPlaygroundOptions

75 );

76 const babelOptions: TransformOptions = {

77 compact: true,

78 plugins: babelPlugins,

88 - filename: file.id,

79 + filename: "index.js",

80 };

82 try {

92 - const result = transform(file.content, babelOptions);

83 + const result = transform(source, babelOptions);

85 // Don't throw if resulting code is any string. This includes the

86 // empty string, which is when `source` is an empty string.

compiler/forget/packages/playground/lib/defaultStore.ts

+12 -203

@@ -3,210 +3,24 @@

3 */

5 import type { Store } from "./stores";

6 -import { createInputFile } from "./stores";

6 import { createCompilerFlags } from "babel-plugin-react-forget";

9 -// Entry point to rendering Preview.

10 -const _app = `\

11 -import { createRoot } from "react-dom/client";

12 -import Home from "./index";

13 -

14 -// Persist the root in the global scope.

15 -let root = globalThis.Forget$PlaygroundRoot;

16 -if (!root) {

17 - root = createRoot(document.getElementById("app"));

18 - globalThis.Forget$PlaygroundRoot = root;

19 -}

20 -

21 -root.render(<Home />);

22 -`;

23 -

24 -// TODO: Add banner similar to the one in Preview to aid the user

25 -// instead of using the comment below.

8 const index = `\

27 -import { useState } from "react";

28 -import "./styles.css";

29 -import Task from "./Task";

30 -import AddTask from "./AddTask";

31 -

32 -const initialTasks = [

33 - { id: 0, text: "Buy milk", done: true },

34 - { id: 1, text: "Eat tacos", done: false },

35 - { id: 2, text: "Brew tea", done: false },

36 -];

37 -

38 -function TaskBoard() {

39 - const [tasks, setTasks] = useState(initialTasks);

40 - const onChangeTask = task =>

41 - setTasks(ts => ts.map(t => (t.id === task.id ? task : t)));

42 -

43 - return (

44 - <div>

45 - <AddTask setTasks={setTasks} />

46 - {tasks.map(task => (

47 - <Task key={task.id} task={task} onChange={onChangeTask} />

48 - ))}

49 - </div>

50 - );

51 -}

52 -

53 -// Default export a React component to render in the Preview.

54 -export default TaskBoard;

55 -`;

56 -

57 -const task = `\

58 -import { useState, useRef } from "react";

59 -

60 -export default function Task({ task, onChange }) {

61 - const count = useRef(0);

62 - const [isEditing, setIsEditing] = useState(false);

63 -

64 - let taskContent;

65 - if (isEditing) {

66 - taskContent = (

67 - <>

68 - <input

69 - value={task.text}

70 - onChange={e => {

71 - onChange({

72 - ...task,

73 - text: e.target.value,

74 - });

75 - }}

76 - />

77 - <button onClick={() => setIsEditing(false)}>Save</button>

78 - </>

79 - )

80 - } else {

81 - taskContent = (

82 - <>

83 - {task.text}

84 - <button onClick={() => setIsEditing(true)}>Edit</button>

85 - </>

86 - )

9 +function fibbonacci(n) {

10 + let a = 0;

11 + let b = 1;

12 + let c = 1;

13 + for (let i = 0; i < n; i++) {

14 + a = b;

15 + b = c;

16 + c = a + b;

17 }

88 -

89 - return (

90 - <li>

91 - <label>

92 - <input

93 - type="checkbox"

94 - checked={task.done}

95 - onChange={e => {

96 - onChange({

97 - ...task,

98 - done: e.target.checked,

99 - });

100 - }}

101 - />

102 - {taskContent}

103 - {count.current++}

104 - </label>

105 - </li>

106 - );

107 -}`;

108 -

109 -const addTask = `\

110 -import { useState } from "react";

111 -

112 -const defaultTask = "Code bugs";

113 -let nextId = 3;

114 -

115 -export default function AddTask({ setTasks }) {

116 - const [text, setText] = useState(defaultTask);

117 - const handleAddTask = (text) => {

118 - setTasks((ts) => [

119 - ...ts,

120 - {

121 - id: nextId++,

122 - text: text,

123 - done: false,

124 - },

125 - ]);

126 - };

127 -

128 - return (

129 - <>

130 - <input

131 - placeholder="Add task"

132 - value={text}

133 - onChange={(e) => setText(e.target.value)}

134 - />

135 - <button

136 - onClick={() => {

137 - setText(defaultTask);

138 - handleAddTask(text);

139 - }}

140 - >

141 - Add

142 - </button>

143 - </>

144 - );

145 -}

146 -`;

147 -

148 -const styles = `\

149 -* {

150 - box-sizing: border-box;

151 -}

152 -

153 -body {

154 - font-family: "Optimistic Display App", sans-serif;

155 - margin: 20px;

156 - padding: 0;

157 -}

158 -

159 -h1 {

160 - margin-top: 0;

161 - font-size: 22px;

162 -}

163 -

164 -h2 {

165 - margin-top: 0;

166 - font-size: 20px;

167 -}

168 -

169 -h3 {

170 - margin-top: 0;

171 - font-size: 18px;

18 + return a;

19 }

173 -

174 -h4 {

175 - margin-top: 0;

176 - font-size: 16px;

177 -}

178 -

179 -h5 {

180 - margin-top: 0;

181 - font-size: 14px;

182 -}

183 -

184 -h6 {

185 - margin-top: 0;

186 - font-size: 12px;

187 -}

188 -

189 -ul {

190 - padding-left: 20px;

191 -}

192 -

193 -button { margin: 5px; }

194 -li { list-style-type: none; }

195 -ul, li { margin: 0; padding: 0; }

20 `;

198 -const defaultFiles: Store["files"] = [

199 - // Hidden tab.

200 - createInputFile("_app.js", _app),

201 - createInputFile("index.js", index),

202 - createInputFile("Task.js", task),

203 - createInputFile("AddTask.js", addTask),

204 - createInputFile("styles.css", styles),

205 -];

206 -

22 export const defaultStore: Store = {

208 - files: defaultFiles,

209 - selectedFileId: "index.js",

23 + source: index,

24 compilerFlags: createCompilerFlags(),

25 };

@@ -217,16 +31,11 @@ export default function MyApp() {

31 `;

33 export const minimalStore: Store = {

220 - files: [

221 - createInputFile("_app.js", _app),

222 - createInputFile("index.js", minimalIndex),

223 - ],

224 - selectedFileId: "index.js",

34 + source: minimalIndex,

35 compilerFlags: createCompilerFlags(),

36 };

38 export const emptyStore: Store = {

229 - files: [createInputFile("_app.js", _app)],

230 - selectedFileId: "_app.js",

39 + source: "",

40 compilerFlags: createCompilerFlags(),

41 };

compiler/forget/packages/playground/lib/forgetPlaygroundPlugin.ts deleted

-199

@@ -1,199 +0,0 @@

1 -/*

2 - * Copyright (c) Facebook, Inc. and its affiliates.

3 - */

4 -

5 -import type { TransformOptions } from "@babel/core";

6 -import { transform } from "@babel/standalone";

7 -import invariant from "invariant";

8 -import type { Plugin } from "rollup";

9 -import { ForgetCompilerFlags } from "./compilerDriver";

10 -import patchUseMemoCache from "./patchUseMemoCache";

11 -import { FileExt, matchFileId, type InputFile } from "./stores";

12 -import { getBabelPlugins } from "./utils";

13 -

14 -const MODULE_PREFIX = "\0";

15 -const CDN = "https://esm.sh";

16 -

17 -/**

18 - * Rollup plugin that interprets input tabs as a virtual file system

19 - * and monkeypatches `useMemoCache` into `react`.

20 - */

21 -export default function forgetPlaygroundPlugin({

22 - files,

23 - enableForget,

24 - reactVersion,

25 - compilerFlags,

26 -}: {

27 - files: InputFile[];

28 - enableForget: boolean;

29 - reactVersion: string;

30 - compilerFlags: ForgetCompilerFlags;

31 -}): Plugin {

32 - const fileTable = new Map<string, InputFile>();

33 - files.forEach((f) => fileTable.set(`./${f.id}`, f));

34 -

35 - return {

36 - name: "forget-playground-plugin",

37 - resolveId(source) {

38 - /*

39 - Instruct Rollup to resolve `react` and `react-dom` as internal modules,

40 - where we'll then define their module content in the load hook below.

41 -

42 - Note that setting the `syntheticNamedExports` option to `true` allows

43 - Rollup to fall back missing named exports to the properties of the default

44 - export. This is so that we don't have to export properties of `react` by

45 - name (e.g., export { useState } from "react"). Instead we only export default

46 - from `react` and the subsequent uses of otherwise named exports will be

47 - transformed into the form of `React.useState`.

48 -

49 - Refer to https://github.com/rollup/rollup/pull/3295 for details on

50 - `syntheticNamedExports`.

51 - */

52 - if (source === "react" || source.startsWith("react/")) {

53 - return {

54 - // Prefix each internal module ID with `\0` to prevent other plugins

55 - // from trying to process it. (https://rollupjs.org/guide/en/#conventions)

56 - id: `${MODULE_PREFIX}${source}`,

57 - syntheticNamedExports: true,

58 - };

59 - }

60 -

61 - if (source.startsWith("react-dom")) {

62 - return {

63 - id: `${MODULE_PREFIX}${source}`,

64 - syntheticNamedExports: true,

65 - };

66 - }

67 -

68 - // User-defined CSS

69 - if (source.startsWith(".") && source.endsWith(".css")) {

70 - return `${MODULE_PREFIX}${source}`;

71 - }

72 -

73 - // Playground input tabs

74 - // Signals Rollup to not try to find the id elsewhere

75 - if (source.startsWith(".")) {

76 - const match = matchFileId(source);

77 -

78 - const hasExtension = match !== null;

79 - const isValidImportPath =

80 - hasExtension && (match[1] === "js" || match[1] === "jsx");

81 -

82 - // ES Module imports only allow extensions to be .js/.jsx (can be optionally

83 - // omitted). For .ts/.tsx files, the extension must be omitted. So, whenever

84 - // an file doesn't have an extension or has one that's not .js/.jsx, we try

85 - // to add one and see if the resulting ID exists in the input files.

86 - if (!isValidImportPath) {

87 - for (const ext of Object.keys(FileExt)) {

88 - if (ext === "css") continue;

89 - if (fileTable.has(`${source}.${ext}`)) {

90 - return `${MODULE_PREFIX}${source}.${ext}`;

91 - }

92 - }

93 -

94 - this.error("Bundling failed: invalid import path.");

95 - }

96 -

97 - return `${MODULE_PREFIX}${source}`;

98 - }

99 -

100 - // External URL

101 - if (source.includes("://")) {

102 - return {

103 - id: source,

104 - external: true,

105 - };

106 - }

107 -

108 - // Fallback to NPM packages

109 - return {

110 - id: `${CDN}/${source}`,

111 - external: true,

112 - };

113 - },

114 - load(id) {

115 - if (!id.startsWith(MODULE_PREFIX)) return null;

116 -

117 - id = id.slice(MODULE_PREFIX.length);

118 -

119 - if (id === "react") {

120 - return patchUseMemoCache(dev(`${CDN}/react@${reactVersion}`));

121 - }

122 - // `react/jsx-runtime`, etc.

123 - else if (id.startsWith("react/")) {

124 - const URL = id.replace("react", `${CDN}/react@${reactVersion}`);

125 -

126 - return `export { default } from "${dev(URL)}"`;

127 - }

128 - // `react-dom/client`, etc.

129 - else if (id.startsWith("react-dom")) {

130 - const URL = id.replace("react-dom", `${CDN}/react-dom@${reactVersion}`);

131 -

132 - return `export { default } from "${dev(URL)}"`;

133 - }

134 -

135 - // Load input tab content.

136 - const file = fileTable.get(id);

137 - invariant(

138 - file,

139 - "All non-external IDs that are not `react` or `react-dom` must be in fileTable."

140 - );

141 - return file.content;

142 - },

143 - transform(code, filename) {

144 - filename = filename.slice(MODULE_PREFIX.length);

145 -

146 - const file = fileTable.get(filename);

147 - if (file && file.language === "css") {

148 - // Append CSS as a style tag to the iframe <head> element.

149 - return `

150 - (() => {

151 - let stylesheet = document.getElementById("${filename}");

152 -

153 - // Remove and recreate the style tag to keep the order among style

154 - // tags up to date, so that CSS imported later overrides previous CSS.

155 - if (stylesheet) stylesheet.remove();

156 -

157 - stylesheet = document.createElement("style");

158 - stylesheet.setAttribute("id", "${filename}");

159 - document.head.appendChild(stylesheet);

160 -

161 - const styles = document.createTextNode(\`${code}\`);

162 - stylesheet.innerHTML = "";

163 - stylesheet.appendChild(styles);

164 - })();

165 - `;

166 - }

167 -

168 - const babelPlugins = getBabelPlugins(

169 - file?.language ?? null,

170 - enableForget,

171 - { flags: compilerFlags }

172 - );

173 -

174 - const babelOptions: TransformOptions = {

175 - presets: [["react", { runtime: "automatic" }]],

176 - plugins: babelPlugins,

177 - filename: filename.replace("./", ""),

178 - };

179 -

180 - /*

181 - TODO: Using the Babel Rollup plugin doesn't work out of the box due to

182 - this plugin treating the input tabs as a virtual file system. The Babel

183 - Rollup plugin's default configuration looks for files in the local file

184 - system, so it requires some set up for it to work (since it can work with

185 - this plugin in theory as Rollup plugins execute in turns by each hook).

186 - */

187 - const result = transform(code, babelOptions);

188 -

189 - if (!result?.code) this.error("Bundling failed.");

190 -

191 - return result.code;

192 - },

193 - };

194 -}

195 -

196 -/**

197 - * @see https://esm.sh/ - Development mode.

198 - */

199 -const dev = (url: string) => `${url}?dev`;

compiler/forget/packages/playground/lib/moduleBundler.ts deleted

-142

@@ -1,142 +0,0 @@

1 -/*

2 - * Copyright (c) Facebook, Inc. and its affiliates.

3 - */

4 -

5 -import { rollup } from "rollup";

6 -import forgetPlaygroundPlugin from "./forgetPlaygroundPlugin";

7 -import type { Store } from "./stores";

8 -import { minify } from "terser";

9 -import invariant from "invariant";

10 -import { gzip, strToU8 } from "fflate";

11 -import prettyBytes from "pretty-bytes";

12 -import { ForgetCompilerFlags } from "./compilerDriver";

13 -

14 -let bundleId = 0;

15 -const ROLLUP_ENTRY = "./_app.js";

16 -export interface BundleResult {

17 - id: number;

18 - res:

19 - | undefined

20 - | {

21 - getCode(version: "before" | "after", cacheBreakId?: number): string;

22 - codeSizeDiff: {

23 - min: string;

24 - minPercent: number;

25 - gzip: string;

26 - gzipPercent: number;

27 - };

28 - };

29 -}

30 -

31 -export const defaultBundleRes = {

32 - id: 0,

33 - res: undefined,

34 - messages: [],

35 -};

36 -

37 -export async function bundle(

38 - files: Store["files"],

39 - compilerFlags: ForgetCompilerFlags,

40 - reactVersion = "18.2.0"

41 -): Promise<BundleResult> {

42 - const codeAfter = await bundleWithRollup(

43 - files,

44 - true,

45 - reactVersion,

46 - compilerFlags

47 - );

48 - if (!codeAfter) return { id: bundleId, res: undefined };

49 -

50 - const codeBefore = await bundleWithRollup(

51 - files,

52 - false,

53 - reactVersion,

54 - compilerFlags

55 - );

56 - invariant(codeBefore, "codeBefore should be consistent with codeAfter.");

57 -

58 - const [minAfter, gzipAfter] = await compress(codeAfter);

59 - const [minBefore, gzipBefore] = await compress(codeBefore);

60 - return {

61 - id: bundleId++,

62 - res: {

63 - getCode(version: "before" | "after", cacheBreakId?: number): string {

64 - // Annotate with cache-busting bundleId and cacheBreakId to form unique moduleName.

65 - // @see https://twitter.com/Huxpro/status/1551017434462621696

66 - return `${

67 - version === "before" ? codeBefore : codeAfter

68 - } /* ${version} ${bundleId} ${cacheBreakId ?? ""} */`;

69 - },

70 - codeSizeDiff: {

71 - min: prettyBytes(minAfter - minBefore, { signed: true }),

72 - minPercent: getPercentage(minAfter, minBefore),

73 - gzip: prettyBytes(gzipAfter - gzipBefore, { signed: true }),

74 - gzipPercent: getPercentage(gzipAfter, gzipBefore),

75 - },

76 - },

77 - };

78 -}

79 -

80 -/**

81 - * Bundle @param files with Rollup.

82 - * @returns a tuple of bundled code (undefined when error) and messages.

83 - */

84 -async function bundleWithRollup(

85 - files: Store["files"],

86 - enableForget: boolean,

87 - reactVersion: string,

88 - compilerFlags: ForgetCompilerFlags

89 -): Promise<string | undefined> {

90 - try {

91 - const rollupBuild = await rollup({

92 - input: ROLLUP_ENTRY,

93 - plugins: [

94 - forgetPlaygroundPlugin({

95 - files,

96 - enableForget,

97 - reactVersion,

98 - compilerFlags,

99 - }),

100 - ],

101 - });

102 -

103 - const {

104 - output: [{ code }],

105 - } = await rollupBuild.generate({

106 - format: "esm",

107 - });

108 -

109 - return code;

110 - } catch (e) {

111 - return undefined;

112 - }

113 -}

114 -/**

115 - * Given @param code, @returns both minified and minified + gzipped code.

116 - */

117 -async function compress(code: string): Promise<[number, number]> {

118 - const minified = (await minify(code)).code;

119 - invariant(minified, "Must have valid minified code.");

120 - const minifiedSize = new Blob([minified]).size;

121 -

122 - const gzipped = await execGzip(minified);

123 - const gzippedSize = new Blob([gzipped]).size;

124 -

125 - return [minifiedSize, gzippedSize];

126 -}

127 -

128 -/**

129 - * @returns the percentage of @param a in relation to @param b.

130 - */

131 -function getPercentage(a: number, b: number): number {

132 - return ((a - b) / b) * 100;

133 -}

134 -

135 -function execGzip(code: string): Promise<Uint8Array> {

136 - return new Promise((resolve, reject) => {

137 - gzip(strToU8(code), (err, data) => {

138 - if (err) reject(err);

139 - resolve(data);

140 - });

141 - });

142 -}

compiler/forget/packages/playground/lib/patchUseMemoCache.ts deleted

-137

@@ -1,137 +0,0 @@

1 -/*

2 - * Copyright (c) Facebook, Inc. and its affiliates.

3 - */

4 -

5 -/**

6 - * Monkeypatch `useMemoCache` into `react`. The default export will be

7 - * used for Rollup to generate synthetic named exports.

8 - */

9 -export default function patchUseMemoCache(reactSource: string) {

10 - return `\

11 - import React from "${reactSource}";

12 -

13 - const REACT_MEMOCACHE_SENTINEL = Symbol.for('react.memocache_sentinel');

14 -

15 - function useMemoCache(i) {

16 - "use no forget";

17 - const $ = new Array(i).fill(REACT_MEMOCACHE_SENTINEL)

18 - $._ = REACT_MEMOCACHE_SENTINEL

19 - const ref = React.useRef($);

20 - return ref.current;

21 - };

22 -

23 - useMemoCache.read = function (memoCache, index) {

24 - const value = memoCache[index];

25 - if (value === REACT_MEMOCACHE_SENTINEL) {

26 - throw new Error('useMemoCache.read: read before write');

27 - }

28 - return value;

29 - };

30 -

31 - // Utility functions

32 - function isWriteable(desc) {

33 - return (desc.writable || desc.set) && desc.configurable;

34 - }

35 - function getOrInsertDefault(m, k) {

36 - const entry = m.get(k);

37 - if (entry) {

38 - return { existed: true, entry };

39 - }

40 - else {

41 - const newEntry = new Map();

42 - m.set(k, newEntry);

43 - return { existed: false, entry: newEntry };

44 - }

45 - }

46 - function buildMakeReadOnly(logger, skippedClasses, isInROMode) {

47 - // All saved proxys

48 - const savedROObjects = new WeakMap();

49 - // Overwrites an object property with its proxy and saves its original value

50 - function addProperty(obj, key, prop, savedEntries) {

51 - const proxy = {

52 - get() {

53 - // read from backing cache entry

54 - return makeReadOnly(savedEntries.get(key).savedVal);

55 - },

56 - set(newVal) {

57 - if (isInROMode()) {

58 - logger("FORGET_MUTATE_IMMUT", key, newVal);

59 - }

60 - // update backing cache entry

61 - savedEntries.get(key).savedVal = newVal;

62 - },

63 - };

64 - if (prop.configurable != null) {

65 - proxy.configurable = prop.configurable;

66 - }

67 - if (prop.enumerable != null) {

68 - proxy.enumerable = prop.enumerable;

69 - }

70 - savedEntries.set(key, { savedVal: obj[key], getter: proxy.get });

71 - Object.defineProperty(obj, key, proxy);

72 - }

73 - // Changes an object to be read-only, returns its input

74 - function makeReadOnly(o) {

75 - if (typeof o !== "object" || o == null) {

76 - return o;

77 - }

78 - else if (skippedClasses.includes(o.constructor.name)) {

79 - return o;

80 - }

81 - const { existed, entry: cache } = getOrInsertDefault(savedROObjects, o);

82 - for (const [k, entry] of cache.entries()) {

83 - const currentProp = Object.getOwnPropertyDescriptor(o, k);

84 - if (currentProp && !isWriteable(currentProp)) {

85 - continue;

86 - }

87 - const currentPropGetter = currentProp?.get;

88 - const cachedGetter = entry.getter;

89 - if (currentPropGetter !== cachedGetter) {

90 - // cache is currently holding an old property

91 - // - it may have been deleted

92 - // - it may have been deleted + re-set

93 - // (meaning that new value is not proxied,

94 - // and the current proxied value is stale)

95 - cache.delete(k);

96 - if (!currentProp && isInROMode()) {

97 - logger("FORGET_DELETE_PROP_IMMUT", k);

98 - }

99 - else if (currentProp) {

100 - if (isInROMode()) {

101 - logger("FORGET_CHANGE_PROP_IMMUT", k);

102 - }

103 - addProperty(o, k, currentProp, cache);

104 - }

105 - }

106 - }

107 - for (const [k, prop] of Object.entries(Object.getOwnPropertyDescriptors(o))) {

108 - if (!cache.has(k) && isWriteable(prop)) {

109 - if (isInROMode() && existed) {

110 - logger("FORGET_ADD_PROP_IMMUT", k);

111 - }

112 - addProperty(o, k, prop, cache);

113 - }

114 - }

115 - return o;

116 - }

117 - return makeReadOnly;

118 - }

119 -

120 - useMemoCache.makeReadOnly = buildMakeReadOnly(

121 - console.log,

122 - [

123 - // some immutVals have a transitive reference to global (e.g. LexicalEditor)

124 - 'Window',

125 - 'Storage', // useBrowserStorage

126 - // some immutVals (e.g. ref.current) have a ref to DOM nodes (e.g. BaseDOMContainer)

127 - // - since FiberNodes -should- be interior mutable, this is safe

128 - 'FiberNode',

129 - ],

130 - () => true, // always read-only

131 - );

132 -

133 - React.unstable_useMemoCache = React.useMemoCache = useMemoCache;

134 -

135 - export default React;

136 - `;

137 -}

compiler/forget/packages/playground/lib/stores/messages.ts

-1

@@ -4,7 +4,6 @@

5 export enum MessageSource {

6 Babel,

7 - Rollup,

7 Forget,

8 Playground,

9 }

compiler/forget/packages/playground/lib/stores/store.ts

+4 -95

@@ -2,106 +2,22 @@

2 * Copyright (c) Facebook, Inc. and its affiliates.

3 */

5 -import { createCompilerFlags, OutputKind } from "babel-plugin-react-forget";

5 +import { createCompilerFlags } from "babel-plugin-react-forget";

6 import invariant from "invariant";

7 import { defaultStore } from "../defaultStore";

8 import { codec } from "../utils";

9 import { ForgetCompilerFlags } from "../compilerDriver";

10 import { parseCompilerFlags } from "babel-plugin-react-forget";

12 -export enum FileExt {

13 - js = "javascript",

14 - jsx = "javascript",

15 - ts = "typescript",

16 - tsx = "typescript",

17 - css = "css",

18 -}

19 -

20 -export interface InputFile {

21 - id: string;

22 - language: string;

23 - content: string;

24 -}

25 -

26 -/**

27 - * Match @param fileId with valid FileExt's.

28 - */

29 -export function matchFileId(fileId: string) {

30 - return fileId.match(new RegExp(`.+\\.(${Object.keys(FileExt).join("|")})$`));

31 -}

32 -

33 -/**

34 - * Refine @param ext string to a key in FileExt.

35 - */

36 -function isValidFileExt(ext: string): ext is keyof typeof FileExt {

37 - return Object.keys(FileExt).includes(ext);

38 -}

39 -

40 -/**

41 - * Checks if @param id is a valid file ID.

42 - * @returns an input file that may or may not be a valid input tab to add to Store.

43 - */

44 -export function createInputFile(id: string, content: string): InputFile {

45 - const match = matchFileId(id);

46 - if (!match || !isValidFileExt(match[1])) {

47 - throw new Error(

48 - `Invalid tab name or extension. The tab must have a name and a supported extension (${Object.keys(

49 - FileExt

50 - ).join(", ")}).`

51 - );

52 - }

53 -

54 - return {

55 - id,

56 - language: FileExt[match[1]],

57 - content,

58 - };

59 -}

60 -

61 -export function checkInputFile(

62 - inputFile: InputFile,

63 - fromFile: InputFile | undefined,

64 - store: Store

65 -) {

66 - const isDuplicateFileId =

67 - store.files.find((file) => file.id === inputFile.id) !== undefined;

68 - if (isDuplicateFileId) {

69 - throw new Error(`A tab with ID "${inputFile.id}" already exists.`);

70 - }

71 -

72 - const isIndexLikeId = (id: string) => /^index\..*$/.test(id);

73 - const fromIndex = fromFile && isIndexLikeId(fromFile.id);

74 - if (fromIndex && !isIndexLikeId(inputFile.id)) {

75 - throw new Error(`Only the file extension of the index tab can be changed.`);

76 - }

77 - if (!fromIndex && isIndexLikeId(inputFile.id)) {

78 - throw new Error(`Only the index tab can be named as "index".`);

79 - }

80 -}

81 -

12 /**

13 * Global Store for Playground

14 */

15 export interface Store {

86 - /**

87 - * Input tabs. The key is FileId joined by a dot.

88 - *

89 - * @example "index.js" => { id: "index.js", language: "javascript", content: "// index.js", isIdEditable: false }

90 - */

91 - files: InputFile[];

16 + source: string;

93 - selectedFileId: string;

94 -

95 - /* Compiler settings */

18 compilerFlags: ForgetCompilerFlags;

19 }

99 -export function getSelectedFile(store: Store): InputFile {

100 - const selectedFile = store.files.find((f) => f.id === store.selectedFileId);

101 - invariant(selectedFile, "Selected file must exists.");

102 - return selectedFile;

103 -}

104 -

21 /**

22 * Serialize, encode, and save @param store to localStorage and update URL.

23 */

@@ -113,20 +29,13 @@ export function saveStore(store: Store) {

30 /**

31 * Check if @param raw is a valid Store by if

116 - * - it has a `files` property and is an Array

117 - * - it has a `selectedFileId` property and is a string

118 - * - its `selectedFileId` has a corresponding file in `files`

32 + * - it has a `source` property and is a string

33 */

34 function getValidStore(raw: any): Store | null {

35 if ("compilerFlags" in raw && !(raw["compilerFlags"] instanceof Object)) {

36 return null;

37 }

124 - const isValidStore =

125 - "files" in raw &&

126 - raw["files"] instanceof Array &&

127 - "selectedFileId" in raw &&

128 - typeof raw["selectedFileId"] === "string" &&

129 - raw["files"].find((f) => f.id === raw["selectedFileId"]);

38 + const isValidStore = "source" in raw && typeof raw["source"] === "string";

39 if (isValidStore) {

40 if ("compilerFlags" in raw) {

41 // Merge flags from decoded store into flags valid for this compiler version

compiler/forget/packages/playground/package.json

+1 -8

@@ -11,26 +11,19 @@

11 },

12 "dependencies": {

13 "@babel/standalone": "^7.18.4",

14 - "@emotion/react": "^11.9.3",

15 - "@emotion/styled": "^11.9.3",

14 "@heroicons/react": "^1.0.6",

15 "@hpcc-js/wasm": "^1.15.0",

16 "@monaco-editor/react": "^4.4.5",

19 - "@mui/material": "^5.9.1",

17 "@use-gesture/react": "^10.2.20",

21 - "fflate": "^0.7.3",

18 "hermes-eslint": "^0.9.0",

19 "invariant": "^2.2.4",

20 "monaco-editor": "^0.33.0",

21 "next": "12.1.6",

22 "notistack": "^3.0.0-alpha.7",

23 "prettier": "^2.6.2",

28 - "pretty-bytes": "^6.0.0",

24 "pretty-format": "^28.1.3",

25 "react": "18.1.0",

31 - "react-dom": "18.1.0",

32 - "rollup": "^2.75.7",

33 - "terser": "^5.14.2"

26 + "react-dom": "18.1.0"

27 },

28 "devDependencies": {

29 "@types/babel__standalone": "^7.1.4",

compiler/forget/packages/playground/yarn.lock

+12 -420

@@ -48,18 +48,6 @@

48 "@babel/template" "^7.18.10"

49 "@babel/types" "^7.19.0"

51 -"@babel/helper-module-imports@^7.12.13":

52 - version "7.18.6"

53 - resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.18.6.tgz#1e3ebdbbd08aad1437b428c50204db13c5a3ca6e"

54 - integrity sha512-0NFvs3VkuSYbFi1x2Vd6tKrywq+z/cLeYC/RJNFrIX/30Bf5aiGYbtvGXolEktzJH8o5E5KJ3tT+nkxuuZFVlA==

55 - dependencies:

56 - "@babel/types" "^7.18.6"

57 -

58 -"@babel/helper-plugin-utils@^7.18.6":

59 - version "7.18.9"

60 - resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.18.9.tgz#4b8aea3b069d8cb8a72cdfe28ddf5ceca695ef2f"

61 - integrity sha512-aBXPT3bmtLryXaoJLyYPXPlSD4p1ld9aYeR+sJNOZjJJGiOpb+fKfh3NkcCu7J54nUJwCERPBExCCpyCOHnu/w==

62 -

51 "@babel/helper-split-export-declaration@^7.0.0":

52 version "7.18.6"

53 resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.18.6.tgz#7367949bc75b20c6d5a5d4a97bba2824ae8ef075"

@@ -105,13 +93,6 @@

93 resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.19.1.tgz#6f6d6c2e621aad19a92544cc217ed13f1aac5b4c"

94 integrity sha512-h7RCSorm1DdTVGJf3P2Mhj3kdnkmF/EiysUkzS2TdgAYqyjFdMQJbVuXOBej2SBJaXan/lIVtT6KkGbyyq753A==

108 -"@babel/plugin-syntax-jsx@^7.12.13":

109 - version "7.18.6"

110 - resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.18.6.tgz#a8feef63b010150abd97f1649ec296e849943ca0"

111 - integrity sha512-6mmljtAedFGTWu2p/8WIORGwy+61PLgOMPOdazc7YoJ9ZCWUyFy3A6CpPkRKLKD1ToAesxX8KGEViAiLo9N+7Q==

112 - dependencies:

113 - "@babel/helper-plugin-utils" "^7.18.6"

114 -

96 "@babel/runtime-corejs3@^7.10.2":

97 version "7.18.3"

98 resolved "https://registry.yarnpkg.com/@babel/runtime-corejs3/-/runtime-corejs3-7.18.3.tgz#52f0241a31e0ec61a6187530af6227c2846bd60c"

@@ -127,13 +108,6 @@

108 dependencies:

109 regenerator-runtime "^0.13.4"

110

130 -"@babel/runtime@^7.13.10", "@babel/runtime@^7.17.2", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.7":

131 - version "7.18.9"

132 - resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.18.9.tgz#b4fcfce55db3d2e5e080d2490f608a3b9f407f4a"

133 - integrity sha512-lkqXDcvlFT5rvEjiu6+QYO+1GXrEHRo2LOtS7E4GtX5ESIZOgepqsZBVIj6Pv+a6zqsya9VCgiK1KAK4BvJDAw==

134 - dependencies:

135 - regenerator-runtime "^0.13.4"

136 -

111 "@babel/standalone@^7.18.4":

112 version "7.18.5"

113 resolved "https://registry.yarnpkg.com/@babel/standalone/-/standalone-7.18.5.tgz#69aeb99edacb55c509895d7fa6131ec9dbda7c6d"

@@ -189,107 +163,6 @@

163 "@babel/helper-validator-identifier" "^7.18.6"

164 to-fast-properties "^2.0.0"

165

192 -"@emotion/babel-plugin@^11.7.1":

193 - version "11.9.2"

194 - resolved "https://registry.yarnpkg.com/@emotion/babel-plugin/-/babel-plugin-11.9.2.tgz#723b6d394c89fb2ef782229d92ba95a740576e95"

195 - integrity sha512-Pr/7HGH6H6yKgnVFNEj2MVlreu3ADqftqjqwUvDy/OJzKFgxKeTQ+eeUf20FOTuHVkDON2iNa25rAXVYtWJCjw==

196 - dependencies:

197 - "@babel/helper-module-imports" "^7.12.13"

198 - "@babel/plugin-syntax-jsx" "^7.12.13"

199 - "@babel/runtime" "^7.13.10"

200 - "@emotion/hash" "^0.8.0"

201 - "@emotion/memoize" "^0.7.5"

202 - "@emotion/serialize" "^1.0.2"

203 - babel-plugin-macros "^2.6.1"

204 - convert-source-map "^1.5.0"

205 - escape-string-regexp "^4.0.0"

206 - find-root "^1.1.0"

207 - source-map "^0.5.7"

208 - stylis "4.0.13"

209 -

210 -"@emotion/cache@^11.9.3":

211 - version "11.9.3"

212 - resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-11.9.3.tgz#96638449f6929fd18062cfe04d79b29b44c0d6cb"

213 - integrity sha512-0dgkI/JKlCXa+lEXviaMtGBL0ynpx4osh7rjOXE71q9bIF8G+XhJgvi+wDu0B0IdCVx37BffiwXlN9I3UuzFvg==

214 - dependencies:

215 - "@emotion/memoize" "^0.7.4"

216 - "@emotion/sheet" "^1.1.1"

217 - "@emotion/utils" "^1.0.0"

218 - "@emotion/weak-memoize" "^0.2.5"

219 - stylis "4.0.13"

220 -

221 -"@emotion/hash@^0.8.0":

222 - version "0.8.0"

223 - resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.8.0.tgz#bbbff68978fefdbe68ccb533bc8cbe1d1afb5413"

224 - integrity sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==

225 -

226 -"@emotion/is-prop-valid@^1.1.3":

227 - version "1.1.3"

228 - resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-1.1.3.tgz#f0907a416368cf8df9e410117068e20fe87c0a3a"

229 - integrity sha512-RFg04p6C+1uO19uG8N+vqanzKqiM9eeV1LDOG3bmkYmuOj7NbKNlFC/4EZq5gnwAIlcC/jOT24f8Td0iax2SXA==

230 - dependencies:

231 - "@emotion/memoize" "^0.7.4"

232 -

233 -"@emotion/memoize@^0.7.4", "@emotion/memoize@^0.7.5":

234 - version "0.7.5"

235 - resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.5.tgz#2c40f81449a4e554e9fc6396910ed4843ec2be50"

236 - integrity sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==

237 -

238 -"@emotion/react@^11.9.3":

239 - version "11.9.3"

240 - resolved "https://registry.yarnpkg.com/@emotion/react/-/react-11.9.3.tgz#f4f4f34444f6654a2e550f5dab4f2d360c101df9"

241 - integrity sha512-g9Q1GcTOlzOEjqwuLF/Zd9LC+4FljjPjDfxSM7KmEakm+hsHXk+bYZ2q+/hTJzr0OUNkujo72pXLQvXj6H+GJQ==

242 - dependencies:

243 - "@babel/runtime" "^7.13.10"

244 - "@emotion/babel-plugin" "^11.7.1"

245 - "@emotion/cache" "^11.9.3"

246 - "@emotion/serialize" "^1.0.4"

247 - "@emotion/utils" "^1.1.0"

248 - "@emotion/weak-memoize" "^0.2.5"

249 - hoist-non-react-statics "^3.3.1"

250 -

251 -"@emotion/serialize@^1.0.2", "@emotion/serialize@^1.0.4":

252 - version "1.0.4"

253 - resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-1.0.4.tgz#ff31fd11bb07999611199c2229e152faadc21a3c"

254 - integrity sha512-1JHamSpH8PIfFwAMryO2bNka+y8+KA5yga5Ocf2d7ZEiJjb7xlLW7aknBGZqJLajuLOvJ+72vN+IBSwPlXD1Pg==

255 - dependencies:

256 - "@emotion/hash" "^0.8.0"

257 - "@emotion/memoize" "^0.7.4"

258 - "@emotion/unitless" "^0.7.5"

259 - "@emotion/utils" "^1.0.0"

260 - csstype "^3.0.2"

261 -

262 -"@emotion/sheet@^1.1.1":

263 - version "1.1.1"

264 - resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-1.1.1.tgz#015756e2a9a3c7c5f11d8ec22966a8dbfbfac787"

265 - integrity sha512-J3YPccVRMiTZxYAY0IOq3kd+hUP8idY8Kz6B/Cyo+JuXq52Ek+zbPbSQUrVQp95aJ+lsAW7DPL1P2Z+U1jGkKA==

266 -

267 -"@emotion/styled@^11.9.3":

268 - version "11.9.3"

269 - resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-11.9.3.tgz#47f0c71137fec7c57035bf3659b52fb536792340"

270 - integrity sha512-o3sBNwbtoVz9v7WB1/Y/AmXl69YHmei2mrVnK7JgyBJ//Rst5yqPZCecEJlMlJrFeWHp+ki/54uN265V2pEcXA==

271 - dependencies:

272 - "@babel/runtime" "^7.13.10"

273 - "@emotion/babel-plugin" "^11.7.1"

274 - "@emotion/is-prop-valid" "^1.1.3"

275 - "@emotion/serialize" "^1.0.4"

276 - "@emotion/utils" "^1.1.0"

277 -

278 -"@emotion/unitless@^0.7.5":

279 - version "0.7.5"

280 - resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.7.5.tgz#77211291c1900a700b8a78cfafda3160d76949ed"

281 - integrity sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==

282 -

283 -"@emotion/utils@^1.0.0", "@emotion/utils@^1.1.0":

284 - version "1.1.0"

285 - resolved "https://registry.yarnpkg.com/@emotion/utils/-/utils-1.1.0.tgz#86b0b297f3f1a0f2bdb08eeac9a2f49afd40d0cf"

286 - integrity sha512-iRLa/Y4Rs5H/f2nimczYmS5kFJEbpiVvgN3XVfZ022IYhuNA1IRSHEizcof88LtCTXtl9S2Cxt32KgaXEu72JQ==

287 -

288 -"@emotion/weak-memoize@^0.2.5":

289 - version "0.2.5"

290 - resolved "https://registry.yarnpkg.com/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz#8eed982e2ee6f7f4e44c253e12962980791efd46"

291 - integrity sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==

292 -

166 "@eslint/eslintrc@^1.3.3":

167 version "1.3.3"

168 resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-1.3.3.tgz#2b044ab39fdfa75b4688184f9e573ce3c5b0ff95"

@@ -343,46 +216,6 @@

216 dependencies:

217 "@sinclair/typebox" "^0.24.1"

218

346 -"@jridgewell/gen-mapping@^0.3.0":

347 - version "0.3.1"

348 - resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.1.tgz#cf92a983c83466b8c0ce9124fadeaf09f7c66ea9"

349 - integrity sha512-GcHwniMlA2z+WFPWuY8lp3fsza0I8xPFMWL5+n8LYyP6PSvPrXf4+n8stDHZY2DM0zy9sVkRDy1jDI4XGzYVqg==

350 - dependencies:

351 - "@jridgewell/set-array" "^1.0.0"

352 - "@jridgewell/sourcemap-codec" "^1.4.10"

353 - "@jridgewell/trace-mapping" "^0.3.9"

354 -

355 -"@jridgewell/resolve-uri@^3.0.3":

356 - version "3.0.7"

357 - resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.0.7.tgz#30cd49820a962aff48c8fffc5cd760151fca61fe"

358 - integrity sha512-8cXDaBBHOr2pQ7j77Y6Vp5VDT2sIqWyWQ56TjEq4ih/a4iST3dItRe8Q9fp0rrIl9DoKhWQtUQz/YpOxLkXbNA==

359 -

360 -"@jridgewell/set-array@^1.0.0":

361 - version "1.1.1"

362 - resolved "https://registry.yarnpkg.com/@jridgewell/set-array/-/set-array-1.1.1.tgz#36a6acc93987adcf0ba50c66908bd0b70de8afea"

363 - integrity sha512-Ct5MqZkLGEXTVmQYbGtx9SVqD2fqwvdubdps5D3djjAkgkKwT918VNOz65pEHFaYTeWcukmJmH5SwsA9Tn2ObQ==

364 -

365 -"@jridgewell/source-map@^0.3.2":

366 - version "0.3.2"

367 - resolved "https://registry.yarnpkg.com/@jridgewell/source-map/-/source-map-0.3.2.tgz#f45351aaed4527a298512ec72f81040c998580fb"

368 - integrity sha512-m7O9o2uR8k2ObDysZYzdfhb08VuEml5oWGiosa1VdaPZ/A6QyPkAJuwN0Q1lhULOf6B7MtQmHENS743hWtCrgw==

369 - dependencies:

370 - "@jridgewell/gen-mapping" "^0.3.0"

371 - "@jridgewell/trace-mapping" "^0.3.9"

372 -

373 -"@jridgewell/sourcemap-codec@^1.4.10":

374 - version "1.4.13"

375 - resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.13.tgz#b6461fb0c2964356c469e115f504c95ad97ab88c"

376 - integrity sha512-GryiOJmNcWbovBxTfZSF71V/mXbgcV3MewDe3kIMCLyIh5e7SKAeUZs+rMnJ8jkMolZ/4/VsdBmMrw3l+VdZ3w==

377 -

378 -"@jridgewell/trace-mapping@^0.3.9":

379 - version "0.3.13"

380 - resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.13.tgz#dcfe3e95f224c8fe97a87a5235defec999aa92ea"

381 - integrity sha512-o1xbKhp9qnIAoHJSWd6KlCZfqslL4valSF81H8ImioOAxluWYWOpWkpyktY2vnt4tbrX9XYaxovq6cgowaJp2w==

382 - dependencies:

383 - "@jridgewell/resolve-uri" "^3.0.3"

384 - "@jridgewell/sourcemap-codec" "^1.4.10"

385 -

219 "@monaco-editor/loader@^1.3.2":

220 version "1.3.2"

221 resolved "https://registry.yarnpkg.com/@monaco-editor/loader/-/loader-1.3.2.tgz#04effbb87052d19cd7d3c9d81c0635490f9bb6d8"

@@ -398,86 +231,6 @@

231 "@monaco-editor/loader" "^1.3.2"

232 prop-types "^15.7.2"

233

401 -"@mui/base@5.0.0-alpha.90":

402 - version "5.0.0-alpha.90"

403 - resolved "https://registry.yarnpkg.com/@mui/base/-/base-5.0.0-alpha.90.tgz#73700ba74e5c75096ee5d0bfe3ba4a3b3b81beef"

404 - integrity sha512-hNKwzr+RkiuGsGrakz8Q2i5ezr4Dz4b4Qsdipt9SiMrhuFAra/i501VSaEIzwec9LC4G+vtW4fE7yJBB0XaAYw==

405 - dependencies:

406 - "@babel/runtime" "^7.17.2"

407 - "@emotion/is-prop-valid" "^1.1.3"

408 - "@mui/types" "^7.1.4"

409 - "@mui/utils" "^5.9.1"

410 - "@popperjs/core" "^2.11.5"

411 - clsx "^1.2.1"

412 - prop-types "^15.8.1"

413 - react-is "^18.2.0"

414 -

415 -"@mui/material@^5.9.1":

416 - version "5.9.1"

417 - resolved "https://registry.yarnpkg.com/@mui/material/-/material-5.9.1.tgz#92990e6d4035792430dcf548b91db6f335aebdd3"

418 - integrity sha512-c09SbaMm7Rl7Df9JRkXwPWNbnfrutmHERTJC46OJ9OMAM9+HGQihIbGln1k2Xj65jb3E+G498FZFAoSrrBDvwQ==

419 - dependencies:

420 - "@babel/runtime" "^7.17.2"

421 - "@mui/base" "5.0.0-alpha.90"

422 - "@mui/system" "^5.9.1"

423 - "@mui/types" "^7.1.4"

424 - "@mui/utils" "^5.9.1"

425 - "@types/react-transition-group" "^4.4.5"

426 - clsx "^1.2.1"

427 - csstype "^3.1.0"

428 - prop-types "^15.8.1"

429 - react-is "^18.2.0"

430 - react-transition-group "^4.4.2"

431 -

432 -"@mui/private-theming@^5.9.1":

433 - version "5.9.1"

434 - resolved "https://registry.yarnpkg.com/@mui/private-theming/-/private-theming-5.9.1.tgz#4f714ed9ebd587373dc77b3fc69e9f3e720f0190"

435 - integrity sha512-eIh2IZJInNTdgPLMo9cruzm8UDX5amBBxxsSoNre7lRj3wcsu3TG5OKjIbzkf4VxHHEhdPeNNQyt92k7L78u2A==

436 - dependencies:

437 - "@babel/runtime" "^7.17.2"

438 - "@mui/utils" "^5.9.1"

439 - prop-types "^15.8.1"

440 -

441 -"@mui/styled-engine@^5.8.7":

442 - version "5.8.7"

443 - resolved "https://registry.yarnpkg.com/@mui/styled-engine/-/styled-engine-5.8.7.tgz#63d0779c07677fe76d4705a02c7ae99f89b50780"

444 - integrity sha512-tVqtowjbYmiRq+qcqXK731L9eWoL9H8xTRhuTgaDGKdch1zlt4I2UwInUe1w2N9N/u3/jHsFbLcl1Un3uOwpQg==

445 - dependencies:

446 - "@babel/runtime" "^7.17.2"

447 - "@emotion/cache" "^11.9.3"

448 - csstype "^3.1.0"

449 - prop-types "^15.8.1"

450 -

451 -"@mui/system@^5.9.1":

452 - version "5.9.1"

453 - resolved "https://registry.yarnpkg.com/@mui/system/-/system-5.9.1.tgz#dadd1094b1582781cc524b112a0a126f60b23c25"

454 - integrity sha512-ZixTmc2+sYp++avoYJ38eM70nfwwudN06vYCU4kfwa4nQPiH+bhLYZnfYkcXRKiDR/hfT0dptbOOfQGZqBYczQ==

455 - dependencies:

456 - "@babel/runtime" "^7.17.2"

457 - "@mui/private-theming" "^5.9.1"

458 - "@mui/styled-engine" "^5.8.7"

459 - "@mui/types" "^7.1.4"

460 - "@mui/utils" "^5.9.1"

461 - clsx "^1.2.1"

462 - csstype "^3.1.0"

463 - prop-types "^15.8.1"

464 -

465 -"@mui/types@^7.1.4":

466 - version "7.1.4"

467 - resolved "https://registry.yarnpkg.com/@mui/types/-/types-7.1.4.tgz#4185c05d6df63ec673cda15feab80440abadc764"

468 - integrity sha512-uveM3byMbthO+6tXZ1n2zm0W3uJCQYtwt/v5zV5I77v2v18u0ITkb8xwhsDD2i3V2Kye7SaNR6FFJ6lMuY/WqQ==

469 -

470 -"@mui/utils@^5.9.1":

471 - version "5.9.1"

472 - resolved "https://registry.yarnpkg.com/@mui/utils/-/utils-5.9.1.tgz#2b2c9dadbf8ba6561e145b5688fb7df5ef15a934"

473 - integrity sha512-8+4adOR3xusyJwvbnZxcjqcmbWvl7Og+260ZKIrSvwnFs0aLubL+8MhiceeDDGcmb0bTKxfUgRJ96j32Jb7P+A==

474 - dependencies:

475 - "@babel/runtime" "^7.17.2"

476 - "@types/prop-types" "^15.7.5"

477 - "@types/react-is" "^16.7.1 || ^17.0.0"

478 - prop-types "^15.8.1"

479 - react-is "^18.2.0"

480 -

234 "@next/env@12.1.6":

235 version "12.1.6"

236 resolved "https://registry.yarnpkg.com/@next/env/-/env-12.1.6.tgz#5f44823a78335355f00f1687cfc4f1dafa3eca08"

@@ -571,11 +324,6 @@

324 "@nodelib/fs.scandir" "2.1.5"

325 fastq "^1.6.0"

326

574 -"@popperjs/core@^2.11.5":

575 - version "2.11.5"

576 - resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.11.5.tgz#db5a11bf66bdab39569719555b0f76e138d7bd64"

577 - integrity sha512-9X2obfABZuDVLCgPK9aX0a/x4jaOEweTTWE2+9sr0Qqqevj2Uv5XorvusThmc9XGYpS9yI+fhh8RTafBtGposw==

578 -

327 "@rushstack/eslint-patch@^1.1.3":

328 version "1.1.3"

329 resolved "https://registry.yarnpkg.com/@rushstack/eslint-patch/-/eslint-patch-1.1.3.tgz#6801033be7ff87a6b7cadaf5b337c9f366a3c4b0"

@@ -603,17 +351,12 @@

351 resolved "https://registry.yarnpkg.com/@types/node/-/node-17.0.40.tgz#76ee88ae03650de8064a6cf75b8d95f9f4a16090"

352 integrity sha512-UXdBxNGqTMtm7hCwh9HtncFVLrXoqA3oJW30j6XWp5BH/wu3mVeaxo7cq5benFdBw34HB3XDT2TRPI7rXZ+mDg==

353

606 -"@types/parse-json@^4.0.0":

607 - version "4.0.0"

608 - resolved "https://registry.yarnpkg.com/@types/parse-json/-/parse-json-4.0.0.tgz#2f8bb441434d163b35fb8ffdccd7138927ffb8c0"

609 - integrity sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==

610 -

354 "@types/prettier@^2.6.3":

355 version "2.6.3"

356 resolved "https://registry.yarnpkg.com/@types/prettier/-/prettier-2.6.3.tgz#68ada76827b0010d0db071f739314fa429943d0a"

357 integrity sha512-ymZk3LEC/fsut+/Q5qejp6R9O1rMxz3XaRHDV6kX8MrGAhOSPqVARbDi+EZvInBpw+BnCX3TD240byVkOfQsHg==

358

616 -"@types/prop-types@*", "@types/prop-types@^15.7.5":

359 +"@types/prop-types@*":

360 version "15.7.5"

361 resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.5.tgz#5f19d2b85a98e9558036f6a3cacc8819420f05cf"

362 integrity sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==

@@ -625,20 +368,6 @@

368 dependencies:

369 "@types/react" "*"

370

628 -"@types/react-is@^16.7.1 || ^17.0.0":

629 - version "17.0.3"

630 - resolved "https://registry.yarnpkg.com/@types/react-is/-/react-is-17.0.3.tgz#2d855ba575f2fc8d17ef9861f084acc4b90a137a"

631 - integrity sha512-aBTIWg1emtu95bLTLx0cpkxwGW3ueZv71nE2YFBpL8k/z5czEW8yYpOo8Dp+UUAFAtKwNaOsh/ioSeQnWlZcfw==

632 - dependencies:

633 - "@types/react" "*"

634 -

635 -"@types/react-transition-group@^4.4.5":

636 - version "4.4.5"

637 - resolved "https://registry.yarnpkg.com/@types/react-transition-group/-/react-transition-group-4.4.5.tgz#aae20dcf773c5aa275d5b9f7cdbca638abc5e416"

638 - integrity sha512-juKD/eiSM3/xZYzjuzH6ZwpP+/lejltmiS3QEzV/vmb/Q8+HfDmxu+Baga8UEMGBqV88Nbg4l2hY/K2DkyaLLA==

639 - dependencies:

640 - "@types/react" "*"

641 -

371 "@types/react@*", "@types/react@18.0.12":

372 version "18.0.12"

373 resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.12.tgz#cdaa209d0a542b3fcf69cf31a03976ec4cdd8840"

@@ -733,7 +462,7 @@ acorn@^7.0.0:

462 resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.1.tgz#feaed255973d2e77555b83dbc08851a6c63520fa"

463 integrity sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==

464

736 -acorn@^8.5.0, acorn@^8.8.0:

465 +acorn@^8.8.0:

466 version "8.8.0"

467 resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.8.0.tgz#88c0187620435c7f6015803f5539dae05a9dbea8"

468 integrity sha512-QOxyigPVrpZ2GXT+PFyZTl6TtOFc5egxHIP9IlQ+RbupQuX4RkT/Bee4/kQuC02Xkzg84JcT7oLYtDIQxp+v7w==

@@ -861,15 +590,6 @@ axobject-query@^2.2.0:

590 resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-2.2.0.tgz#943d47e10c0b704aa42275e20edf3722648989be"

591 integrity sha512-Td525n+iPOOyUQIeBfcASuG6uJsDOITl7Mds5gFyerkWiX7qhUTdYUBlSgNMyVqtSJqwpt1kXGLdUt6SykLMRA==

592

864 -babel-plugin-macros@^2.6.1:

865 - version "2.8.0"

866 - resolved "https://registry.yarnpkg.com/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz#0f958a7cc6556b1e65344465d99111a1e5e10138"

867 - integrity sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg==

868 - dependencies:

869 - "@babel/runtime" "^7.7.2"

870 - cosmiconfig "^6.0.0"

871 - resolve "^1.12.0"

872 -

593 balanced-match@^1.0.0:

594 version "1.0.2"

595 resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"

@@ -906,11 +626,6 @@ browserslist@^4.20.3:

626 node-releases "^2.0.5"

627 picocolors "^1.0.0"

628

909 -buffer-from@^1.0.0:

910 - version "1.1.2"

911 - resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.2.tgz#2b146a6fd72e80b4f55d255f35ed59a3a9a41bd5"

912 - integrity sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==

913 -

629 call-bind@^1.0.0, call-bind@^1.0.2:

630 version "1.0.2"

631 resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.2.tgz#b1d4e89e688119c3c9a903ad30abb2f6a919be3c"

@@ -975,7 +690,7 @@ cliui@^7.0.2:

690 strip-ansi "^6.0.0"

691 wrap-ansi "^7.0.0"

692

978 -clsx@^1.1.0, clsx@^1.2.1:

693 +clsx@^1.1.0:

694 version "1.2.1"

695 resolved "https://registry.yarnpkg.com/clsx/-/clsx-1.2.1.tgz#0ddc4a20a549b59c93a4116bb26f5294ca17dc12"

696 integrity sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==

@@ -1009,17 +724,12 @@ color-name@^1.1.4, color-name@~1.1.4:

724 resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"

725 integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==

726

1012 -commander@^2.20.0:

1013 - version "2.20.3"

1014 - resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33"

1015 - integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==

1016 -

727 concat-map@0.0.1:

728 version "0.0.1"

729 resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"

730 integrity sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==

731

1022 -convert-source-map@^1.1.0, convert-source-map@^1.5.0:

732 +convert-source-map@^1.1.0:

733 version "1.8.0"

734 resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.8.0.tgz#f3373c32d21b4d780dd8004514684fb791ca4369"

735 integrity sha512-+OQdjP49zViI/6i7nIJpA8rAl4sV/JdPfU9nZs3VqOwGIgizICvuN2ru6fMd+4llL0tar18UYJXfZ/TWtmhUjA==

@@ -1031,17 +741,6 @@ core-js-pure@^3.20.2:

741 resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.23.1.tgz#0b27e4c3ad46178b84e790dbbb81987218ab82ad"

742 integrity sha512-3qNgf6TqI3U1uhuSYRzJZGfFd4T+YlbyVPl+jgRiKjdZopvG4keZQwWZDAWpu1UH9nCgTpUzIV3GFawC7cJsqg==

743

1034 -cosmiconfig@^6.0.0:

1035 - version "6.0.0"

1036 - resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-6.0.0.tgz#da4fee853c52f6b1e6935f41c1a2fc50bd4a9982"

1037 - integrity sha512-xb3ZL6+L8b9JLLCx3ZdoZy4+2ECphCMo2PwqgP1tlfVq6M6YReyzBJtvWWtbDSpNr9hn96pkCiZqUcFEc+54Qg==

1038 - dependencies:

1039 - "@types/parse-json" "^4.0.0"

1040 - import-fresh "^3.1.0"

1041 - parse-json "^5.0.0"

1042 - path-type "^4.0.0"

1043 - yaml "^1.7.2"

1044 -

744 cross-spawn@^7.0.2:

745 version "7.0.3"

746 resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6"

@@ -1056,7 +755,7 @@ cssesc@^3.0.0:

755 resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"

756 integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==

757

1059 -csstype@^3.0.2, csstype@^3.1.0:

758 +csstype@^3.0.2:

759 version "3.1.0"

760 resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.0.tgz#4ddcac3718d787cf9df0d1b7d15033925c8f29f2"

761 integrity sha512-uX1KG+x9h5hIJsaKR9xHUeUraxf8IODOwq9JLNPq6BwB04a/xgpq3rcx47l5BZu5zBPlgD342tdke3Hom/nJRA==

@@ -1145,14 +844,6 @@ doctrine@^3.0.0:

844 dependencies:

845 esutils "^2.0.2"

846

1148 -dom-helpers@^5.0.1:

1149 - version "5.2.1"

1150 - resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-5.2.1.tgz#d9400536b2bf8225ad98fe052e029451ac40e902"

1151 - integrity sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==

1152 - dependencies:

1153 - "@babel/runtime" "^7.8.7"

1154 - csstype "^3.0.2"

1155 -

847 electron-to-chromium@^1.4.147:

848 version "1.4.155"

849 resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.155.tgz#9c7190bf5e8608c5a5e4953b1ccf0facf3d1b49d"

@@ -1176,13 +867,6 @@ enhanced-resolve@^5.7.0:

867 graceful-fs "^4.2.4"

868 tapable "^2.2.0"

869

1179 -error-ex@^1.3.1:

1180 - version "1.3.2"

1181 - resolved "https://registry.yarnpkg.com/error-ex/-/error-ex-1.3.2.tgz#b4ac40648107fdcdcfae242f428bea8a14d4f1bf"

1182 - integrity sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==

1183 - dependencies:

1184 - is-arrayish "^0.2.1"

1185 -

870 es-abstract@^1.19.0, es-abstract@^1.19.1, es-abstract@^1.19.2, es-abstract@^1.19.5:

871 version "1.20.1"

872 resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.20.1.tgz#027292cd6ef44bd12b1913b828116f54787d1814"

@@ -1482,11 +1166,6 @@ fastq@^1.6.0:

1166 dependencies:

1167 reusify "^1.0.4"

1168

1485 -fflate@^0.7.3:

1486 - version "0.7.3"

1487 - resolved "https://registry.yarnpkg.com/fflate/-/fflate-0.7.3.tgz#288b034ff0e9c380eaa2feff48c787b8371b7fa5"

1488 - integrity sha512-0Zz1jOzJWERhyhsimS54VTqOteCNwRtIlh8isdL0AXLo0g7xNTfTL7oWrkmCnPhZGocKIkWHBistBrrpoNH3aw==

1489 -

1169 file-entry-cache@^6.0.1:

1170 version "6.0.1"

1171 resolved "https://registry.yarnpkg.com/file-entry-cache/-/file-entry-cache-6.0.1.tgz#211b2dd9659cb0394b073e7323ac3c933d522027"

@@ -1501,11 +1180,6 @@ fill-range@^7.0.1:

1180 dependencies:

1181 to-regex-range "^5.0.1"

1182

1504 -find-root@^1.1.0:

1505 - version "1.1.0"

1506 - resolved "https://registry.yarnpkg.com/find-root/-/find-root-1.1.0.tgz#abcfc8ba76f708c42a97b3d685b7e9450bfb9ce4"

1507 - integrity sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==

1508 -

1183 find-up@^2.1.0:

1184 version "2.1.0"

1185 resolved "https://registry.yarnpkg.com/find-up/-/find-up-2.1.0.tgz#45d1b7e506c717ddd482775a2b77920a3c0c57a7"

@@ -1730,19 +1404,12 @@ hermes-parser@0.9.0:

1404 dependencies:

1405 hermes-estree "0.9.0"

1406

1733 -hoist-non-react-statics@^3.3.1:

1734 - version "3.3.2"

1735 - resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"

1736 - integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==

1737 - dependencies:

1738 - react-is "^16.7.0"

1739 -

1407 ignore@^5.2.0:

1408 version "5.2.0"

1409 resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.2.0.tgz#6d3bac8fa7fe0d45d9f9be7bac2fc279577e345a"

1410 integrity sha512-CmxgYGiEPCLhfLnpPp1MoRmifwEIOgjcHXxOBjv7mY96c+eWScsOP9c112ZyLdWHi0FxHjI+4uVhKYp/gcdRmQ==

1411

1745 -import-fresh@^3.0.0, import-fresh@^3.1.0, import-fresh@^3.2.1:

1412 +import-fresh@^3.0.0, import-fresh@^3.2.1:

1413 version "3.3.0"

1414 resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.3.0.tgz#37162c25fcb9ebaa2e6e53d5b4d88ce17d9e0c2b"

1415 integrity sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==

@@ -1784,11 +1451,6 @@ invariant@^2.2.4:

1451 dependencies:

1452 loose-envify "^1.0.0"

1453

1787 -is-arrayish@^0.2.1:

1788 - version "0.2.1"

1789 - resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d"

1790 - integrity sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==

1791 -

1454 is-bigint@^1.0.1:

1455 version "1.0.4"

1456 resolved "https://registry.yarnpkg.com/is-bigint/-/is-bigint-1.0.4.tgz#08147a1875bc2b32005d41ccd8291dffc6691df3"

@@ -1927,11 +1589,6 @@ jsesc@^2.5.1:

1589 resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-2.5.2.tgz#80564d2e483dacf6e8ef209650a67df3f0c283a4"

1590 integrity sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==

1591

1930 -json-parse-even-better-errors@^2.3.0:

1931 - version "2.3.1"

1932 - resolved "https://registry.yarnpkg.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz#7c47805a94319928e05777405dc12e1f7a4ee02d"

1933 - integrity sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==

1934 -

1592 json-schema-traverse@^0.4.1:

1593 version "0.4.1"

1594 resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz#69f6a87d9513ab8bb8fe63bdb0979c448e684660"

@@ -1987,11 +1644,6 @@ lilconfig@^2.0.5:

1644 resolved "https://registry.yarnpkg.com/lilconfig/-/lilconfig-2.0.5.tgz#19e57fd06ccc3848fd1891655b5a447092225b25"

1645 integrity sha512-xaYmXZtTHPAw5m+xLN8ab9C+3a8YmV3asNSPOATITbtwrfbwaLJj8h66H1WMIpALCkqsIzK3h7oQ+PdX+LQ9Eg==

1646

1990 -lines-and-columns@^1.1.6:

1991 - version "1.2.4"

1992 - resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632"

1993 - integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==

1994 -

1647 locate-path@^2.0.0:

1648 version "2.0.0"

1649 resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-2.0.0.tgz#2b568b265eec944c6d9c0de9c3dbbbca0354cd8e"

@@ -2264,16 +1916,6 @@ parent-module@^1.0.0:

1916 dependencies:

1917 callsites "^3.0.0"

1918

2267 -parse-json@^5.0.0:

2268 - version "5.2.0"

2269 - resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-5.2.0.tgz#c76fc66dee54231c962b22bcc8a72cf2f99753cd"

2270 - integrity sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==

2271 - dependencies:

2272 - "@babel/code-frame" "^7.0.0"

2273 - error-ex "^1.3.1"

2274 - json-parse-even-better-errors "^2.3.0"

2275 - lines-and-columns "^1.1.6"

2276 -

1919 path-exists@^3.0.0:

1920 version "3.0.0"

1921 resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-3.0.0.tgz#ce0ebeaa5f78cb18925ea7d810d7b59b010fd515"

@@ -2391,11 +2033,6 @@ prettier@^2.6.2:

2033 resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.7.0.tgz#a4fdae07e5596c51c9857ea676cd41a0163879d6"

2034 integrity sha512-nwoX4GMFgxoPC6diHvSwmK/4yU8FFH3V8XWtLQrbj4IBsK2pkYhG4kf/ljF/haaZ/aii+wNJqISrCDPgxGWDVQ==

2035

2394 -pretty-bytes@^6.0.0:

2395 - version "6.0.0"

2396 - resolved "https://registry.yarnpkg.com/pretty-bytes/-/pretty-bytes-6.0.0.tgz#928be2ad1f51a2e336add8ba764739f9776a8140"

2397 - integrity sha512-6UqkYefdogmzqAZWzJ7laYeJnaXDy2/J+ZqiiMtS7t7OfpXWTlaeGMwX8U6EFvPV/YWWEKRkS8hKS4k60WHTOg==

2398 -

2036 pretty-format@^28.1.3:

2037 version "28.1.3"

2038 resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-28.1.3.tgz#c9fba8cedf99ce50963a11b27d982a9ae90970d5"

@@ -2406,7 +2043,7 @@ pretty-format@^28.1.3:

2043 ansi-styles "^5.0.0"

2044 react-is "^18.0.0"

2045

2409 -prop-types@^15.6.2, prop-types@^15.7.2, prop-types@^15.8.1:

2046 +prop-types@^15.7.2, prop-types@^15.8.1:

2047 version "15.8.1"

2048 resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"

2049 integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==

@@ -2438,26 +2075,16 @@ react-dom@18.1.0:

2075 loose-envify "^1.1.0"

2076 scheduler "^0.22.0"

2077

2441 -react-is@^16.13.1, react-is@^16.7.0:

2078 +react-is@^16.13.1:

2079 version "16.13.1"

2080 resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"

2081 integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==

2082

2446 -react-is@^18.0.0, react-is@^18.2.0:

2083 +react-is@^18.0.0:

2084 version "18.2.0"

2085 resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.2.0.tgz#199431eeaaa2e09f86427efbb4f1473edb47609b"

2086 integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==

2087

2451 -react-transition-group@^4.4.2:

2452 - version "4.4.2"

2453 - resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-4.4.2.tgz#8b59a56f09ced7b55cbd53c36768b922890d5470"

2454 - integrity sha512-/RNYfRAMlZwDSr6z4zNKV6xu53/e2BuaBbGhbyYIXTrmgu/bGHzmqOs7mJSJBHy9Ud+ApHx3QjrkKSp1pxvlFg==

2455 - dependencies:

2456 - "@babel/runtime" "^7.5.5"

2457 - dom-helpers "^5.0.1"

2458 - loose-envify "^1.4.0"

2459 - prop-types "^15.6.2"

2460 -

2088 react@18.1.0:

2089 version "18.1.0"

2090 resolved "https://registry.yarnpkg.com/react/-/react-18.1.0.tgz#6f8620382decb17fdc5cc223a115e2adbf104890"

@@ -2517,7 +2144,7 @@ resolve@^1.1.7, resolve@^1.20.0, resolve@^1.22.0:

2144 path-parse "^1.0.7"

2145 supports-preserve-symlinks-flag "^1.0.0"

2146

2520 -resolve@^1.12.0, resolve@^1.3.2:

2147 +resolve@^1.3.2:

2148 version "1.22.1"

2149 resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.1.tgz#27cb2ebb53f91abb49470a928bba7558066ac177"

2150 integrity sha512-nBpuuYuY5jFsli/JIs1oldw6fOQCBioohqWZg/2hiaOybXOft4lonv85uDOKXdf8rhyK159cxU5cDcK/NKk8zw==

@@ -2546,13 +2173,6 @@ rimraf@^3.0.2:

2173 dependencies:

2174 glob "^7.1.3"

2175

2549 -rollup@^2.75.7:

2550 - version "2.75.7"

2551 - resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.75.7.tgz#221ff11887ae271e37dcc649ba32ce1590aaa0b9"

2552 - integrity sha512-VSE1iy0eaAYNCxEXaleThdFXqZJ42qDBatAwrfnPlENEZ8erQ+0LYX4JXOLPceWfZpV1VtZwZ3dFCuOZiSyFtQ==

2553 - optionalDependencies:

2554 - fsevents "~2.3.2"

2555 -

2176 run-parallel@^1.1.9:

2177 version "1.2.0"

2178 resolved "https://registry.yarnpkg.com/run-parallel/-/run-parallel-1.2.0.tgz#66d1368da7bdf921eb9d95bd1a9229e7f21a43ee"

@@ -2620,24 +2240,11 @@ source-map-js@^1.0.1, source-map-js@^1.0.2:

2240 resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"

2241 integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==

2242

2623 -source-map-support@~0.5.20:

2624 - version "0.5.21"

2625 - resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.21.tgz#04fe7c7f9e1ed2d662233c28cb2b35b9f63f6e4f"

2626 - integrity sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==

2627 - dependencies:

2628 - buffer-from "^1.0.0"

2629 - source-map "^0.6.0"

2630 -

2631 -source-map@^0.5.0, source-map@^0.5.7:

2243 +source-map@^0.5.0:

2244 version "0.5.7"

2245 resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"

2246 integrity sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==

2247

2636 -source-map@^0.6.0:

2637 - version "0.6.1"

2638 - resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"

2639 - integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==

2640 -

2248 state-local@^1.0.6:

2249 version "1.0.7"

2250 resolved "https://registry.yarnpkg.com/state-local/-/state-local-1.0.7.tgz#da50211d07f05748d53009bee46307a37db386d5"

@@ -2706,11 +2313,6 @@ styled-jsx@5.0.2:

2313 resolved "https://registry.yarnpkg.com/styled-jsx/-/styled-jsx-5.0.2.tgz#ff230fd593b737e9e68b630a694d460425478729"

2314 integrity sha512-LqPQrbBh3egD57NBcHET4qcgshPks+yblyhPlH2GY8oaDgKs8SK4C3dBh3oSJjgzJ3G5t1SYEZGHkP+QEpX9EQ==

2315

2709 -stylis@4.0.13:

2710 - version "4.0.13"

2711 - resolved "https://registry.yarnpkg.com/stylis/-/stylis-4.0.13.tgz#f5db332e376d13cc84ecfe5dace9a2a51d954c91"

2712 - integrity sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag==

2713 -

2316 supports-color@^5.3.0:

2317 version "5.5.0"

2318 resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"

@@ -2763,16 +2365,6 @@ tapable@^2.2.0:

2365 resolved "https://registry.yarnpkg.com/tapable/-/tapable-2.2.1.tgz#1967a73ef4060a82f12ab96af86d52fdb76eeca0"

2366 integrity sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==

2367

2766 -terser@^5.14.2:

2767 - version "5.14.2"

2768 - resolved "https://registry.yarnpkg.com/terser/-/terser-5.14.2.tgz#9ac9f22b06994d736174f4091aa368db896f1c10"

2769 - integrity sha512-oL0rGeM/WFQCUd0y2QrWxYnq7tfSuKBiqTjRPWrRgB46WD/kiwHwF8T23z78H6Q6kGCuuHcPB+KULHRdxvVGQA==

2770 - dependencies:

2771 - "@jridgewell/source-map" "^0.3.2"

2772 - acorn "^8.5.0"

2773 - commander "^2.20.0"

2774 - source-map-support "~0.5.20"

2775 -

2368 text-table@^0.2.0:

2369 version "0.2.0"

2370 resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"

@@ -2908,7 +2500,7 @@ yallist@^4.0.0:

2500 resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"

2501 integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==

2502

2911 -yaml@^1.10.2, yaml@^1.7.2:

2503 +yaml@^1.10.2:

2504 version "1.10.2"

2505 resolved "https://registry.yarnpkg.com/yaml/-/yaml-1.10.2.tgz#2301c5ffbf12b467de8da2333a459e29e7920e4b"

2506 integrity sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==