@opencode-ai/ui 0.0.0-beta-202606270323 → 0.0.0-dev-202606251214

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opencode-ai/ui",
-  "version": "0.0.0-beta-202606270323",
+  "version": "0.0.0-dev-202606251214",
   "type": "module",
   "license": "MIT",
   "repository": {
@@ -15,7 +15,6 @@
     "**/*.css"
   ],
   "files": [
-    "dist/**/*.d.ts",
     "src/**/*.ts",
     "src/**/*.tsx",
     "!src/**/*.test.ts",
@@ -34,71 +33,28 @@
   ],
   "exports": {
     "./package.json": "./package.json",
-    "./*": {
-      "types": "./dist/components/*.d.ts",
-      "import": "./src/components/*.tsx"
-    },
-    "./i18n/*": {
-      "types": "./dist/i18n/*.d.ts",
-      "import": "./src/i18n/*.ts"
-    },
-    "./hooks": {
-      "types": "./dist/hooks/index.d.ts",
-      "import": "./src/hooks/index.ts"
-    },
-    "./context": {
-      "types": "./dist/context/index.d.ts",
-      "import": "./src/context/index.ts"
-    },
-    "./context/*": {
-      "types": "./dist/context/*.d.ts",
-      "import": "./src/context/*.tsx"
-    },
-    "./storybook/scaffold": {
-      "types": "./dist/storybook/scaffold.d.ts",
-      "import": "./src/storybook/scaffold.tsx"
-    },
-    "./storybook/fixtures": {
-      "types": "./dist/storybook/fixtures.d.ts",
-      "import": "./src/storybook/fixtures.ts"
-    },
+    "./*": "./src/components/*.tsx",
+    "./i18n/*": "./src/i18n/*.ts",
+    "./hooks": "./src/hooks/index.ts",
+    "./context": "./src/context/index.ts",
+    "./context/*": "./src/context/*.tsx",
+    "./storybook/scaffold": "./src/storybook/scaffold.tsx",
+    "./storybook/fixtures": "./src/storybook/fixtures.ts",
     "./styles": "./src/styles/index.css",
     "./styles/tailwind": "./src/styles/tailwind/index.css",
-    "./theme": {
-      "types": "./dist/theme/index.d.ts",
-      "import": "./src/theme/index.ts"
-    },
-    "./theme/*": {
-      "types": "./dist/theme/*.d.ts",
-      "import": "./src/theme/*.ts"
-    },
-    "./theme/context": {
-      "types": "./dist/theme/context.d.ts",
-      "import": "./src/theme/context.tsx"
-    },
-    "./icons/provider": {
-      "types": "./dist/components/provider-icons/types.d.ts",
-      "import": "./src/components/provider-icons/types.ts"
-    },
-    "./icons/file-type": {
-      "types": "./dist/components/file-icons/types.d.ts",
-      "import": "./src/components/file-icons/types.ts"
-    },
-    "./icons/app": {
-      "types": "./dist/components/app-icons/types.d.ts",
-      "import": "./src/components/app-icons/types.ts"
-    },
+    "./theme": "./src/theme/index.ts",
+    "./theme/*": "./src/theme/*.ts",
+    "./theme/context": "./src/theme/context.tsx",
+    "./icons/provider": "./src/components/provider-icons/types.ts",
+    "./icons/file-type": "./src/components/file-icons/types.ts",
+    "./icons/app": "./src/components/app-icons/types.ts",
     "./fonts/*": "./src/assets/fonts/*",
     "./audio/*": "./src/assets/audio/*",
     "./v2/*.css": "./src/v2/components/*.css",
-    "./v2/*": {
-      "types": "./dist/v2/components/*.d.ts",
-      "import": "./src/v2/components/*.tsx"
-    },
+    "./v2/*": "./src/v2/components/*.tsx",
     "./v2/styles/*": "./src/v2/styles/*"
   },
   "scripts": {
-    "build": "rm -rf dist && tsc -p tsconfig.build.json",
     "typecheck": "tsgo --noEmit",
     "test": "bun test src --only-failures",
     "dev": "vite",
@@ -106,16 +62,15 @@
     "generate:v2-oc2": "bun run script/build-oc2-v2-overrides.ts"
   },
   "devDependencies": {
-    "@solidjs/meta": "0.29.4",
     "@tailwindcss/vite": "4.1.11",
     "@tsconfig/node22": "22.0.2",
     "@types/bun": "1.3.13",
     "@types/katex": "0.16.7",
     "@types/luxon": "3.7.1",
     "@typescript/native-preview": "7.0.0-dev.20251207.1",
+    "@solidjs/meta": "0.29.4",
     "solid-js": "1.9.10",
     "tailwindcss": "4.1.11",
-    "tw-animate-css": "1.4.0",
     "typescript": "5.8.2",
     "vite": "7.1.4",
     "vite-plugin-icons-spritesheet": "3.0.1",

package/src/components/accordion.css

@@ -35,12 +35,12 @@
         cursor: default;
         user-select: none;
 
-        background-color: var(--v2-background-bg-base);
-        border: 0.5px solid var(--v2-border-border-base);
+        background-color: var(--background-stronger);
+        border: 1px solid var(--border-weak-base);
         border-radius: 0;
         box-shadow: none;
         overflow: clip;
-        color: var(--v2-text-text-base);
+        color: var(--text-strong);
         transition: background-color 0.15s ease;
 
         /* text-12-regular */
@@ -52,10 +52,10 @@
         letter-spacing: var(--letter-spacing-normal);
 
         &:hover:not([data-disabled]) {
-          background-color: var(--v2-overlay-simple-overlay-hover);
+          background-color: var(--surface-base-hover);
         }
         &:active:not([data-disabled]) {
-          background-color: var(--v2-overlay-simple-overlay-pressed);
+          background-color: var(--surface-base-active);
         }
         &:focus-visible {
           outline: none;
@@ -82,9 +82,9 @@
 
     &[data-expanded] {
       [data-slot="accordion-content"] {
-        border: 0.5px solid var(--v2-border-border-base);
+        border: 1px solid var(--border-weak-base);
         border-top: 0;
-        background-color: var(--v2-background-bg-layer-01);
+        background-color: var(--background-stronger);
       }
     }
 
@@ -104,30 +104,6 @@
   }
 }
 
