diff --git a/.storybook/preview.js b/.storybook/preview.js index 1ea5c9a9..e82862b9 100644 --- a/.storybook/preview.js +++ b/.storybook/preview.js @@ -31,4 +31,9 @@ export const parameters = { darkMode: { stylePreview: true, }, + options: { + storySort: { + order: ["Basic", "Advanced"], + }, + }, }; diff --git a/README.md b/README.md index 2ba9cad2..eb7d37c0 100644 --- a/README.md +++ b/README.md @@ -197,7 +197,7 @@ import "allotment/dist/style.css"; ### My content is larger than the containing pane. How can I let the user scroll? -The simplest approach is place your content inside a new div with width and height `100%` and overflow `auto`. This div will have the same dimensions as the pane it's inside and if its content overflows the browser will provide scrolling behaviour. +The simplest approach is to place your content inside a new div with width and height `100%` and overflow `auto`. This div will have the same dimensions as the pane it's inside and if its content overflows the browser will provide scrolling behaviour. ### Next.js diff --git a/package.json b/package.json index e49c60e9..ce0efa4b 100644 --- a/package.json +++ b/package.json @@ -31,7 +31,7 @@ "use-resize-observer": "^8.0.0" }, "devDependencies": { - "@babel/core": "7.17.8", + "@babel/core": "7.17.9", "@babel/plugin-proposal-class-properties": "7.16.7", "@babel/plugin-proposal-private-methods": "7.16.11", "@babel/plugin-proposal-private-property-in-object": "7.16.7", @@ -40,20 +40,21 @@ "@babel/preset-react": "7.16.7", "@babel/preset-typescript": "7.16.7", "@rollup/plugin-babel": "5.3.1", - "@rollup/plugin-commonjs": "21.0.2", + "@rollup/plugin-commonjs": "21.0.3", "@rollup/plugin-node-resolve": "13.1.3", "@storybook/addon-actions": "6.4.20", "@storybook/addon-essentials": "6.4.20", "@storybook/addon-links": "6.4.20", "@storybook/react": "6.4.20", - "@testing-library/dom": "8.11.4", + "@testing-library/dom": "8.13.0", "@types/jest": "27.4.1", "@types/lodash.clamp": "4.0.6", "@types/lodash.debounce": "4.0.6", - "@typescript-eslint/parser": "5.16.0", + "@typescript-eslint/parser": "5.18.0", + "@vscode/codicons": "^0.0.29", "babel-jest": "27.5.1", "babel-loader": "8.2.4", - "eslint": "8.12.0", + "eslint": "8.13.0", "eslint-config-prettier": "8.5.0", "eslint-plugin-react-hooks": "4.3.0", "eslint-plugin-simple-import-sort": "7.0.0", @@ -71,7 +72,8 @@ "storybook-dark-mode": "1.0.9", "ts-jest": "27.1.4", "ts-node": "10.7.0", - "typescript": "4.6.3" + "typescript": "4.6.3", + "xterm": "^4.18.0" }, "peerDependencies": { "react": "^17.0.0", diff --git a/stories/advanced.stories.module.css b/stories/advanced.stories.module.css new file mode 100644 index 00000000..5fd6bca5 --- /dev/null +++ b/stories/advanced.stories.module.css @@ -0,0 +1,7 @@ +.container { + box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); + color: #cccccc; + font-family: sans-serif; + height: 480px; + width: 640px; +} diff --git a/stories/advanced.stories.tsx b/stories/advanced.stories.tsx new file mode 100644 index 00000000..0f101a0d --- /dev/null +++ b/stories/advanced.stories.tsx @@ -0,0 +1,145 @@ +import "@vscode/codicons/dist/codicon.css"; + +import { Meta, Story } from "@storybook/react"; +import { useState } from "react"; + +import { Allotment } from "../src"; +import styles from "./advanced.stories.module.css"; +import { ActivityBar } from "./components/activity-bar"; +import { Editor } from "./components/editor"; +import { Panel } from "./components/panel"; +import { Sidebar } from "./components/sidebar"; + +const ACTIVITIES = [ + "Explorer", + "Search", + "Source Control", + "Run and Debug", + "Extensions", +]; + +const DOCUMENTS = [ + { title: "allotment.tsx", icon: "ts" }, + { title: "allotment.module.css", icon: "css" }, +]; + +export interface Document { + title: string; + icon: string; +} + +export default { + title: "Advanced", + Component: Allotment, + argTypes: { + activityBar: { + control: { type: "boolean" }, + }, + primarySideBar: { + control: { type: "boolean" }, + }, + primarySideBarPosition: { + options: ["left", "right"], + control: { type: "radio" }, + }, + }, +} as Meta; + +export const VisualStudioCode: Story = ({ + activityBar, + primarySideBar, + primarySideBarPosition, +}) => { + const [editorVisible, setEditorVisible] = useState(true); + const [panelVisible, setPanelVisible] = useState(true); + const [activity, setActivity] = useState(0); + + const [openEditors, setOpenEditors] = useState(DOCUMENTS); + + const sidebar = ( + + { + setOpenEditors(openEditor); + }} + /> + + ); + + return ( +
+ + + { + setActivity(index); + }} + /> + + {primarySideBarPosition === "left" && sidebar} + + { + if (index === 0) { + setEditorVisible(value); + } else if (index === 1) { + setPanelVisible(value); + } + }} + > + + { + setOpenEditors(documents); + }} + /> + + + { + setEditorVisible(true); + setPanelVisible(false); + }} + onMaximize={() => { + setEditorVisible(false); + setPanelVisible(true); + }} + onMinimize={() => { + setEditorVisible(true); + setPanelVisible(true); + }} + /> + + + + {primarySideBarPosition === "right" && sidebar} + +
+ ); +}; + +VisualStudioCode.args = { + activityBar: true, + primarySideBar: true, + primarySideBarPosition: "left", +}; diff --git a/stories/components/activity-bar.module.css b/stories/components/activity-bar.module.css new file mode 100644 index 00000000..5fbe3745 --- /dev/null +++ b/stories/components/activity-bar.module.css @@ -0,0 +1,44 @@ +.activitybar { + background-color: rgb(51, 51, 51); + height: 100%; + overflow: hidden; +} + +.content { + display: flex; + flex-direction: column; + justify-content: space-between; +} + +.actionsContainer { + list-style-type: none; + padding: 0; + margin: 0; +} + +.actionItem { + align-items: center; + justify-content: center; + cursor: pointer; + position: relative; +} + +.actionItem.checked:before { + content: ""; + position: absolute; + z-index: 1; + top: 0; + height: 100%; + width: 0; + border-left: 2px solid; +} + +.actionLabel { + display: flex !important; + align-items: center; + justify-content: center; + width: 48px; + height: 48px; + color: rgb(255, 255, 255); + font-size: 24px !important; +} diff --git a/stories/components/activity-bar.tsx b/stories/components/activity-bar.tsx new file mode 100644 index 00000000..a10c22ab --- /dev/null +++ b/stories/components/activity-bar.tsx @@ -0,0 +1,40 @@ +import "@vscode/codicons/dist/codicon.css"; + +import classNames from "classnames"; + +import styles from "./activity-bar.module.css"; + +export type ActivityBarProps = { + checked: number; + items: string[]; + onClick: (index: number) => void; +}; + +export const ActivityBar = ({ checked, items, onClick }: ActivityBarProps) => { + return ( +
+
+ +
+
+ ); +}; diff --git a/stories/components/editor-group-container.module.css b/stories/components/editor-group-container.module.css new file mode 100644 index 00000000..40f48b11 --- /dev/null +++ b/stories/components/editor-group-container.module.css @@ -0,0 +1,48 @@ +@font-face { + src: url("../seti.woff") format("woff"); + font-family: "seti"; + font-weight: normal; + font-style: normal; + font-display: block; +} + +.allotment { + overflow-x: scroll; +} + +.editorGroupContainer { + height: 100%; +} + +.title { + background-color: rgb(37, 37, 38); +} + +.editorContainer { + background-color: rgb(30, 30, 30); +} + +.iconLabel { + display: flex; + line-height: 35px; +} + +.iconLabel::before { + color: #519aba; + background-image: unset; + font-family: "seti"; + font-size: 150%; +} + +.typescriptReactFileIcon::before { + content: "\E099"; +} + +.cssLangFileIcon::before { + content: "\E01D"; +} + +.labelName { + cursor: pointer; + font-size: 13px; +} diff --git a/stories/components/editor-group-container.tsx b/stories/components/editor-group-container.tsx new file mode 100644 index 00000000..72012cd3 --- /dev/null +++ b/stories/components/editor-group-container.tsx @@ -0,0 +1,64 @@ +import classNames from "classnames"; + +import styles from "./editor-group-container.module.css"; + +export type EditorGroupContainerProps = { + document: { title: string; icon: string }; + onClose: () => void; + onSplitEditor: () => void; +}; + +export const EditorGroupContainer = ({ + document, + onClose, + onSplitEditor, +}: EditorGroupContainerProps) => { + return ( +
+
+
+
+ +
+
+
+
+
+ +
+
+ ); +}; diff --git a/stories/components/editor.module.css b/stories/components/editor.module.css new file mode 100644 index 00000000..1d70e614 --- /dev/null +++ b/stories/components/editor.module.css @@ -0,0 +1,32 @@ +.content { + background-color: rgb(30, 30, 30); + height: 100%; + overflow: hidden; + width: 100%; +} + +.watermark { + display: block; + position: absolute; + width: 100%; + top: calc(50% + 55px); + text-align: center; + white-space: nowrap; + overflow: hidden; +} + +.watermark dl { + display: table-row; + opacity: 0.8; + cursor: default; +} + +.watermark dt { + display: table-cell; +} + +.watermarkBox { + display: inline-table; + border-collapse: separate; + border-spacing: 13px 17px; +} diff --git a/stories/components/editor.tsx b/stories/components/editor.tsx new file mode 100644 index 00000000..db047498 --- /dev/null +++ b/stories/components/editor.tsx @@ -0,0 +1,93 @@ +import "@vscode/codicons/dist/codicon.css"; + +import { Allotment } from "../../src"; +import { Document } from "../advanced.stories"; +import styles from "./editor.module.css"; +import { EditorGroupContainer } from "./editor-group-container"; + +export type EditorProps = { + documents: Document[]; + onDocumentsChange: (documents: Document[]) => void; +}; + +export const Editor = ({ documents, onDocumentsChange }: EditorProps) => { + return ( +
+ + {documents.length > 0 ? ( + documents.map((document, index) => ( + { + console.log(`Close ${document.title}:${index}`); + + const newDocuments = [...documents]; + newDocuments.splice(index, 1); + + onDocumentsChange(newDocuments); + }} + onSplitEditor={() => { + console.log("Split editor"); + + const newDocuments = [...documents]; + newDocuments.splice(index, 0, document); + + onDocumentsChange(newDocuments); + }} + /> + )) + ) : ( +
+
+
+
Show All Commands
+
+
+ + ⇧ + + + ⌘ + + + P + +
+
+
+
+
+ )} + +
+ ); +}; diff --git a/stories/components/pane.module.css b/stories/components/pane.module.css new file mode 100644 index 00000000..98d13ff8 --- /dev/null +++ b/stories/components/pane.module.css @@ -0,0 +1,32 @@ +.pane { + overflow: hidden; + width: 100%; + height: 100%; + display: flex; + flex-direction: column; +} + +.paneHeader { + height: 22px; + font-size: 11px; + font-weight: 700; + text-transform: uppercase; + overflow: hidden; + display: flex; + cursor: pointer; + align-items: center; + box-sizing: border-box; +} + +h3.title { + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + font-size: 11px; + min-width: 3ch; +} + +.paneBody { + flex: 1; + overflow: hidden; +} diff --git a/stories/components/pane.tsx b/stories/components/pane.tsx new file mode 100644 index 00000000..14149e7c --- /dev/null +++ b/stories/components/pane.tsx @@ -0,0 +1,26 @@ +import classNames from "classnames"; + +import styles from "./pane.module.css"; + +export type PaneProps = { + children: React.ReactNode; + expanded: boolean; + title: string; +}; + +export const Pane = ({ children, expanded, title }: PaneProps) => { + return ( +
+
+
+

{title}

+
+ {expanded &&
{children}
} +
+ ); +}; diff --git a/stories/components/panel.module.css b/stories/components/panel.module.css new file mode 100644 index 00000000..dda45291 --- /dev/null +++ b/stories/components/panel.module.css @@ -0,0 +1,79 @@ +.panel { + background-color: rgb(30, 30, 30); + border-left-color: rgba(128, 128, 128, 0.35); + border-right-color: rgba(128, 128, 128, 0.35); + height: 100%; + width: 100%; +} + +.title { + display: flex; + height: 35px; + overflow: hidden; + padding-left: 8px; + padding-right: 8px; + justify-content: space-between; +} + +.actionBar { + line-height: 27px; +} + +.actionsContainer { + list-style-type: none; + display: flex; + margin: 0 auto; + padding: 0; + height: 100%; + width: 100%; + align-items: center; +} + +.actionItem { + text-transform: uppercase; + align-items: center; + justify-content: center; + cursor: pointer; + position: relative; + font-size: 11px; + padding: 2px 10px; + display: flex; +} + +.actionLabel { + font-size: 11px; + padding: 3px; + border-radius: 5px; +} + +.actionLabel:hover { + background-color: rgba(90, 93, 94, 0.31); +} + +.activeItemIndicator { + position: absolute; + z-index: 1; + bottom: 0; + overflow: hidden; + pointer-events: none; + height: 100%; + top: -6px; + left: 10px; + width: calc(100% - 20px); +} + +.activeItemIndicator::before { + content: ""; + position: absolute; + z-index: 1; + bottom: 0; + width: 100%; + height: 0; + border-top-width: 1px; + border-top-style: solid; +} + +.terminalWrapper { + padding-left: 20px; + padding-right: 20px; +} diff --git a/stories/components/panel.tsx b/stories/components/panel.tsx new file mode 100644 index 00000000..901a5509 --- /dev/null +++ b/stories/components/panel.tsx @@ -0,0 +1,118 @@ +import "xterm/css/xterm.css"; + +import classNames from "classnames"; +import { useEffect, useRef } from "react"; +import { Terminal } from "xterm"; + +import styles from "./panel.module.css"; + +export type PanelProps = { + maximized: boolean; + onClose: () => void; + onMaximize: () => void; + onMinimize: () => void; +}; + +export const Panel = ({ + maximized, + onClose, + onMaximize, + onMinimize, +}: PanelProps) => { + const ref = useRef(null!); + + useEffect(() => { + const term = new Terminal({ + fontSize: 11, + theme: { background: "rgb(30,30,30)" }, + }); + + term.open(ref.current); + + const prompt = () => { + term.write("\r\n$ "); + }; + + term.writeln("Welcome to allotment"); + term.writeln( + "This is a local terminal emulation, without a real terminal in the back-end." + ); + term.writeln("Type some keys and commands to play around."); + term.writeln(""); + prompt(); + + term.onKey((e: { key: string; domEvent: KeyboardEvent }) => { + const ev = e.domEvent; + const printable = !ev.altKey && !ev.ctrlKey && !ev.metaKey; + + if (ev.keyCode === 13) { + prompt(); + } else if (ev.keyCode === 8) { + // Do not delete the prompt + /* if (term._core.buffer.x > 2) { + term.write("\b \b"); + } */ + } else if (printable) { + term.write(e.key); + } + }); + }, []); + + return ( +
+
+
+ +
+
+ +
+
+
+
+
+
+ ); +}; diff --git a/stories/components/sidebar.module.css b/stories/components/sidebar.module.css new file mode 100644 index 00000000..9261b125 --- /dev/null +++ b/stories/components/sidebar.module.css @@ -0,0 +1,83 @@ +.sidebar { + background-color: rgb(37, 37, 38); + height: 100%; + outline-color: rgba(83, 89, 93, 0.5); + display: flex; + flex-direction: column; +} + +.content { + flex: 1; + font-size: 13px; +} + +.title { + display: flex; + height: 35px; + display: flex; + box-sizing: border-box; + overflow: hidden; + padding-left: 8px; + padding-right: 8px; +} + +.titleLabel { + line-height: 35px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + padding-left: 12px; +} + +.titleLabel h2 { + color: rgb(187, 187, 187); + font-size: 11px; + cursor: default; + font-weight: 400; + margin: 0; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + text-transform: uppercase; +} + +.titleActions { + flex: 1; + padding-left: 5px; +} + +.actionsContainer { + justify-content: flex-end; + display: flex; + margin: 0 auto; + padding: 0; + height: 100%; + width: 100%; + align-items: center; +} + +.listRow { + height: 22px; + line-height: 22px; + padding-left: 22px; + display: flex; +} + +.actionLabel { + align-items: center; +} + +.iconLabelContainer { + min-width: 0; + overflow: hidden; + text-overflow: ellipsis; + flex: 1; +} + +.labelDescription { + font-style: italic; + opacity: 0.8; + margin-left: 0.5em; + font-size: 0.9em; + white-space: pre; +} diff --git a/stories/components/sidebar.tsx b/stories/components/sidebar.tsx new file mode 100644 index 00000000..48c830d6 --- /dev/null +++ b/stories/components/sidebar.tsx @@ -0,0 +1,148 @@ +import classNames from "classnames"; +import { useEffect } from "react"; + +import { Allotment } from "../../src"; +import { Document } from "../advanced.stories"; +import { Pane } from "./pane"; +import styles from "./sidebar.module.css"; + +export type SidebarProps = { + title: string; + documents: Document[]; + openEditors: Document[]; + onOpenEditorsChange: (documents: Document[]) => void; +}; + +export const Sidebar = ({ + title, + documents, + openEditors, + onOpenEditorsChange, +}: SidebarProps) => { + useEffect(() => { + console.log("Mount"); + + return () => { + console.log("Unmount"); + }; + }, []); + + return ( +
+
+
+

{title}

+
+
+
+ +
+
+
+
+ + + + + + + + + + + + + + + + + +
+
+ ); +}; diff --git a/stories/seti.woff b/stories/seti.woff new file mode 100644 index 00000000..aeb87b84 Binary files /dev/null and b/stories/seti.woff differ diff --git a/yarn.lock b/yarn.lock index 9dee9d34..38b39ce0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -65,25 +65,25 @@ semver "^5.4.1" source-map "^0.5.0" -"@babel/core@7.17.8": - version "7.17.8" - resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.17.8.tgz#3dac27c190ebc3a4381110d46c80e77efe172e1a" - integrity sha512-OdQDV/7cRBtJHLSOBqqbYNkOcydOgnX59TZx4puf41fzcVtN3e/4yqY8lMQsK+5X2lJtAdmA+6OHqsj1hBJ4IQ== +"@babel/core@7.17.9": + version "7.17.9" + resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.17.9.tgz#6bae81a06d95f4d0dec5bb9d74bbc1f58babdcfe" + integrity sha512-5ug+SfZCpDAkVp9SFIZAzlW18rlzsOcJGaetCjkySnrXXDUw9AR8cDUm1iByTmdWM6yxX6/zycaV76w3YTF2gw== dependencies: "@ampproject/remapping" "^2.1.0" "@babel/code-frame" "^7.16.7" - "@babel/generator" "^7.17.7" + "@babel/generator" "^7.17.9" "@babel/helper-compilation-targets" "^7.17.7" "@babel/helper-module-transforms" "^7.17.7" - "@babel/helpers" "^7.17.8" - "@babel/parser" "^7.17.8" + "@babel/helpers" "^7.17.9" + "@babel/parser" "^7.17.9" "@babel/template" "^7.16.7" - "@babel/traverse" "^7.17.3" + "@babel/traverse" "^7.17.9" "@babel/types" "^7.17.0" convert-source-map "^1.7.0" debug "^4.1.0" gensync "^1.0.0-beta.2" - json5 "^2.1.2" + json5 "^2.2.1" semver "^6.3.0" "@babel/core@^7.1.0", "@babel/core@^7.12.10", "@babel/core@^7.7.2", "@babel/core@^7.7.5": @@ -164,10 +164,10 @@ jsesc "^2.5.1" source-map "^0.5.0" -"@babel/generator@^7.17.7": - version "7.17.7" - resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.17.7.tgz#8da2599beb4a86194a3b24df6c085931d9ee45ad" - integrity sha512-oLcVCTeIFadUoArDTwpluncplrYBmTCCZZgXCbgNGvOBBiSDDK3eWO4b/+eOTli5tKv1lg+a5/NAXg+nTcei1w== +"@babel/generator@^7.17.9": + version "7.17.9" + resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.17.9.tgz#f4af9fd38fa8de143c29fce3f71852406fc1e2fc" + integrity sha512-rAdDousTwxbIxbz5I7GEQ3lUip+xVCXooZNbsydCWs3xA7ZsYOv+CFRdzGxRX78BmQHu9B1Eso59AOZQOJDEdQ== dependencies: "@babel/types" "^7.17.0" jsesc "^2.5.1" @@ -368,6 +368,14 @@ "@babel/template" "^7.16.7" "@babel/types" "^7.16.7" +"@babel/helper-function-name@^7.17.9": + version "7.17.9" + resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.17.9.tgz#136fcd54bc1da82fcb47565cf16fd8e444b1ff12" + integrity sha512-7cRisGlVtiVqZ0MW0/yFB4atgpGLWEHUVYnb448hZK4x+vih0YO5UoS11XIYtZYqHd0dIPMdUSv8q5K4LdMnIg== + dependencies: + "@babel/template" "^7.16.7" + "@babel/types" "^7.17.0" + "@babel/helper-get-function-arity@^7.15.4": version "7.15.4" resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.15.4.tgz#098818934a137fce78b536a3e015864be1e2879b" @@ -641,13 +649,13 @@ "@babel/traverse" "^7.16.7" "@babel/types" "^7.16.7" -"@babel/helpers@^7.17.8": - version "7.17.8" - resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.17.8.tgz#288450be8c6ac7e4e44df37bcc53d345e07bc106" - integrity sha512-QcL86FGxpfSJwGtAvv4iG93UL6bmqBdmoVY0CMCU2g+oD2ezQse3PT5Pa+jiD6LJndBQi0EDlpzOWNlLuhz5gw== +"@babel/helpers@^7.17.9": + version "7.17.9" + resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.17.9.tgz#b2af120821bfbe44f9907b1826e168e819375a1a" + integrity sha512-cPCt915ShDWUEzEp3+UNRktO2n6v49l5RSnG9M5pS24hA+2FAc5si+Pn1i4VVbQQ+jh+bIZhPFQOJOzbrOYY1Q== dependencies: "@babel/template" "^7.16.7" - "@babel/traverse" "^7.17.3" + "@babel/traverse" "^7.17.9" "@babel/types" "^7.17.0" "@babel/highlight@^7.14.5": @@ -688,10 +696,10 @@ resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.17.3.tgz#b07702b982990bf6fdc1da5049a23fece4c5c3d0" integrity sha512-7yJPvPV+ESz2IUTPbOL+YkIGyCqOyNIzdguKQuJGnH7bg1WTIifuM21YqokFt/THWh1AkCRn9IgoykTRCBVpzA== -"@babel/parser@^7.17.8": - version "7.17.8" - resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.17.8.tgz#2817fb9d885dd8132ea0f8eb615a6388cca1c240" - integrity sha512-BoHhDJrJXqcg+ZL16Xv39H9n+AqJ4pcDrQBGZN+wHxIysrLZ3/ECwCBUch/1zUNhnsXULcONU3Ei5Hmkfk6kiQ== +"@babel/parser@^7.17.9": + version "7.17.9" + resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.17.9.tgz#9c94189a6062f0291418ca021077983058e171ef" + integrity sha512-vqUSBLP8dQHFPdPi9bc5GK9vRkYHJ49fsZdtoJ8EQ8ibpwk5rPKfvNIwChB0KVXcIjcepEBBd2VHC5r9Gy8ueg== "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@^7.16.7": version "7.16.7" @@ -2101,6 +2109,22 @@ debug "^4.1.0" globals "^11.1.0" +"@babel/traverse@^7.17.9": + version "7.17.9" + resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.17.9.tgz#1f9b207435d9ae4a8ed6998b2b82300d83c37a0d" + integrity sha512-PQO8sDIJ8SIwipTPiR71kJQCKQYB5NGImbOviK8K+kg5xkNSYXLBupuX9QhatFowrsvo9Hj8WgArg3W7ijNAQw== + dependencies: + "@babel/code-frame" "^7.16.7" + "@babel/generator" "^7.17.9" + "@babel/helper-environment-visitor" "^7.16.7" + "@babel/helper-function-name" "^7.17.9" + "@babel/helper-hoist-variables" "^7.16.7" + "@babel/helper-split-export-declaration" "^7.16.7" + "@babel/parser" "^7.17.9" + "@babel/types" "^7.17.0" + debug "^4.1.0" + globals "^11.1.0" + "@babel/types@^7.0.0", "@babel/types@^7.12.11", "@babel/types@^7.12.7", "@babel/types@^7.14.9", "@babel/types@^7.15.4", "@babel/types@^7.15.6", "@babel/types@^7.2.0", "@babel/types@^7.3.0", "@babel/types@^7.3.3", "@babel/types@^7.4.4": version "7.15.6" resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.15.6.tgz#99abdc48218b2881c058dd0a7ab05b99c9be758f" @@ -2690,10 +2714,10 @@ "@babel/helper-module-imports" "^7.10.4" "@rollup/pluginutils" "^3.1.0" -"@rollup/plugin-commonjs@21.0.2": - version "21.0.2" - resolved "https://registry.yarnpkg.com/@rollup/plugin-commonjs/-/plugin-commonjs-21.0.2.tgz#0b9c539aa1837c94abfaf87945838b0fc8564891" - integrity sha512-d/OmjaLVO4j/aQX69bwpWPpbvI3TJkQuxoAk7BH8ew1PyoMBLTOuvJTjzG8oEoW7drIIqB0KCJtfFLu/2GClWg== +"@rollup/plugin-commonjs@21.0.3": + version "21.0.3" + resolved "https://registry.yarnpkg.com/@rollup/plugin-commonjs/-/plugin-commonjs-21.0.3.tgz#287896c64926ef3d7f0013708dcdcc1223576ef0" + integrity sha512-ThGfwyvcLc6cfP/MWxA5ACF+LZCvsuhUq7V5134Az1oQWsiC7lNpLT4mJI86WQunK7BYmpUiHmMk2Op6OAHs0g== dependencies: "@rollup/pluginutils" "^3.1.0" commondir "^1.0.1" @@ -3573,10 +3597,10 @@ resolve-from "^5.0.0" store2 "^2.12.0" -"@testing-library/dom@8.11.4": - version "8.11.4" - resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-8.11.4.tgz#dc94d830b862e7a20686b0379eefd931baf0445b" - integrity sha512-7vZ6ZoBEbr6bfEM89W1nzl0vHbuI0g0kRrI0hwSXH3epnuqGO3KulFLQCKfmmW+60t7e4sevAkJPASSMmnNCRw== +"@testing-library/dom@8.13.0": + version "8.13.0" + resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-8.13.0.tgz#bc00bdd64c7d8b40841e27a70211399ad3af46f5" + integrity sha512-9VHgfIatKNXQNaZTtLnalIy0jNZzY35a4S3oi08YAt9Hv1VsfZ/DfA45lM8D/UhtHBGJ4/lGwp0PZkVndRkoOQ== dependencies: "@babel/code-frame" "^7.10.4" "@babel/runtime" "^7.12.5" @@ -3940,50 +3964,55 @@ dependencies: "@types/yargs-parser" "*" -"@typescript-eslint/parser@5.16.0": - version "5.16.0" - resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-5.16.0.tgz#e4de1bde4b4dad5b6124d3da227347616ed55508" - integrity sha512-fkDq86F0zl8FicnJtdXakFs4lnuebH6ZADDw6CYQv0UZeIjHvmEw87m9/29nk2Dv5Lmdp0zQ3zDQhiMWQf/GbA== +"@typescript-eslint/parser@5.18.0": + version "5.18.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-5.18.0.tgz#2bcd4ff21df33621df33e942ccb21cb897f004c6" + integrity sha512-+08nYfurBzSSPndngnHvFw/fniWYJ5ymOrn/63oMIbgomVQOvIDhBoJmYZ9lwQOCnQV9xHGvf88ze3jFGUYooQ== dependencies: - "@typescript-eslint/scope-manager" "5.16.0" - "@typescript-eslint/types" "5.16.0" - "@typescript-eslint/typescript-estree" "5.16.0" + "@typescript-eslint/scope-manager" "5.18.0" + "@typescript-eslint/types" "5.18.0" + "@typescript-eslint/typescript-estree" "5.18.0" debug "^4.3.2" -"@typescript-eslint/scope-manager@5.16.0": - version "5.16.0" - resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-5.16.0.tgz#7e7909d64bd0c4d8aef629cdc764b9d3e1d3a69a" - integrity sha512-P+Yab2Hovg8NekLIR/mOElCDPyGgFZKhGoZA901Yax6WR6HVeGLbsqJkZ+Cvk5nts/dAlFKm8PfL43UZnWdpIQ== +"@typescript-eslint/scope-manager@5.18.0": + version "5.18.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-5.18.0.tgz#a7d7b49b973ba8cebf2a3710eefd457ef2fb5505" + integrity sha512-C0CZML6NyRDj+ZbMqh9FnPscg2PrzSaVQg3IpTmpe0NURMVBXlghGZgMYqBw07YW73i0MCqSDqv2SbywnCS8jQ== dependencies: - "@typescript-eslint/types" "5.16.0" - "@typescript-eslint/visitor-keys" "5.16.0" + "@typescript-eslint/types" "5.18.0" + "@typescript-eslint/visitor-keys" "5.18.0" -"@typescript-eslint/types@5.16.0": - version "5.16.0" - resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-5.16.0.tgz#5827b011982950ed350f075eaecb7f47d3c643ee" - integrity sha512-oUorOwLj/3/3p/HFwrp6m/J2VfbLC8gjW5X3awpQJ/bSG+YRGFS4dpsvtQ8T2VNveV+LflQHjlLvB6v0R87z4g== +"@typescript-eslint/types@5.18.0": + version "5.18.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-5.18.0.tgz#4f0425d85fdb863071680983853c59a62ce9566e" + integrity sha512-bhV1+XjM+9bHMTmXi46p1Led5NP6iqQcsOxgx7fvk6gGiV48c6IynY0apQb7693twJDsXiVzNXTflhplmaiJaw== -"@typescript-eslint/typescript-estree@5.16.0": - version "5.16.0" - resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-5.16.0.tgz#32259459ec62f5feddca66adc695342f30101f61" - integrity sha512-SE4VfbLWUZl9MR+ngLSARptUv2E8brY0luCdgmUevU6arZRY/KxYoLI/3V/yxaURR8tLRN7bmZtJdgmzLHI6pQ== +"@typescript-eslint/typescript-estree@5.18.0": + version "5.18.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-5.18.0.tgz#6498e5ee69a32e82b6e18689e2f72e4060986474" + integrity sha512-wa+2VAhOPpZs1bVij9e5gyVu60ReMi/KuOx4LKjGx2Y3XTNUDJgQ+5f77D49pHtqef/klglf+mibuHs9TrPxdQ== dependencies: - "@typescript-eslint/types" "5.16.0" - "@typescript-eslint/visitor-keys" "5.16.0" + "@typescript-eslint/types" "5.18.0" + "@typescript-eslint/visitor-keys" "5.18.0" debug "^4.3.2" globby "^11.0.4" is-glob "^4.0.3" semver "^7.3.5" tsutils "^3.21.0" -"@typescript-eslint/visitor-keys@5.16.0": - version "5.16.0" - resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-5.16.0.tgz#f27dc3b943e6317264c7492e390c6844cd4efbbb" - integrity sha512-jqxO8msp5vZDhikTwq9ubyMHqZ67UIvawohr4qF3KhlpL7gzSjOd+8471H3nh5LyABkaI85laEKKU8SnGUK5/g== +"@typescript-eslint/visitor-keys@5.18.0": + version "5.18.0" + resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-5.18.0.tgz#c7c07709823804171d569017f3b031ced7253e60" + integrity sha512-Hf+t+dJsjAKpKSkg3EHvbtEpFFb/1CiOHnvI8bjHgOD4/wAw3gKrA0i94LrbekypiZVanJu3McWJg7rWDMzRTg== dependencies: - "@typescript-eslint/types" "5.16.0" + "@typescript-eslint/types" "5.18.0" eslint-visitor-keys "^3.0.0" +"@vscode/codicons@^0.0.29": + version "0.0.29" + resolved "https://registry.yarnpkg.com/@vscode/codicons/-/codicons-0.0.29.tgz#587e6ce4be8de55d9d11e5297ea55a3dbab08ccf" + integrity sha512-AXhTv1nl3r4W5DqAfXXKiawQNW+tLBNlXn/GcsnFCL0j17sQ2AY+az9oB9K6wjkibq1fndNJvmT8RYN712Fdww== + "@webassemblyjs/ast@1.9.0": version "1.9.0" resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.9.0.tgz#bd850604b4042459a5a41cd7d338cbed695ed964" @@ -6748,10 +6777,10 @@ eslint-visitor-keys@^3.3.0: resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.3.0.tgz#f6480fa6b1f30efe2d1968aa8ac745b862469826" integrity sha512-mQ+suqKJVyeuwGYHAdjMFqjCyfl8+Ldnxuyp3ldiMBFKkvytrXUZWaiPCEav8qDHKty44bD+qV1IP4T+w+xXRA== -eslint@8.12.0: - version "8.12.0" - resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.12.0.tgz#c7a5bd1cfa09079aae64c9076c07eada66a46e8e" - integrity sha512-it1oBL9alZg1S8UycLm5YDMAkIhtH6FtAzuZs6YvoGVldWjbS08BkAdb/ymP9LlAyq8koANu32U7Ib/w+UNh8Q== +eslint@8.13.0: + version "8.13.0" + resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.13.0.tgz#6fcea43b6811e655410f5626cfcf328016badcd7" + integrity sha512-D+Xei61eInqauAyTJ6C0q6x9mx7kTUC1KZ0m0LSEexR0V+e94K12LmWX076ZIsldwfQ2RONdaJe0re0TRGQbRQ== dependencies: "@eslint/eslintrc" "^1.2.1" "@humanwhocodes/config-array" "^0.9.2" @@ -9258,6 +9287,11 @@ json5@^1.0.1: dependencies: minimist "^1.2.0" +json5@^2.2.1: + version "2.2.1" + resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.1.tgz#655d50ed1e6f95ad1a3caababd2b0efda10b395c" + integrity sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA== + jsonfile@^2.1.0: version "2.4.0" resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-2.4.0.tgz#3736a2b428b87bbda0cc83b53fa3d633a35c2ae8" @@ -13672,6 +13706,11 @@ xtend@^4.0.0, xtend@^4.0.1, xtend@~4.0.1: resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.2.tgz#bb72779f5fa465186b1f438f674fa347fdb5db54" integrity sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ== +xterm@^4.18.0: + version "4.18.0" + resolved "https://registry.yarnpkg.com/xterm/-/xterm-4.18.0.tgz#a1f6ab2c330c3918fb094ae5f4c2562987398ea1" + integrity sha512-JQoc1S0dti6SQfI0bK1AZvGnAxH4MVw45ZPFSO6FHTInAiau3Ix77fSxNx3mX4eh9OL4AYa8+4C8f5UvnSfppQ== + y18n@^4.0.0: version "4.0.3" resolved "https://registry.yarnpkg.com/y18n/-/y18n-4.0.3.tgz#b5f259c82cd6e336921efd7bfd8bf560de9eeedf"