@devbookhq/ui/lib/esm/index.js

Devbook UI is a React UI library

import{jsx as n,jsxs as e,Fragment as t}from"react/jsx-runtime";import{memo as r,useRef as o,useLayoutEffect as a,forwardRef as i,useState as c,useCallback as l,useEffect as s,createElement as d,useMemo as p,useImperativeHandle as b}from"react";import g from"classnames";import{classHighlightStyle as u}from"@codemirror/highlight";import{EditorView as h,highlightSpecialChars as m,drawSelection as f,dropCursor as x,highlightActiveLine as w,keymap as v}from"@codemirror/view";import{EditorState as y,Transaction as k}from"@codemirror/state";import{history as N,historyKeymap as j}from"@codemirror/history";import{foldGutter as O,foldKeymap as C}from"@codemirror/fold";import{indentOnInput as E}from"@codemirror/language";import{lineNumbers as S,highlightActiveLineGutter as z}from"@codemirror/gutter";import{defaultKeymap as T,indentWithTab as I}from"@codemirror/commands";import{bracketMatching as A}from"@codemirror/matchbrackets";import{closeBrackets as D,closeBracketsKeymap as R}from"@codemirror/closebrackets";import{commentKeymap as M}from"@codemirror/comment";import{typescriptLanguage as F,tsxLanguage as L,jsxLanguage as H,javascriptLanguage as P}from"@codemirror/lang-javascript";import{pythonLanguage as B}from"@codemirror/lang-python";import{StreamLanguage as U}from"@codemirror/stream-parser";import{sql as W}from"@codemirror/lang-sql";import G,{SplitDirection as q}from"@devbookhq/splitter";import{Tree as $}from"antd";import{FolderAddOutlined as K,FileAddOutlined as V,FileOutlined as Y,FolderOutlined as X}from"@ant-design/icons";var J,_,Q,Z;function nn({children:e,rounded:t}){return n("div",Object.assign({className:g("px-2","py-1","flex","items-center","justify-end",{"justify-between":e},{"space-x-2":e},{"rounded-t":t},"bg-gray-300","dark:bg-black-650")},{children:n("div",Object.assign({className:"\n          flex\n          flex-1\n          items-center\n          justify-start\n          space-x-2\n        "},{children:e}))}))}function en({mono:e=!1,hierarchy:t=J.Primary,size:r=_.Regular,hoverable:o,text:a}){let i,c,l,s,d="",p="";switch(t){case J.Primary:i="text-denim-700",c="dark:text-gray-200";break;case J.Secondary:i="text-denim-400",c="dark:text-gray-700",o&&(d="hover:text-denim-700 group-hover:text-denim-700",p="dark:hover:text-gray-200 dark:group-hover:text-gray-200");break;case J.Error:i=c="text-red-400"}switch(r){case _.Small:l="text-2xs",s="font-400";break;case _.Regular:l="text-xs",s="font-400";break;case _.Medium:l="text-base",s="font-500"}return n("span",Object.assign({className:g({"font-mono":e},i,d,c,p,l,s)},{children:a}))}function tn({filepath:e}){return n(nn,{children:n("div",Object.assign({className:"flex items-center space-x-2"},{children:n(en,{mono:!0,hierarchy:en.hierarchy.Secondary,size:en.size.Small,text:e})}))})}function rn({dir:e,variant:t,className:r}){let o,a;switch(t){case Z.CodeEditor:o="border-gray-500",a="dark:border-black-600";break;case Z.SiderNav:o="border-gray-600",a="dark:border-black-650";break;default:o="border-gray-400",a="dark:border-black-650"}return n("div",{className:g(o,a,{"border-b":e===Q.Horizontal},{"border-r":e===Q.Vertical},r)})}!function(n,e){void 0===e&&(e={});var t=e.insertAt;if(n&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===t&&r.firstChild?r.insertBefore(o,r.firstChild):r.appendChild(o),o.styleSheet?o.styleSheet.cssText=n:o.appendChild(document.createTextNode(n))}}('.devbook .cm-editor {\n    display: flex;\n    height: 100%;\n    min-width: 0px;\n    flex: 1 1 0%;\n    padding-left: 0.5rem;\n    padding-right: 0.5rem;\n    text-align: left;\n    --tw-bg-opacity: 1;\n    background-color: rgb(222 222 222 / var(--tw-bg-opacity));\n}.dark .devbook .cm-editor {\n    --tw-bg-opacity: 1;\n    background-color: rgb(41 41 41 / var(--tw-bg-opacity));\n}\n  .devbook .cm-content {\n    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;\n    font-size: 0.85rem;\n    height: auto;\n    --tw-text-opacity: 1;\n    color: rgb(60 74 93 / var(--tw-text-opacity));\n}\n  .dark .devbook .cm-content {\n    --tw-text-opacity: 1;\n    color: rgb(233 233 233 / var(--tw-text-opacity));\n}\n  .devbook .cm-content {\n    caret-color: #292929;\n}\n  .dark .devbook .cm-content {\n    caret-color: #D1D1D1;\n}\n  .devbook .cm-editor .cm-scroller {\n    padding-top: 8px;\n    padding-bottom: 8px;\n    overflow: auto;\n    /* Firefox scrollbar styling */\n    scrollbar-color: #8F8F8F transparent;\n    scrollbar-width: thin;\n  }\n  .devbook .cm-scroller::-webkit-scrollbar {\n    width: 10px;\n    height: 10px;\n  }\n  .devbook .cm-scroller::-webkit-scrollbar-corner {\n    background-color: transparent;\n}\n  .devbook .cm-scroller::-webkit-scrollbar-thumb {\n    --tw-bg-opacity: 1;\n    background-color: rgb(209 209 209 / var(--tw-bg-opacity));\n}\n  .dark .devbook .cm-scroller::-webkit-scrollbar-thumb {\n    --tw-bg-opacity: 1;\n    background-color: rgb(54 54 54 / var(--tw-bg-opacity));\n}\n  .devbook .cm-editor.cm-focused {\n    outline: 2px solid transparent;\n    outline-offset: 2px;\n}\n  .devbook .cm-editor.cm-focused .cm-cursor {\n    --tw-border-opacity: 1;\n    border-left-color: rgb(41 41 41 / var(--tw-border-opacity));\n}\n  .dark .devbook .cm-editor.cm-focused .cm-cursor {\n    --tw-border-opacity: 1;\n    border-left-color: rgb(209 209 209 / var(--tw-border-opacity));\n}\n  .devbook ::-moz-selection {\n    --tw-bg-opacity: 1;\n    background-color: rgb(187 187 187 / var(--tw-bg-opacity));\n}\n  .devbook .cm-editor.cm-focused .cm-selectionBackground, .devbook .cm-selectionBackground, .devbook ::selection {\n    --tw-bg-opacity: 1;\n    background-color: rgb(187 187 187 / var(--tw-bg-opacity));\n}\n  .dark .devbook ::-moz-selection {\n    --tw-bg-opacity: 1;\n    background-color: rgb(143 143 143 / var(--tw-bg-opacity));\n}\n  .dark .devbook .cm-editor.cm-focused .cm-selectionBackground, .dark .devbook .cm-selectionBackground, .dark .devbook ::selection {\n    --tw-bg-opacity: 1;\n    background-color: rgb(143 143 143 / var(--tw-bg-opacity));\n}\n  .devbook ::-moz-selection {\n    --tw-text-opacity: 1;\n    color: rgb(106 115 128 / var(--tw-text-opacity));\n}\n  .devbook .cm-editor.cm-focused .cm-selectionBackground, .devbook .cm-selectionBackground, .devbook ::selection {\n    --tw-text-opacity: 1;\n    color: rgb(106 115 128 / var(--tw-text-opacity));\n}\n  .dark .devbook ::-moz-selection {\n    --tw-text-opacity: 1;\n    color: rgb(219 219 219 / var(--tw-text-opacity));\n}\n  .dark .devbook .cm-editor.cm-focused .cm-selectionBackground, .dark .devbook .cm-selectionBackground, .dark .devbook ::selection {\n    --tw-text-opacity: 1;\n    color: rgb(219 219 219 / var(--tw-text-opacity));\n}\n  .devbook .cm-editor .cm-gutters {\n    --tw-bg-opacity: 1;\n    background-color: rgb(222 222 222 / var(--tw-bg-opacity));\n}\n  .dark .devbook .cm-editor .cm-gutters {\n    --tw-bg-opacity: 1;\n    background-color: rgb(41 41 41 / var(--tw-bg-opacity));\n}\n  .devbook .cm-editor .cm-gutters {\n    --tw-text-opacity: 1;\n    color: rgb(174 175 178 / var(--tw-text-opacity));\n}\n  .dark .devbook .cm-editor .cm-gutters {\n    --tw-text-opacity: 1;\n    color: rgb(143 143 143 / var(--tw-text-opacity));\n}\n  .devbook .cm-editor .cm-gutters {\n    border-style: none;\n    padding-right: 0.5rem;\n}\n  .devbook .cm-gutter {\n    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;\n    font-size: 0.85rem;\n    height: auto;\n    border-style: none;\n    --tw-bg-opacity: 1;\n    background-color: rgb(222 222 222 / var(--tw-bg-opacity));\n}\n  .dark .devbook .cm-gutter {\n    --tw-bg-opacity: 1;\n    background-color: rgb(41 41 41 / var(--tw-bg-opacity));\n}\n  .devbook .cm-gutter.cm-lineNumbers {\n    text-align: right;\n    min-width: 36px;\n}\n  .devbook .cm-editor .cm-activeLineGutter {\n    --tw-bg-opacity: 1;\n    background-color: rgb(222 222 222 / var(--tw-bg-opacity));\n}\n  .dark .devbook .cm-editor .cm-activeLineGutter {\n    --tw-bg-opacity: 1;\n    background-color: rgb(41 41 41 / var(--tw-bg-opacity));\n}\n  .devbook .cm-editor.cm-focused .cm-activeLineGutter {\n    --tw-text-opacity: 1;\n    color: rgb(54 54 54 / var(--tw-text-opacity));\n}\n  .dark .devbook .cm-editor.cm-focused .cm-activeLineGutter {\n    --tw-text-opacity: 1;\n    color: rgb(219 219 219 / var(--tw-text-opacity));\n}\n  .devbook .cm-editor .cm-line.cm-activeLine {\n    background-color: transparent;\n}\n  .devbook .cm-foldPlaceholder {\n    background-color: transparent;\n    border: none;\n    color: #ddd;\n  }\n  .devbook .cm-content .cm-line, .devbook .cm-editor .cm-gutters .cm-lineNumbers {\n    padding-top: 1px;\n    padding-bottom: 1px;\n}\n  /* regexp, escape, and special(string) are mapped to "cmt-string2" */\n  .devbook .cmt-string2 {\n    --tw-text-opacity: 1;\n    color: rgb(86 182 194 / var(--tw-text-opacity));\n}\n  /* special(variableName) to "cmt-variableName2" */\n  .devbook .cmt-variableName2 {\n    --tw-text-opacity: 1;\n    color: rgb(209 154 102 / var(--tw-text-opacity));\n}\n  /* local(variableName) to "cmt-variableName cmt-local" */\n  .devbook .cmt-variableName .cmt-local {\n    --tw-text-opacity: 1;\n    color: rgb(51 0 170 / var(--tw-text-opacity));\n}\n  /* definition(variableName) to "cmt-variableName cmt-definition" */\n  .devbook .cmt-variableName .cmt-definition {\n    --tw-text-opacity: 1;\n    color: rgb(97 175 239 / var(--tw-text-opacity));\n}\n  /* definition(propertyName) to "cmt-propertyName cmt-definition" */\n  .devbook .cmt-propertyName .cmt-definition {\n    --tw-text-opacity: 1;\n    color: rgb(171 178 191 / var(--tw-text-opacity));\n}\n  /* Token styling */\n  .devbook .cmt-link {\n    -webkit-text-decoration-line: underline;\n            text-decoration-line: underline;\n    --tw-text-opacity: 1;\n    color: rgb(125 135 153 / var(--tw-text-opacity));\n}\n  .devbook .cmt-heading {\n    font-weight: 700;\n    -webkit-text-decoration-line: underline;\n            text-decoration-line: underline;\n}\n  .devbook .cmt-strikethrough {\n    -webkit-text-decoration-line: line-through;\n            text-decoration-line: line-through;\n}\n  .devbook .cmt-emphasis {\n    font-style: italic;\n}\n  .devbook .cmt-strong {\n    font-weight: 700;\n}\n  .devbook .cmt-keyword {\n    --tw-text-opacity: 1;\n    color: rgb(198 120 221 / var(--tw-text-opacity));\n}\n  .devbook .cmt-atom {\n    --tw-text-opacity: 1;\n    color: rgb(209 154 102 / var(--tw-text-opacity));\n}\n  .devbook .cmt-bool {\n    --tw-text-opacity: 1;\n    color: rgb(209 154 102 / var(--tw-text-opacity));\n}\n  .devbook .cmt-url {\n    --tw-text-opacity: 1;\n    color: rgb(86 182 194 / var(--tw-text-opacity));\n}\n  .devbook .cmt-labelName {\n    --tw-text-opacity: 1;\n    color: rgb(97 175 239 / var(--tw-text-opacity));\n}\n  .devbook .cmt-inserted {\n    --tw-text-opacity: 1;\n    color: rgb(152 195 121 / var(--tw-text-opacity));\n}\n  .devbook .cmt-deleted {\n    --tw-text-opacity: 1;\n    color: rgb(224 108 117 / var(--tw-text-opacity));\n}\n  .devbook .cmt-literal {\n    --tw-text-opacity: 1;\n    color: rgb(152 195 121 / var(--tw-text-opacity));\n}\n  .devbook .cmt-string {\n    --tw-text-opacity: 1;\n    color: rgb(152 195 121 / var(--tw-text-opacity));\n}\n  .devbook .cmt-number {\n    --tw-text-opacity: 1;\n    color: rgb(229 192 123 / var(--tw-text-opacity));\n}\n  .devbook .cmt-variableName {\n    --tw-text-opacity: 1;\n    color: rgb(209 154 102 / var(--tw-text-opacity));\n}\n  .devbook .cmt-typeName {\n    --tw-text-opacity: 1;\n    color: rgb(229 192 123 / var(--tw-text-opacity));\n}\n  .devbook .cmt-namespace {\n    --tw-text-opacity: 1;\n    color: rgb(229 192 123 / var(--tw-text-opacity));\n}\n  .devbook .cmt-className {\n    --tw-text-opacity: 1;\n    color: rgb(229 192 123 / var(--tw-text-opacity));\n}\n  .devbook .cmt-macroName {\n    --tw-text-opacity: 1;\n    color: rgb(224 108 117 / var(--tw-text-opacity));\n}\n  .devbook .cmt-propertyName {\n    --tw-text-opacity: 1;\n    color: rgb(224 108 117 / var(--tw-text-opacity));\n}\n  .devbook .cmt-operator {\n    --tw-text-opacity: 1;\n    color: rgb(86 182 194 / var(--tw-text-opacity));\n}\n  .devbook .cmt-comment {\n    --tw-text-opacity: 1;\n    color: rgb(125 135 153 / var(--tw-text-opacity));\n}\n  .devbook .cmt-meta {\n    --tw-text-opacity: 1;\n    color: rgb(125 135 153 / var(--tw-text-opacity));\n}\n  .devbook .cmt-punctuation {}\n  .devbook .cmt-invalid {\n    --tw-text-opacity: 1;\n    color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n/**\n * This file contains CSS rules that overrides the default style of the Ant\'s Tree components.\n */\n/* Remove tree\'s background. */\n.ant-tree {\n    background-color: transparent;\n    --tw-text-opacity: 1;\n    color: rgb(60 74 93 / var(--tw-text-opacity));\n}\n.dark .ant-tree {\n    --tw-text-opacity: 1;\n    color: rgb(233 233 233 / var(--tw-text-opacity));\n}\n/* Set the tree\'s font-family, text and icon colors and enable antialiasing. */\n.ant-tree-list {\n    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";\n    font-size: 0.85rem;\n    --tw-text-opacity: 1;\n    color: rgb(60 74 93 / var(--tw-text-opacity));\n}\n.dark .ant-tree-list {\n    --tw-text-opacity: 1;\n    color: rgb(233 233 233 / var(--tw-text-opacity));\n}\n/* Add visual padding to the node. */\n.ant-tree.ant-tree-directory .ant-tree-treenode {\n    padding-left: 1rem;\n    padding-right: 1rem;\n}\n/* Set proper text colors for the titles. */\n.ant-tree.ant-tree-directory .ant-tree-treenode .ant-tree-node-content-wrapper .ant-tree-title {\n    --tw-text-opacity: 1;\n    color: rgb(60 74 93 / var(--tw-text-opacity));\n}\n.dark .ant-tree.ant-tree-directory .ant-tree-treenode .ant-tree-node-content-wrapper .ant-tree-title {\n    --tw-text-opacity: 1;\n    color: rgb(233 233 233 / var(--tw-text-opacity));\n}\n/* Override the hover effect, text color and background color for selected nodes. */\n.ant-tree.ant-tree-directory .ant-tree-treenode::before {\n    transition-property: none;\n}\n.ant-tree.ant-tree-directory .ant-tree-treenode:hover::before, .ant-tree.ant-tree-directory .ant-tree-treenode-selected::before {\n    --tw-bg-opacity: 1;\n    background-color: rgb(174 175 178 / var(--tw-bg-opacity));\n}\n.dark .ant-tree.ant-tree-directory .ant-tree-treenode:hover::before, .dark .ant-tree.ant-tree-directory .ant-tree-treenode-selected::before {\n    --tw-bg-opacity: 1;\n    background-color: rgb(55 61 71 / var(--tw-bg-opacity));\n}\n/* Disable the hover effect on disabled nodes. */\n.ant-tree.ant-tree-directory .ant-tree-treenode-disabled:hover::before {\n    background-color: transparent;\n}\n/* Customize padding between the caret and the rest of the row. Disable animation. */\n.ant-tree .ant-tree-node-content-wrapper {\n    padding: 0px;\n    transition-property: none;\n}\n/* Disable "not-allowed" cursor for disabled nodes. */\n.ant-tree.ant-tree-directory .ant-tree-treenode-disabled .ant-tree-node-content-wrapper {\n    cursor: default;\n}\n/* Don\'t show an icon for disabled nodes. */\n.ant-tree.ant-tree-directory .ant-tree-treenode-disabled .ant-tree-iconEle {\n    display: none;\n}\n/* Make the title part of a node to take the maximum width. */\n.ant-tree.ant-tree-directory .ant-tree-treenode .ant-tree-node-content-wrapper, .ant-tree.ant-tree-directory .ant-tree-treenode .ant-tree-node-content-wrapper .ant-tree-title, .ant-tree.ant-tree-directory .ant-tree-treenode .ant-tree-node-content-wrapper .ant-tree-title .ant-dropdown-trigger {\n    display: flex;\n    flex: 1 1 0%;\n}\n.ant-tree-title {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n/* Set the size of the caret icon. */\n.ant-tree.ant-tree-directory .ant-tree-treenode .ant-tree-switcher {\n    height: 1.5rem;\n    width: 1.5rem;\n    font-size: 10px;\n    transition-property: none;\n}\n.devbook-filesystem {\n    overflow: auto;\n  \n  /* Firefox scrollbar styling */\n  scrollbar-color: #8F8F8F transparent;\n  scrollbar-width: thin;\n}\n.devbook-filesystem::-webkit-scrollbar {\n  width: 10px;\n  height: 10px;\n}\n.devbook-filesystem::-webkit-scrollbar-corner {\n    background-color: transparent;\n}\n.devbook-filesystem::-webkit-scrollbar-thumb {\n    --tw-bg-opacity: 1;\n    background-color: rgb(209 209 209 / var(--tw-bg-opacity));\n}\n.dark .devbook-filesystem::-webkit-scrollbar-thumb {\n    --tw-bg-opacity: 1;\n    background-color: rgb(54 54 54 / var(--tw-bg-opacity));\n}\n.ant-tree.ant-tree-directory .ant-tree-treenode {\n  position: relative;\n}\n.ant-tree.ant-tree-directory .ant-tree-treenode::before {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 4px;\n  left: 0;\n  transition: background-color 0.3s;\n  content: \'\';\n  pointer-events: none;\n}\n.ant-tree.ant-tree-directory .ant-tree-treenode:hover::before {\n  background: #f5f5f5;\n}\n.ant-tree.ant-tree-directory .ant-tree-treenode > * {\n  z-index: 1;\n}\n.ant-tree.ant-tree-directory .ant-tree-treenode .ant-tree-switcher {\n  transition: color 0.3s;\n}\n.ant-tree.ant-tree-directory .ant-tree-treenode .ant-tree-node-content-wrapper {\n  border-radius: 0;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n.ant-tree.ant-tree-directory .ant-tree-treenode .ant-tree-node-content-wrapper:hover {\n  background: transparent;\n}\n.ant-tree.ant-tree-directory .ant-tree-treenode .ant-tree-node-content-wrapper.ant-tree-node-selected {\n  color: #fff;\n  background: transparent;\n}\n.ant-tree.ant-tree-directory .ant-tree-treenode-selected:hover::before,\n.ant-tree.ant-tree-directory .ant-tree-treenode-selected::before {\n  background: #1890ff;\n}\n.ant-tree.ant-tree-directory .ant-tree-treenode-selected .ant-tree-switcher {\n  color: #fff;\n}\n.ant-tree.ant-tree-directory .ant-tree-treenode-selected .ant-tree-node-content-wrapper {\n  color: #fff;\n  background: transparent;\n}\n.ant-tree-checkbox {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  color: rgba(0, 0, 0, 0.85);\n  font-size: 14px;\n  font-variant: tabular-nums;\n  list-style: none;\n  font-feature-settings: \'tnum\';\n  position: relative;\n  top: 0.2em;\n  line-height: 1;\n  white-space: nowrap;\n  outline: none;\n  cursor: pointer;\n}\n.ant-tree-checkbox-wrapper:hover .ant-tree-checkbox-inner,\n.ant-tree-checkbox:hover .ant-tree-checkbox-inner,\n.ant-tree-checkbox-input:focus + .ant-tree-checkbox-inner {\n  border-color: #1890ff;\n}\n.ant-tree-checkbox-checked::after {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  border: 1px solid #1890ff;\n  border-radius: 2px;\n  visibility: hidden;\n  -webkit-animation: antCheckboxEffect 0.36s ease-in-out;\n          animation: antCheckboxEffect 0.36s ease-in-out;\n  -webkit-animation-fill-mode: backwards;\n          animation-fill-mode: backwards;\n  content: \'\';\n}\n.ant-tree-checkbox:hover::after,\n.ant-tree-checkbox-wrapper:hover .ant-tree-checkbox::after {\n  visibility: visible;\n}\n.ant-tree-checkbox-inner {\n  position: relative;\n  top: 0;\n  left: 0;\n  display: block;\n  width: 16px;\n  height: 16px;\n  direction: ltr;\n  background-color: #fff;\n  border: 1px solid #d9d9d9;\n  border-radius: 2px;\n  border-collapse: separate;\n  transition: all 0.3s;\n}\n.ant-tree-checkbox-inner::after {\n  position: absolute;\n  top: 50%;\n  left: 21.5%;\n  display: table;\n  width: 5.71428571px;\n  height: 9.14285714px;\n  border: 2px solid #fff;\n  border-top: 0;\n  border-left: 0;\n  transform: rotate(45deg) scale(0) translate(-50%, -50%);\n  opacity: 0;\n  transition: all 0.1s cubic-bezier(0.71, -0.46, 0.88, 0.6), opacity 0.1s;\n  content: \' \';\n}\n.ant-tree-checkbox-input {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 1;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n  opacity: 0;\n}\n.ant-tree-checkbox-checked .ant-tree-checkbox-inner::after {\n  position: absolute;\n  display: table;\n  border: 2px solid #fff;\n  border-top: 0;\n  border-left: 0;\n  transform: rotate(45deg) scale(1) translate(-50%, -50%);\n  opacity: 1;\n  transition: all 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46) 0.1s;\n  content: \' \';\n}\n.ant-tree-checkbox-checked .ant-tree-checkbox-inner {\n  background-color: #1890ff;\n  border-color: #1890ff;\n}\n.ant-tree-checkbox-disabled {\n  cursor: not-allowed;\n}\n.ant-tree-checkbox-disabled.ant-tree-checkbox-checked .ant-tree-checkbox-inner::after {\n  border-color: rgba(0, 0, 0, 0.25);\n  -webkit-animation-name: none;\n          animation-name: none;\n}\n.ant-tree-checkbox-disabled .ant-tree-checkbox-input {\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.ant-tree-checkbox-disabled .ant-tree-checkbox-inner {\n  background-color: #f5f5f5;\n  border-color: #d9d9d9 !important;\n}\n.ant-tree-checkbox-disabled .ant-tree-checkbox-inner::after {\n  border-color: #f5f5f5;\n  border-collapse: separate;\n  -webkit-animation-name: none;\n          animation-name: none;\n}\n.ant-tree-checkbox-disabled + span {\n  color: rgba(0, 0, 0, 0.25);\n  cursor: not-allowed;\n}\n.ant-tree-checkbox-disabled:hover::after,\n.ant-tree-checkbox-wrapper:hover .ant-tree-checkbox-disabled::after {\n  visibility: hidden;\n}\n.ant-tree-checkbox-wrapper {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  color: rgba(0, 0, 0, 0.85);\n  font-size: 14px;\n  font-variant: tabular-nums;\n  line-height: 1.5715;\n  list-style: none;\n  font-feature-settings: \'tnum\';\n  display: inline-flex;\n  align-items: baseline;\n  line-height: unset;\n  cursor: pointer;\n}\n.ant-tree-checkbox-wrapper::after {\n  display: inline-block;\n  width: 0;\n  overflow: hidden;\n  content: \'\\a0\';\n}\n.ant-tree-checkbox-wrapper.ant-tree-checkbox-wrapper-disabled {\n  cursor: not-allowed;\n}\n.ant-tree-checkbox-wrapper + .ant-tree-checkbox-wrapper {\n  margin-left: 8px;\n}\n.ant-tree-checkbox + span {\n  padding-right: 8px;\n  padding-left: 8px;\n}\n.ant-tree-checkbox-group {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  color: rgba(0, 0, 0, 0.85);\n  font-size: 14px;\n  font-variant: tabular-nums;\n  line-height: 1.5715;\n  list-style: none;\n  font-feature-settings: \'tnum\';\n  display: inline-block;\n}\n.ant-tree-checkbox-group-item {\n  margin-right: 8px;\n}\n.ant-tree-checkbox-group-item:last-child {\n  margin-right: 0;\n}\n.ant-tree-checkbox-group-item + .ant-tree-checkbox-group-item {\n  margin-left: 0;\n}\n.ant-tree-checkbox-indeterminate .ant-tree-checkbox-inner {\n  background-color: #fff;\n  border-color: #d9d9d9;\n}\n.ant-tree-checkbox-indeterminate .ant-tree-checkbox-inner::after {\n  top: 50%;\n  left: 50%;\n  width: 8px;\n  height: 8px;\n  background-color: #1890ff;\n  border: 0;\n  transform: translate(-50%, -50%) scale(1);\n  opacity: 1;\n  content: \' \';\n}\n.ant-tree-checkbox-indeterminate.ant-tree-checkbox-disabled .ant-tree-checkbox-inner::after {\n  background-color: rgba(0, 0, 0, 0.25);\n  border-color: rgba(0, 0, 0, 0.25);\n}\n.ant-tree {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  font-size: 14px;\n  font-variant: tabular-nums;\n  line-height: 1.5715;\n  list-style: none;\n  font-feature-settings: \'tnum\';\n  border-radius: 2px;\n  transition: background-color 0.3s;\n}\n.ant-tree-focused:not(:hover):not(.ant-tree-active-focused) {\n  background: #e6f7ff;\n}\n.ant-tree-list-holder-inner {\n  align-items: flex-start;\n}\n.ant-tree.ant-tree-block-node .ant-tree-list-holder-inner {\n  align-items: stretch;\n}\n.ant-tree.ant-tree-block-node .ant-tree-list-holder-inner .ant-tree-node-content-wrapper {\n  flex: auto;\n}\n.ant-tree.ant-tree-block-node .ant-tree-list-holder-inner .ant-tree-treenode.dragging {\n  position: relative;\n}\n.ant-tree.ant-tree-block-node .ant-tree-list-holder-inner .ant-tree-treenode.dragging::after {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 4px;\n  left: 0;\n  border: 1px solid #1890ff;\n  opacity: 0;\n  -webkit-animation: ant-tree-node-fx-do-not-use 0.3s;\n          animation: ant-tree-node-fx-do-not-use 0.3s;\n  -webkit-animation-play-state: running;\n          animation-play-state: running;\n  -webkit-animation-fill-mode: forwards;\n          animation-fill-mode: forwards;\n  content: \'\';\n  pointer-events: none;\n}\n.ant-tree .ant-tree-treenode {\n  display: flex;\n  align-items: flex-start;\n  padding: 0 0 4px 0;\n  outline: none;\n}\n.ant-tree .ant-tree-treenode-disabled .ant-tree-node-content-wrapper {\n  color: rgba(0, 0, 0, 0.25);\n  cursor: not-allowed;\n}\n.ant-tree .ant-tree-treenode-disabled .ant-tree-node-content-wrapper:hover {\n  background: transparent;\n}\n.ant-tree .ant-tree-treenode-active .ant-tree-node-content-wrapper {\n  background: #f5f5f5;\n}\n.ant-tree .ant-tree-treenode:not(.ant-tree .ant-tree-treenode-disabled).filter-node .ant-tree-title {\n  color: inherit;\n  font-weight: 500;\n}\n.ant-tree-indent {\n  align-self: stretch;\n  white-space: nowrap;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n.ant-tree-indent-unit {\n  display: inline-block;\n  width: 24px;\n}\n.ant-tree-draggable-icon {\n  width: 24px;\n  line-height: 24px;\n  text-align: center;\n  opacity: 0.2;\n  transition: opacity 0.3s;\n}\n.ant-tree-treenode:hover .ant-tree-draggable-icon {\n  opacity: 0.45;\n}\n.ant-tree-switcher {\n  position: relative;\n  flex: none;\n  align-self: stretch;\n  width: 24px;\n  margin: 0;\n  line-height: 24px;\n  text-align: center;\n  cursor: pointer;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n.ant-tree-switcher .ant-tree-switcher-icon,\n.ant-tree-switcher .ant-select-tree-switcher-icon {\n  display: inline-block;\n  font-size: 10px;\n  vertical-align: baseline;\n}\n.ant-tree-switcher .ant-tree-switcher-icon svg,\n.ant-tree-switcher .ant-select-tree-switcher-icon svg {\n  transition: transform 0.3s;\n}\n.ant-tree-switcher-noop {\n  cursor: default;\n}\n.ant-tree-switcher_close .ant-tree-switcher-icon svg {\n  transform: rotate(-90deg);\n}\n.ant-tree-switcher-loading-icon {\n  color: #1890ff;\n}\n.ant-tree-switcher-leaf-line {\n  position: relative;\n  z-index: 1;\n  display: inline-block;\n  width: 100%;\n  height: 100%;\n}\n.ant-tree-switcher-leaf-line::before {\n  position: absolute;\n  top: 0;\n  right: 12px;\n  bottom: -4px;\n  margin-left: -1px;\n  border-right: 1px solid #d9d9d9;\n  content: \' \';\n}\n.ant-tree-switcher-leaf-line::after {\n  position: absolute;\n  width: 10px;\n  height: 14px;\n  border-bottom: 1px solid #d9d9d9;\n  content: \' \';\n}\n.ant-tree-checkbox {\n  top: initial;\n  margin: 4px 8px 0 0;\n}\n.ant-tree .ant-tree-node-content-wrapper {\n  position: relative;\n  z-index: auto;\n  min-height: 24px;\n  margin: 0;\n  padding: 0 4px;\n  color: inherit;\n  line-height: 24px;\n  background: transparent;\n  border-radius: 2px;\n  cursor: pointer;\n  transition: all 0.3s, border 0s, line-height 0s, box-shadow 0s;\n}\n.ant-tree .ant-tree-node-content-wrapper:hover {\n  background-color: #f5f5f5;\n}\n.ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected {\n  background-color: #bae7ff;\n}\n.ant-tree .ant-tree-node-content-wrapper .ant-tree-iconEle {\n  display: flex;\n  align-items: center;\n  width: 24px;\n  height: 24px;\n  line-height: 24px;\n  text-align: center;\n  vertical-align: top;\n}\n.ant-tree .ant-tree-node-content-wrapper .ant-tree-iconEle:empty {\n  display: none;\n}\n.ant-tree-unselectable .ant-tree-node-content-wrapper:hover {\n  background-color: transparent;\n}\n.ant-tree-node-content-wrapper {\n  line-height: 24px;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n.ant-tree-node-content-wrapper .ant-tree-drop-indicator {\n  position: absolute;\n  z-index: 1;\n  height: 2px;\n  background-color: #1890ff;\n  border-radius: 1px;\n  pointer-events: none;\n}\n.ant-tree-node-content-wrapper .ant-tree-drop-indicator::after {\n  position: absolute;\n  top: -3px;\n  left: -6px;\n  width: 8px;\n  height: 8px;\n  background-color: transparent;\n  border: 2px solid #1890ff;\n  border-radius: 50%;\n  content: \'\';\n}\n.ant-tree .ant-tree-treenode.drop-container > [draggable] {\n  box-shadow: 0 0 0 2px #1890ff;\n}\n.ant-tree-show-line .ant-tree-indent-unit {\n  position: relative;\n  height: 100%;\n}\n.ant-tree-show-line .ant-tree-indent-unit::before {\n  position: absolute;\n  top: 0;\n  right: 12px;\n  bottom: -4px;\n  border-right: 1px solid #d9d9d9;\n  content: \'\';\n}\n.ant-tree-show-line .ant-tree-indent-unit-end::before {\n  display: none;\n}\n.ant-tree-show-line .ant-tree-switcher {\n  background: #fff;\n}\n.ant-tree-show-line .ant-tree-switcher-line-icon {\n  vertical-align: -0.15em;\n}\n.ant-tree .ant-tree-treenode-leaf-last .ant-tree-switcher-leaf-line::before {\n  top: auto !important;\n  bottom: auto !important;\n  height: 14px !important;\n}\n.ant-tree-rtl {\n  direction: rtl;\n}\n.ant-tree-rtl .ant-tree-node-content-wrapper[draggable=\'true\'] .ant-tree-drop-indicator::after {\n  right: -6px;\n  left: unset;\n}\n.ant-tree .ant-tree-treenode-rtl {\n  direction: rtl;\n}\n.ant-tree-rtl .ant-tree-switcher_close .ant-tree-switcher-icon svg {\n  transform: rotate(90deg);\n}\n.ant-tree-rtl.ant-tree-show-line .ant-tree-indent-unit::before {\n  right: auto;\n  left: -13px;\n  border-right: none;\n  border-left: 1px solid #d9d9d9;\n}\n.ant-tree-rtl.ant-tree-checkbox {\n  margin: 4px 0 0 8px;\n}\n.ant-tree-select-dropdown-rtl .ant-select-tree-checkbox {\n  margin: 4px 0 0 8px;\n}\n.ant-switch {\n    --tw-bg-opacity: 1 !important;\n    background-color: rgb(203 203 203 / var(--tw-bg-opacity)) !important;\n}\n.dark .ant-switch {\n    --tw-bg-opacity: 1 !important;\n    background-color: rgb(143 143 143 / var(--tw-bg-opacity)) !important;\n}\n.ant-switch.ant-switch-checked {\n    --tw-bg-opacity: 1 !important;\n    background-color: rgb(10 192 105 / var(--tw-bg-opacity)) !important;\n}\n/**\n * Copyright (c) 2014 The xterm.js authors. All rights reserved.\n * Copyright (c) 2012-2013, Christopher Jeffrey (MIT License)\n * https://github.com/chjj/term.js\n * @license MIT\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the "Software"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n *\n * Originally forked from (with the author\'s permission):\n *   Fabrice Bellard\'s javascript vt100 for jslinux:\n *   http://bellard.org/jslinux/\n *   Copyright (c) 2011 Fabrice Bellard\n *   The original design remains. The terminal itself\n *   has been extended to include xterm CSI codes, among\n *   other features.\n */\n/**\n *  Default styles for xterm.js\n */\n.xterm {\n  position: relative;\n  -moz-user-select: none;\n       user-select: none;\n  -ms-user-select: none;\n  -webkit-user-select: none;\n}\n.xterm.focus,\n.xterm:focus {\n  outline: none;\n}\n.xterm .xterm-helpers {\n  position: absolute;\n  top: 0;\n  /**\n   * The z-index of the helpers must be higher than the canvases in order for\n   * IMEs to appear on top.\n   */\n  z-index: 5;\n}\n.xterm .xterm-helper-textarea {\n  padding: 0;\n  border: 0;\n  margin: 0;\n  /* Move textarea out of the screen to the far left, so that the cursor is not visible */\n  position: absolute;\n  opacity: 0;\n  left: -9999em;\n  top: 0;\n  width: 0;\n  height: 0;\n  z-index: -5;\n  /** Prevent wrapping so the IME appears against the textarea at the correct position */\n  white-space: nowrap;\n  overflow: hidden;\n  resize: none;\n}\n.xterm .composition-view {\n  /* TODO: Composition position got messed up somewhere */\n  background: #000;\n  color: #FFF;\n  display: none;\n  position: absolute;\n  white-space: nowrap;\n  z-index: 1;\n}\n.xterm .composition-view.active {\n  display: block;\n}\n.xterm .xterm-screen {\n  position: relative;\n}\n.xterm .xterm-screen canvas {\n  position: absolute;\n  left: 0;\n  top: 0;\n}\n.xterm .xterm-scroll-area {\n  visibility: hidden;\n}\n.xterm-char-measure-element {\n  display: inline-block;\n  visibility: hidden;\n  position: absolute;\n  top: 0;\n  left: -9999em;\n  line-height: normal;\n}\n.xterm {\n  cursor: text;\n}\n.xterm.enable-mouse-events {\n  /* When mouse events are enabled (eg. tmux), revert to the standard pointer cursor */\n  cursor: default;\n}\n.xterm.xterm-cursor-pointer,\n.xterm .xterm-cursor-pointer {\n  cursor: pointer;\n}\n.xterm.column-select.focus {\n  /* Column selection mode */\n  cursor: crosshair;\n}\n.xterm .xterm-accessibility,\n.xterm .xterm-message {\n  position: absolute;\n  left: 0;\n  top: 0;\n  bottom: 0;\n  right: 0;\n  z-index: 10;\n  color: transparent;\n}\n.xterm .live-region {\n  position: absolute;\n  left: -9999px;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n}\n.xterm-dim {\n  opacity: 0.5;\n}\n.xterm-underline {\n  text-decoration: underline;\n}\n.xterm-strikethrough {\n  text-decoration: line-through;\n}\n.xterm-screen .xterm-decoration-container .xterm-decoration {\n  z-index: 6;\n  position: absolute;\n}\n.xterm .xterm-viewport {\n  /* On OS X this is required in order for the scroll bar to appear fully opaque */\n  background-color: transparent;\n  cursor: default;\n  position: absolute;\n  right: 0;\n  left: 0;\n  top: 0;\n  bottom: 0;\n  overflow: auto;\n  scrollbar-color: #8F8F8F transparent;\n  scrollbar-width: thin;\n}\n.xterm-viewport::-webkit-scrollbar {\n  width: 10px;\n  height: 10px;\n}\n.xterm-viewport::-webkit-scrollbar-thumb {\n    --tw-bg-opacity: 1;\n    background-color: rgb(209 209 209 / var(--tw-bg-opacity));\n}\n.dark .xterm-viewport::-webkit-scrollbar-thumb {\n    --tw-bg-opacity: 1;\n    background-color: rgb(54 54 54 / var(--tw-bg-opacity));\n}\n.xterm-viewport::-webkit-scrollbar-corner {\n    background-color: transparent;\n}\n.visible {\n    visibility: visible;\n}\n.invisible {\n    visibility: hidden;\n}\n.absolute {\n    position: absolute;\n}\n.relative {\n    position: relative;\n}\n.z-20 {\n    z-index: 20;\n}\n.z-10 {\n    z-index: 10;\n}\n.my-auto {\n    margin-top: auto;\n    margin-bottom: auto;\n}\n.block {\n    display: block;\n}\n.inline {\n    display: inline;\n}\n.flex {\n    display: flex;\n}\n.h-3 {\n    height: 0.75rem;\n}\n.h-4 {\n    height: 1rem;\n}\n.h-full {\n    height: 100%;\n}\n.max-h-full {\n    max-height: 100%;\n}\n.max-h-\\[180px\\] {\n    max-height: 180px;\n}\n.w-3 {\n    width: 0.75rem;\n}\n.w-4 {\n    width: 1rem;\n}\n.w-full {\n    width: 100%;\n}\n.min-w-0 {\n    min-width: 0px;\n}\n.min-w-\\[100px\\] {\n    min-width: 100px;\n}\n.flex-1 {\n    flex: 1 1 0%;\n}\n@-webkit-keyframes spin {to {\n        transform: rotate(360deg);\n    }\n}\n@keyframes spin {to {\n        transform: rotate(360deg);\n    }\n}\n.animate-spin {\n    -webkit-animation: spin 1s linear infinite;\n            animation: spin 1s linear infinite;\n}\n.cursor-not-allowed {\n    cursor: not-allowed;\n}\n.cursor-wait {\n    cursor: wait;\n}\n.cursor-pointer {\n    cursor: pointer;\n}\n.resize {\n    resize: both;\n}\n.flex-col {\n    flex-direction: column;\n}\n.items-start {\n    align-items: flex-start;\n}\n.items-center {\n    align-items: center;\n}\n.justify-start {\n    justify-content: flex-start;\n}\n.justify-end {\n    justify-content: flex-end;\n}\n.justify-center {\n    justify-content: center;\n}\n.justify-between {\n    justify-content: space-between;\n}\n.space-x-2 > :not([hidden]) ~ :not([hidden]) {\n    --tw-space-x-reverse: 0;\n    margin-right: calc(0.5rem * var(--tw-space-x-reverse));\n    margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));\n}\n.space-y-2 > :not([hidden]) ~ :not([hidden]) {\n    --tw-space-y-reverse: 0;\n    margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n    margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n}\n.space-y-1 > :not([hidden]) ~ :not([hidden]) {\n    --tw-space-y-reverse: 0;\n    margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));\n    margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));\n}\n.space-x-1 > :not([hidden]) ~ :not([hidden]) {\n    --tw-space-x-reverse: 0;\n    margin-right: calc(0.25rem * var(--tw-space-x-reverse));\n    margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));\n}\n.overflow-auto {\n    overflow: auto;\n}\n.overflow-hidden {\n    overflow: hidden;\n}\n.overflow-x-hidden {\n    overflow-x: hidden;\n}\n.truncate {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n.whitespace-nowrap {\n    white-space: nowrap;\n}\n.whitespace-pre {\n    white-space: pre;\n}\n.rounded {\n    border-radius: 0.25rem;\n}\n.rounded-t {\n    border-top-left-radius: 0.25rem;\n    border-top-right-radius: 0.25rem;\n}\n.rounded-b {\n    border-bottom-right-radius: 0.25rem;\n    border-bottom-left-radius: 0.25rem;\n}\n.border {\n    border-width: 1px;\n}\n.border-x {\n    border-left-width: 1px;\n    border-right-width: 1px;\n}\n.border-b {\n    border-bottom-width: 1px;\n}\n.border-r {\n    border-right-width: 1px;\n}\n.border-none {\n    border-style: none;\n}\n.border-gray-500 {\n    --tw-border-opacity: 1;\n    border-color: rgb(209 209 209 / var(--tw-border-opacity));\n}\n.border-gray-600 {\n    --tw-border-opacity: 1;\n    border-color: rgb(187 187 187 / var(--tw-border-opacity));\n}\n.border-gray-400 {\n    --tw-border-opacity: 1;\n    border-color: rgb(219 219 219 / var(--tw-border-opacity));\n}\n.border-gray-300 {\n    --tw-border-opacity: 1;\n    border-color: rgb(222 222 222 / var(--tw-border-opacity));\n}\n.border-black-600 {\n    --tw-border-opacity: 1;\n    border-color: rgb(54 54 54 / var(--tw-border-opacity));\n}\n.border-green-400 {\n    --tw-border-opacity: 1;\n    border-color: rgb(10 192 105 / var(--tw-border-opacity));\n}\n.bg-gray-550 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(203 203 203 / var(--tw-bg-opacity));\n}\n.bg-gray-300 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(222 222 222 / var(--tw-bg-opacity));\n}\n.bg-gray-400 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(219 219 219 / var(--tw-bg-opacity));\n}\n.bg-gray-500 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(209 209 209 / var(--tw-bg-opacity));\n}\n.bg-transparent {\n    background-color: transparent;\n}\n.bg-gray-800 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(143 143 143 / var(--tw-bg-opacity));\n}\n.bg-gray-100 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(240 240 240 / var(--tw-bg-opacity));\n}\n.bg-black-700 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(38 38 38 / var(--tw-bg-opacity));\n}\n.bg-black-650 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(41 41 41 / var(--tw-bg-opacity));\n}\n.bg-black-800 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(31 31 31 / var(--tw-bg-opacity));\n}\n.p-2 {\n    padding: 0.5rem;\n}\n.p-0\\.5 {\n    padding: 0.125rem;\n}\n.p-0 {\n    padding: 0px;\n}\n.py-2 {\n    padding-top: 0.5rem;\n    padding-bottom: 0.5rem;\n}\n.px-3 {\n    padding-left: 0.75rem;\n    padding-right: 0.75rem;\n}\n.px-2 {\n    padding-left: 0.5rem;\n    padding-right: 0.5rem;\n}\n.py-1 {\n    padding-top: 0.25rem;\n    padding-bottom: 0.25rem;\n}\n.px-4 {\n    padding-left: 1rem;\n    padding-right: 1rem;\n}\n.px-1 {\n    padding-left: 0.25rem;\n    padding-right: 0.25rem;\n}\n.py-px {\n    padding-top: 1px;\n    padding-bottom: 1px;\n}\n.pl-\\[10px\\] {\n    padding-left: 10px;\n}\n.pt-2 {\n    padding-top: 0.5rem;\n}\n.pl-4 {\n    padding-left: 1rem;\n}\n.pt-4 {\n    padding-top: 1rem;\n}\n.pb-2 {\n    padding-bottom: 0.5rem;\n}\n.text-center {\n    text-align: center;\n}\n.font-mono {\n    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;\n}\n.text-2xs {\n    font-size: 0.8rem;\n}\n.text-xs {\n    font-size: 0.85rem;\n}\n.text-base {\n    font-size: 1rem;\n    line-height: 1.5rem;\n}\n.text-\\[15px\\] {\n    font-size: 15px;\n}\n.leading-tight {\n    line-height: 1.25;\n}\n.text-denim-400 {\n    --tw-text-opacity: 1;\n    color: rgb(106 115 128 / var(--tw-text-opacity));\n}\n.text-gray-100 {\n    --tw-text-opacity: 1;\n    color: rgb(240 240 240 / var(--tw-text-opacity));\n}\n.text-black-900 {\n    --tw-text-opacity: 1;\n    color: rgb(20 20 20 / var(--tw-text-opacity));\n}\n.text-denim-700 {\n    --tw-text-opacity: 1;\n    color: rgb(60 74 93 / var(--tw-text-opacity));\n}\n.text-red-400 {\n    --tw-text-opacity: 1;\n    color: rgb(252 79 96 / var(--tw-text-opacity));\n}\n.opacity-25 {\n    opacity: 0.25;\n}\n.opacity-75 {\n    opacity: 0.75;\n}\n.outline-none {\n    outline: 2px solid transparent;\n    outline-offset: 2px;\n}\n.blur {\n    --tw-blur: blur(8px);\n    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.filter {\n    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n*, ::before, ::after {\n    border-width: 0;\n    border-style: solid;\n    border-color: #E9E9E9;\n    --tw-translate-x: 0;\n    --tw-translate-y: 0;\n    --tw-rotate: 0;\n    --tw-skew-x: 0;\n    --tw-skew-y: 0;\n    --tw-scale-x: 1;\n    --tw-scale-y: 1;\n    --tw-pan-x:  ;\n    --tw-pan-y:  ;\n    --tw-pinch-zoom:  ;\n    --tw-scroll-snap-strictness: proximity;\n    --tw-ordinal:  ;\n    --tw-slashed-zero:  ;\n    --tw-numeric-figure:  ;\n    --tw-numeric-spacing:  ;\n    --tw-numeric-fraction:  ;\n    --tw-ring-inset:  ;\n    --tw-ring-offset-width: 0px;\n    --tw-ring-offset-color: #fff;\n    --tw-ring-color: rgb(59 130 246 / 0.5);\n    --tw-ring-offset-shadow: 0 0 #0000;\n    --tw-ring-shadow: 0 0 #0000;\n    --tw-shadow: 0 0 #0000;\n    --tw-shadow-colored: 0 0 #0000;\n    --tw-blur:  ;\n    --tw-brightness:  ;\n    --tw-contrast:  ;\n    --tw-grayscale:  ;\n    --tw-hue-rotate:  ;\n    --tw-invert:  ;\n    --tw-saturate:  ;\n    --tw-sepia:  ;\n    --tw-drop-shadow:  ;\n    --tw-backdrop-blur:  ;\n    --tw-backdrop-brightness:  ;\n    --tw-backdrop-contrast:  ;\n    --tw-backdrop-grayscale:  ;\n    --tw-backdrop-hue-rotate:  ;\n    --tw-backdrop-invert:  ;\n    --tw-backdrop-opacity:  ;\n    --tw-backdrop-saturate:  ;\n    --tw-backdrop-sepia:  ;\n  }\n/* Something sets the `vertical-align` rule to `middle` for SVG which messes up with Ant Design\'s icons. */\nsvg {\n  vertical-align: baseline;\n}\n/* `:after` and `:before` pseudo-elements can\'t be set via Tailwind. */\nlabel.required:after {\n    padding-left: 0.25rem;\n  content: "*";\n}\n.placeholder\\:text-denim-400::-moz-placeholder {\n    --tw-text-opacity: 1;\n    color: rgb(106 115 128 / var(--tw-text-opacity));\n}\n.placeholder\\:text-denim-400:-ms-input-placeholder {\n    --tw-text-opacity: 1;\n    color: rgb(106 115 128 / var(--tw-text-opacity));\n}\n.placeholder\\:text-denim-400::placeholder {\n    --tw-text-opacity: 1;\n    color: rgb(106 115 128 / var(--tw-text-opacity));\n}\n.hover\\:bg-gray-600:hover {\n    --tw-bg-opacity: 1;\n    background-color: rgb(187 187 187 / var(--tw-bg-opacity));\n}\n.hover\\:text-denim-700:hover {\n    --tw-text-opacity: 1;\n    color: rgb(60 74 93 / var(--tw-text-opacity));\n}\n.group:hover .group-hover\\:visible {\n    visibility: visible;\n}\n.group:hover .group-hover\\:text-denim-700 {\n    --tw-text-opacity: 1;\n    color: rgb(60 74 93 / var(--tw-text-opacity));\n}\n.dark .dark\\:border-black-600 {\n    --tw-border-opacity: 1;\n    border-color: rgb(54 54 54 / var(--tw-border-opacity));\n}\n.dark .dark\\:border-black-650 {\n    --tw-border-opacity: 1;\n    border-color: rgb(41 41 41 / var(--tw-border-opacity));\n}\n.dark .dark\\:bg-black-600 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(54 54 54 / var(--tw-bg-opacity));\n}\n.dark .dark\\:bg-black-650 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(41 41 41 / var(--tw-bg-opacity));\n}\n.dark .dark\\:bg-black-800 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(31 31 31 / var(--tw-bg-opacity));\n}\n.dark .dark\\:bg-gray-700 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(177 177 177 / var(--tw-bg-opacity));\n}\n.dark .dark\\:bg-black-900 {\n    --tw-bg-opacity: 1;\n    background-color: rgb(20 20 20 / var(--tw-bg-opacity));\n}\n.dark .dark\\:text-gray-200 {\n    --tw-text-opacity: 1;\n    color: rgb(233 233 233 / var(--tw-text-opacity));\n}\n.dark .dark\\:text-gray-100 {\n    --tw-text-opacity: 1;\n    color: rgb(240 240 240 / var(--tw-text-opacity));\n}\n.dark .dark\\:text-gray-700 {\n    --tw-text-opacity: 1;\n    color: rgb(177 177 177 / var(--tw-text-opacity));\n}\n.dark .dark\\:placeholder\\:text-gray-700::-moz-placeholder {\n    --tw-text-opacity: 1;\n    color: rgb(177 177 177 / var(--tw-text-opacity));\n}\n.dark .dark\\:placeholder\\:text-gray-700:-ms-input-placeholder {\n    --tw-text-opacity: 1;\n    color: rgb(177 177 177 / var(--tw-text-opacity));\n}\n.dark .dark\\:placeholder\\:text-gray-700::placeholder {\n    --tw-text-opacity: 1;\n    color: rgb(177 177 177 / var(--tw-text-opacity));\n}\n.dark .hover\\:dark\\:bg-black-700:hover {\n    --tw-bg-opacity: 1;\n    background-color: rgb(38 38 38 / var(--tw-bg-opacity));\n}\n.dark .hover\\:dark\\:bg-black-900:hover {\n    --tw-bg-opacity: 1;\n    background-color: rgb(20 20 20 / var(--tw-bg-opacity));\n}\n.dark .dark\\:hover\\:text-gray-200:hover {\n    --tw-text-opacity: 1;\n    color: rgb(233 233 233 / var(--tw-text-opacity));\n}\n.dark .group:hover .dark\\:group-hover\\:text-gray-200 {\n    --tw-text-opacity: 1;\n    color: rgb(233 233 233 / var(--tw-text-opacity));\n}\n@media (min-width: 640px) {.sm\\:max-h-\\[240px\\] {\n        max-height: 240px;\n    }\n}\n@media (min-width: 768px) {.md\\:max-h-\\[300px\\] {\n        max-height: 300px;\n    }\n}\n',{insertAt:"top"}),function(n){n[n.Primary=0]="Primary",n[n.Secondary=1]="Secondary",n[n.Error=2]="Error"}(J||(J={})),function(n){n[n.Small=0]="Small",n[n.Regular=1]="Regular",n[n.Medium=2]="Medium"}(_||(_={})),en.size=_,en.hierarchy=J,function(n){n[n.Horizontal=0]="Horizontal",n[n.Vertical=1]="Vertical"}(Q||(Q={})),function(n){n[n.Default=0]="Default",n[n.CodeEditor=1]="CodeEditor",n[n.SiderNav=2]="SiderNav"}(Z||(Z={})),rn.dir=Q,rn.variant=Z;var on={};function an(n,e){for(var t=0;t<e.length;t++)on[e[t]]=n}var cn=["true","false"],ln=["if","then","do","else","elif","while","until","for","in","esac","fi","fin","fil","done","exit","set","unset","export","function"],sn=["ab","awk","bash","beep","cat","cc","cd","chown","chmod","chroot","clear","cp","curl","cut","diff","echo","find","gawk","gcc","get","git","grep","hg","kill","killall","ln","ls","make","mkdir","openssl","mv","nc","nl","node","npm","ping","ps","restart","rm","rmdir","sed","service","sh","shopt","shred","source","sort","sleep","ssh","start","stop","su","sudo","svn","tee","telnet","top","touch","vi","vim","wall","wc","wget","who","write","yes","zsh"];function dn(n,e){if(n.eatSpace())return null;var t,r=n.sol(),o=n.next();if("\\"===o)return n.next(),null;if("'"===o||'"'===o||"`"===o)return e.tokens.unshift(pn(o,"`"===o?"quote":"string")),un(n,e);if("#"===o)return r&&n.eat("!")?(n.skipToEnd(),"meta"):(n.skipToEnd(),"comment");if("$"===o)return e.tokens.unshift(gn),un(n,e);if("+"===o||"="===o)return"operator";if("-"===o)return n.eat("-"),n.eatWhile(/\w/),"attribute";if("<"==o){if(n.match("<<"))return"operator";var a=n.match(/^<-?\s*['"]?([^'"]*)['"]?/);if(a)return e.tokens.unshift((t=a[1],function(n,e){return n.sol()&&n.string==t&&e.tokens.shift(),n.skipToEnd(),"string.special"})),"string.special"}if(/\d/.test(o)&&(n.eatWhile(/\d/),n.eol()||!/\w/.test(n.peek())))return"number";n.eatWhile(/[\w-]/);var i=n.current();return"="===n.peek()&&/\w+/.test(i)?"def":on.hasOwnProperty(i)?on[i]:null}function pn(n,e){var t="("==n?")":"{"==n?"}":n;return function(r,o){for(var a,i=!1;null!=(a=r.next());){if(a===t&&!i){o.tokens.shift();break}if("$"===a&&!i&&"'"!==n&&r.peek()!=t){i=!0,r.backUp(1),o.tokens.unshift(gn);break}if(!i&&n!==t&&a===n)return o.tokens.unshift(pn(n,e)),un(r,o);if(!i&&/['"]/.test(a)&&!/['"]/.test(n)){o.tokens.unshift(bn(a,"string")),r.backUp(1);break}i=!i&&"\\"===a}return e}}function bn(n,e){return function(t,r){return r.tokens[0]=pn(n,e),t.next(),un(t,r)}}an("atom",cn),an("keyword",ln),an("builtin",sn);var gn=function(n,e){e.tokens.length>1&&n.eat("$");var t=n.next();return/['"({]/.test(t)?(e.tokens[0]=pn(t,"("==t?"quote":"{"==t?"def":"string"),un(n,e)):(/\d/.test(t)||n.eatWhile(/\w/),e.tokens.shift(),"def")};function un(n,e){return(e.tokens[0]||dn)(n,e)}const hn={startState:function(){return{tokens:[]}},token:function(n,e){return un(n,e)},languageData:{autocomplete:cn.concat(ln,sn),closeBrackets:{brackets:["(","["