-body:not([data-new-layout]) [data-component="accordion"] {
-  [data-slot="accordion-item"] [data-slot="accordion-header"] [data-slot="accordion-trigger"] {
-    background-color: var(--background-stronger);
-    border-width: 1px;
-    border-color: var(--border-weak-base);
-    color: var(--text-strong);
-
-    &:hover:not([data-disabled]) {
-      background-color: var(--surface-base-hover);
-    }
-
-    &:active:not([data-disabled]) {
-      background-color: var(--surface-base-active);
-    }
-  }
-
-  [data-slot="accordion-item"][data-expanded] [data-slot="accordion-content"] {
-    border-width: 1px;
-    border-color: var(--border-weak-base);
-    border-top: 0;
-    background-color: var(--background-stronger);
-  }
-}
-
 @keyframes slideDown {
   from {
     height: 0;

package/src/components/card.css

@@ -19,14 +19,14 @@
   font-weight: var(--font-weight-regular);
   line-height: var(--line-height-large);
   letter-spacing: var(--letter-spacing-normal);
-  color: var(--v2-text-text-base);
+  color: var(--text-strong);
 
   --card-gap: 8px;
   --card-icon: 16px;
   --card-indent: 0px;
   --card-line-pad: 8px;
 
-  --card-accent: var(--v2-icon-icon-base);
+  --card-accent: var(--icon-active);
 
   &:has([data-slot="card-title"]) {
     gap: 8px;
@@ -48,7 +48,7 @@
   }
 
   :where([data-card="title"], [data-slot="card-title"]) {
-    color: var(--v2-text-text-base);
+    color: var(--text-strong);
     font-weight: var(--font-weight-medium);
   }
 
@@ -72,7 +72,7 @@
   }
 
   :where([data-slot="card-title-icon"][data-placeholder]) [data-component="icon"] {
-    color: var(--v2-text-text-faint);
+    color: var(--text-weak);
   }
 
   :where([data-slot="card-title-icon"])
@@ -82,7 +82,7 @@
   }
 
   :where([data-card="description"], [data-slot="card-description"]) {
-    color: var(--v2-text-text-muted);
+    color: var(--text-base);
     white-space: pre-wrap;
     overflow-wrap: anywhere;
     word-break: break-word;
@@ -92,24 +92,3 @@
     padding-left: var(--card-indent);
   }
 }
-
-body:not([data-new-layout]) [data-component="card"] {
-  color: var(--text-strong);
-  --card-accent: var(--icon-active);
-
-  :where([data-card="title"], [data-slot="card-title"]) {
-    color: var(--text-strong);
-  }
-
-  :where([data-slot="card-title-icon"][data-placeholder]) [data-component="icon"] {
-    color: var(--text-weak);
-  }
-
-  :where([data-card="description"], [data-slot="card-description"]) {
-    color: var(--text-base);
-  }
-
-  &[data-variant="error"] {
-    --card-accent: var(--icon-critical-base) !important;
-  }
-}

package/src/components/card.tsx

@@ -40,7 +40,7 @@ export function Card(props: CardProps) {
   const variant = () => split.variant ?? "normal"
   const accent = () => {
     const v = variant()
-    if (v === "error") return "var(--v2-state-fg-danger)"
+    if (v === "error") return "var(--icon-critical-base)"
     if (v === "warning") return "var(--icon-warning-active)"
     if (v === "success") return "var(--icon-success-active)"
     if (v === "info") return "var(--icon-info-active)"

package/src/styles/tailwind/colors.css

@@ -249,7 +249,6 @@
   --color-v2-text-text-contrast: var(--v2-text-text-contrast);
   --color-v2-text-text-accent: var(--v2-text-text-accent);
   --color-v2-text-text-accent-hover: var(--v2-text-text-accent-hover);
-  --color-v2-text-text-code-accent: var(--v2-text-text-code-accent);
   --color-v2-icon-icon-base: var(--v2-icon-icon-base);
   --color-v2-icon-icon-muted: var(--v2-icon-icon-muted);
   --color-v2-icon-icon-inverse: var(--v2-icon-icon-inverse);

package/src/theme/themes/oc-2.json

@@ -20,8 +20,6 @@
       "text-base": "#6F6F6F",
       "text-weak": "#8F8F8F",
       "text-weaker": "#C7C7C7",
-      "text-diff-add-base": "var(--v2-state-fg-success)",
-      "text-diff-delete-base": "var(--v2-state-fg-danger)",
       "border-weak-base": "#DBDBDB",
       "border-weaker-base": "#E8E8E8",
       "icon-base": "#8F8F8F",
@@ -33,14 +31,14 @@
       "surface-interactive-weak": "#F5FAFF",
       "icon-success-base": "#0ABE00",
       "surface-success-base": "#E6FFE5",
-      "syntax-comment": "var(--v2-text-text-muted)",
-      "syntax-keyword": "var(--v2-pink-800)",
-      "syntax-string": "var(--v2-green-800)",
-      "syntax-primitive": "var(--v2-pink-800)",
-      "syntax-property": "var(--v2-orange-800)",
-      "syntax-type": "var(--v2-purple-800)",
+      "syntax-comment": "#7a7a7a",
+      "syntax-keyword": "#a753ae",
+      "syntax-string": "#00ceb9",
+      "syntax-primitive": "#034cff",
+      "syntax-property": "#a753ae",
+      "syntax-type": "#8a6f00",
       "syntax-constant": "#007b80",
-      "syntax-critical": "var(--v2-red-800)",
+      "syntax-critical": "#ff8c00",
       "syntax-diff-delete": "#ff8c00",
       "syntax-diff-unknown": "#a753ae",
       "surface-critical-base": "#FFF2F0"
@@ -172,7 +170,6 @@
       "v2-text-text-contrast": "var(--v2-grey-50)",
       "v2-text-text-accent": "var(--v2-blue-600)",
       "v2-text-text-accent-hover": "var(--v2-blue-700)",
-      "v2-text-text-code-accent": "var(--v2-blue-900)",
       "v2-icon-icon-base": "var(--v2-grey-800)",
       "v2-icon-icon-muted": "var(--v2-grey-600)",
       "v2-icon-icon-inverse": "var(--v2-grey-50)",
@@ -255,8 +252,6 @@
       "text-base": "#A0A0A0",
       "text-weak": "#707070",
       "text-weaker": "#505050",
-      "text-diff-add-base": "var(--v2-state-fg-success)",
-      "text-diff-delete-base": "var(--v2-state-fg-danger)",
       "border-weak-base": "#282828",
       "border-weaker-base": "#232323",
       "icon-base": "#7E7E7E",
@@ -267,14 +262,14 @@
       "surface-base-hover": "#FFFFFF0D",
       "surface-interactive-weak": "#0D172B",
       "surface-success-base": "#022B00",
-      "syntax-comment": "var(--v2-text-text-muted)",
-      "syntax-keyword": "var(--v2-pink-400)",
-      "syntax-string": "var(--v2-green-400)",
-      "syntax-primitive": "var(--v2-pink-400)",
-      "syntax-property": "var(--v2-orange-400)",
-      "syntax-type": "var(--v2-purple-400)",
+      "syntax-comment": "#8f8f8f",
+      "syntax-keyword": "#edb2f1",
+      "syntax-string": "#00ceb9",
+      "syntax-primitive": "#8cb0ff",
+      "syntax-property": "#fab283",
+      "syntax-type": "#fcd53a",
       "syntax-constant": "#93e9f6",
-      "syntax-critical": "var(--v2-red-400)",
+      "syntax-critical": "#fab283",
       "syntax-diff-delete": "#fab283",
       "syntax-diff-unknown": "#edb2f1",
       "surface-critical-base": "#1F0603"
@@ -406,7 +401,6 @@
       "v2-text-text-contrast": "var(--v2-grey-50)",
       "v2-text-text-accent": "var(--v2-blue-400)",
       "v2-text-text-accent-hover": "var(--v2-blue-300)",
-      "v2-text-text-code-accent": "var(--v2-blue-400)",
       "v2-icon-icon-base": "var(--v2-grey-400)",
       "v2-icon-icon-muted": "var(--v2-grey-600)",
       "v2-icon-icon-inverse": "var(--v2-grey-1100)",

package/src/theme/v2/mapping.ts

@@ -18,7 +18,6 @@ const light: Record<string, V2ColorValue> = {
   "v2-text-text-contrast": ref("v2-grey-100"),
   "v2-text-text-accent": ref("v2-blue-600"),
   "v2-text-text-accent-hover": ref("v2-blue-700"),
-  "v2-text-text-code-accent": ref("v2-blue-900"),
   "v2-border-border-muted": ref("v2-alpha-dark-8"),
   "v2-border-border-base": ref("v2-alpha-dark-10"),
   "v2-border-border-strong": ref("v2-alpha-dark-20"),
@@ -82,7 +81,6 @@ const dark: Record<string, V2ColorValue> = {
   "v2-text-text-contrast": ref("v2-grey-100"),
   "v2-text-text-accent": ref("v2-blue-400"),
   "v2-text-text-accent-hover": ref("v2-blue-300"),
-  "v2-text-text-code-accent": ref("v2-blue-400"),
   "v2-border-border-muted": ref("v2-alpha-light-8"),
   "v2-border-border-base": ref("v2-alpha-light-10"),
   "v2-border-border-strong": ref("v2-alpha-light-20"),

package/src/v2/components/button-v2.css

@@ -89,30 +89,6 @@
   cursor: not-allowed;
 }
 
-/* Danger */
-[data-component="button-v2"][data-variant="danger"] {
-  background-color: var(--v2-background-bg-button-neutral);
-  color: var(--v2-state-fg-danger);
-  box-shadow: var(--v2-elevation-button-neutral);
-}
-
-[data-component="button-v2"][data-variant="danger"]:is(:hover, [data-state="hover"]):not(:disabled) {
-  background-image:
-    linear-gradient(90deg, var(--v2-overlay-simple-overlay-hover) 0%, var(--v2-overlay-simple-overlay-hover) 100%),
-    linear-gradient(90deg, var(--v2-background-bg-button-neutral) 0%, var(--v2-background-bg-button-neutral) 100%);
-}
-
-[data-component="button-v2"][data-variant="danger"]:is(:active, [data-state="pressed"]):not(:disabled) {
-  background-image:
-    linear-gradient(90deg, var(--v2-overlay-simple-overlay-pressed) 0%, var(--v2-overlay-simple-overlay-pressed) 100%),
-    linear-gradient(90deg, var(--v2-background-bg-button-neutral) 0%, var(--v2-background-bg-button-neutral) 100%);
-}
-
-[data-component="button-v2"][data-variant="danger"]:is(:disabled, [data-state="disabled"]) {
-  opacity: 0.5;
-  cursor: not-allowed;
-}
-
 /* Contrast */
 [data-component="button-v2"][data-variant="contrast"] {
   background-image:

package/src/v2/components/button-v2.tsx

@@ -7,7 +7,7 @@ export interface ButtonV2Props
   extends ComponentProps<typeof Kobalte>,
     Pick<ComponentProps<"button">, "class" | "classList" | "children"> {
   size?: "small" | "normal" | "large"
-  variant?: "neutral" | "danger" | "contrast" | "ghost" | "ghost-muted"
+  variant?: "neutral" | "contrast" | "ghost" | "ghost-muted"
   icon?: IconProps["name"]
 }
 

package/src/v2/components/dialog-v2.css

@@ -49,51 +49,34 @@
         display: flex;
         flex-direction: row;
         align-items: flex-start;
-        align-self: stretch;
-        width: 100%;
-        gap: 0;
         padding: 16px;
+        gap: 8px;
         flex-shrink: 0;
-
-        [data-slot="dialog-header-title"] {
-          margin: 0;
-          flex: 1;
-          min-width: 0;
-          font-weight: 530;
-          font-size: 13px;
-          line-height: 16px;
-          letter-spacing: -0.04px;
-          color: var(--v2-text-text-base);
-          font-variation-settings: "slnt" 0;
-        }
+        align-self: stretch;
 
         [data-slot="dialog-title-group"] {
           display: flex;
           flex-direction: column;
           align-items: flex-start;
-          gap: 4px;
+          gap: 8px;
           flex: 1;
           min-width: 0;
         }
 
         [data-slot="dialog-title"] {
           margin: 0;
-          flex: none;
-          flex-grow: 0;
           font-weight: 530;
           font-size: 15px;
-          line-height: 20px;
+          line-height: 100%;
           letter-spacing: -0.13px;
           color: var(--v2-text-text-base);
           font-variation-settings: "slnt" 0;
         }
 
         [data-slot="dialog-description"] {
-          flex: none;
-          flex-grow: 0;
           font-weight: 440;
           font-size: 13px;
-          line-height: 20px;
+          line-height: 100%;
           letter-spacing: -0.04px;
           color: var(--v2-text-text-muted);
           font-variation-settings: "slnt" 0;
@@ -103,11 +86,8 @@
           display: flex;
           justify-content: center;
           align-items: center;
-          width: 20px;
-          height: 20px;
-          margin-top: -2px;
-          margin-right: -2px;
-          margin-left: auto;
+          width: 24px;
+          height: 24px;
           border-radius: 4px;
           flex-shrink: 0;
           cursor: pointer;
@@ -117,10 +97,6 @@
             background: var(--v2-overlay-simple-overlay-hover);
           }
         }
-
-        &[data-hide-close] [data-slot="dialog-close-button"] {
-          display: none;
-        }
       }
 
       [data-slot="dialog-footer"] {

package/src/v2/components/dialog-v2.tsx

@@ -3,6 +3,9 @@ import { type ComponentProps, type JSXElement, type ParentProps, Show, children,
 import "./dialog-v2.css"
 
 export interface DialogProps extends ParentProps {
+  title?: JSXElement
+  description?: JSXElement
+  action?: JSXElement
   size?: "normal" | "large" | "x-large"
   variant?: "default" | "settings"
   class?: ComponentProps<"div">["class"]
@@ -10,76 +13,26 @@ export interface DialogProps extends ParentProps {
   fit?: boolean
 }
 
-export interface DialogHeaderProps extends ParentProps {
-  closeLabel?: string
-  hideClose?: boolean
-}
-
-export interface DialogTitleGroupProps {
-  title?: JSXElement
-  description: JSXElement
-}
-
 export function DialogFooter(props: ParentProps) {
   return <div data-slot="dialog-footer">{props.children}</div>
 }
 
-export function DialogBody(props: ParentProps & { class?: ComponentProps<"div">["class"] }) {
-  const [local] = splitProps(props, ["class", "children"])
-  return (
-    <div data-slot="dialog-body" class={local.class}>
-      {local.children}
-    </div>
-  )
-}
-
-export function DialogTitle(props: ParentProps) {
-  return <Kobalte.Title data-slot="dialog-header-title">{props.children}</Kobalte.Title>
-}
-
-export function DialogTitleGroup(props: DialogTitleGroupProps) {
-  const title = children(() => props.title)
-  const description = children(() => props.description)
-
-  return (
-    <div data-slot="dialog-title-group">
-      <Show when={title()}>{(t) => <Kobalte.Title data-slot="dialog-title">{t()}</Kobalte.Title>}</Show>
-      <Kobalte.Description data-slot="dialog-description">{description()}</Kobalte.Description>
-    </div>
-  )
-}
-
-export function DialogHeader(props: DialogHeaderProps) {
-  const [local] = splitProps(props, ["closeLabel", "hideClose", "children"])
-  const hideClose = () => local.hideClose === true
-
-  return (
-    <div data-slot="dialog-header" data-hide-close={hideClose() ? "" : undefined}>
-      {local.children}
-      {!hideClose() && (
-        <Kobalte.CloseButton data-slot="dialog-close-button" aria-label={local.closeLabel ?? "Close"}>
-          <svg
-            width="16"
-            height="16"
-            viewBox="0 0 16 16"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-            aria-hidden="true"
-          >
-            <path
-              d="M12.4446 3.55469L3.55566 12.4436M3.55566 3.55469L12.4446 12.4436"
-              stroke="currentColor"
-              stroke-linejoin="round"
-            />
-          </svg>
-        </Kobalte.CloseButton>
-      )}
-    </div>
-  )
-}
-
 export function Dialog(props: DialogProps) {
-  const [local] = splitProps(props, ["size", "variant", "class", "classList", "fit", "children"])
+  const [local] = splitProps(props, [
+    "title",
+    "description",
+    "action",
+    "size",
+    "variant",
+    "class",
+    "classList",
+    "fit",
+    "children",
+  ])
+  const title = children(() => local.title)
+  const description = children(() => local.description)
+  const action = children(() => local.action)
+  const hasHeader = () => title() || action()
 
   return (
     <div
@@ -91,6 +44,7 @@ export function Dialog(props: DialogProps) {
       <div data-slot="dialog-container">
         <Kobalte.Content
           data-slot="dialog-content"
+          data-no-header={!hasHeader() ? "" : undefined}
           classList={{
             ...local.classList,
             [local.class ?? ""]: !!local.class,
@@ -104,7 +58,34 @@ export function Dialog(props: DialogProps) {
             }
           }}
         >
-          {local.children}
+          <Show when={hasHeader()}>
+            <div data-slot="dialog-header">
+              <div data-slot="dialog-title-group">
+                <Show when={title()}>{(t) => <Kobalte.Title data-slot="dialog-title">{t()}</Kobalte.Title>}</Show>
+                <Show when={description()}>
+                  {(d) => <Kobalte.Description data-slot="dialog-description">{d()}</Kobalte.Description>}
+                </Show>
+              </div>
+              <Show when={action()}>{(a) => a()}</Show>
+              <Kobalte.CloseButton data-slot="dialog-close-button" aria-label="Close">
+                <svg
+                  width="16"
+                  height="16"
+                  viewBox="0 0 16 16"
+                  fill="none"
+                  xmlns="http://www.w3.org/2000/svg"
+                  aria-hidden="true"
+                >
+                  <path
+                    d="M12.4446 3.55469L3.55566 12.4436M3.55566 3.55469L12.4446 12.4436"
+                    stroke="currentColor"
+                    stroke-linejoin="round"
+                  />
+                </svg>
+              </Kobalte.CloseButton>
+            </div>
+          </Show>
+          <div data-slot="dialog-body">{local.children}</div>
         </Kobalte.Content>
       </div>
     </div>

package/src/v2/components/icon.tsx

@@ -49,26 +49,6 @@ const icons = {
     viewBox: "0 0 16 16",
     body: `<path d="M5 6.5L8 9.5L11 6.5" stroke="currentColor"/>`,
   },
-  check: {
-    viewBox: "0 0 16 16",
-    body: `<path d="M3.53613 8.17857L6.39328 11.75L12.4647 4.25" stroke="currentColor"/>`,
-  },
-  monitor: {
-    viewBox: "0 0 16 16",
-    body: `<path d="M4.05559 9.38889H0.500007C0.500007 9.38889 0.500017 8.59298 0.500017 7.61112V2.27778C0.500017 1.29594 0.500102 0.5 0.500102 0.5H13.3889C13.3889 0.5 13.3889 1.29594 13.3889 2.27778V7.61112C13.3889 8.59298 13.3889 9.38889 13.3889 9.38889H9.83336M4.05559 9.38889V11.6111H6.94448H9.83336V9.38889M4.05559 9.38889H9.83336" transform="translate(1.05556 1.94444)" stroke="currentColor"/>`,
-  },
-  "workspace-new": {
-    viewBox: "0 0 16 16",
-    body: `<path d="M2 10.7578V14.0011H5.24324M13.9991 5.24324V2H10.7559M13.9991 10.7578V14.0011H10.7559M2 5.24324V2H5.24324" stroke="currentColor" stroke-miterlimit="10" stroke-linecap="square"/><path d="M8 4.5V11.5M4.5 8H11.5" stroke="currentColor" stroke-linejoin="round"/>`,
-  },
-  "workspace-isolated": {
-    viewBox: "0 0 16 16",
-    body: `<path d="M10.5 10.5V5.5H5.5V10.5H10.5Z" fill="currentColor"/><rect x="2.5" y="2.5" width="11" height="11" stroke="currentColor"/>`,
-  },
-  workspace: {
-    viewBox: "0 0 16 16",
-    body: `<path d="M2 10.668V14.0013H10.6667M13.9974 10.6667V2H2.66406M13.9974 10.668V14.0013H10.6641M2 10V2H5.33333" stroke="currentColor" stroke-miterlimit="10" stroke-linecap="square"/><path d="M10.6693 10.6654V5.33203H5.33594V10.6654H10.6693Z" fill="currentColor"/>`,
-  },
   close: {
     viewBox: "0 0 20 20",
     body: `<path d="M14.4446 5.55566L5.55566 14.4446M5.55566 5.55566L14.4446 14.4446" stroke="currentColor" stroke-linejoin="round"/>`,