@lobb-js/studio 0.1.31 → 0.1.33

package/package.json

@@ -1,18 +1,24 @@
 {
   "name": "@lobb-js/studio",
-  "version": "0.1.31",
+  "version": "0.1.33",
   "type": "module",
   "publishConfig": {
     "access": "public"
   },
+  "files": [
+    "src/lib/components",
+    "vite-plugins"
+  ],
   "exports": {
-    ".": "./src/Studio.svelte",
-    "./vite-plugin": "./vite-plugin-contextual-lib.js",
+    ".": "./src/lib/components/Studio.svelte",
+    "./*": "./src/lib/components/*",
+    "./vite-plugins": "./vite-plugins/index.js",
     "./components": "./src/components-export.ts"
   },
   "scripts": {
     "dev": "vite",
     "build": "rm -rf dist && vite build --config vite.build.svelte.config.ts && vite build",
+    "package": "svelte-package --input src/lib/components",
     "preview": "vite preview",
     "check": "svelte-check --tsconfig ./tsconfig.app.json && tsc -p tsconfig.node.json",
     "build_extension": "vite build --config vite.extension.config.ts",
@@ -23,12 +29,12 @@
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^4.1.2",
-    "@lucide/svelte": "^0.563.1",
     "@storybook/addon-a11y": "^10.0.1",
     "@storybook/addon-docs": "^10.0.1",
     "@storybook/addon-svelte-csf": "^5.0.10",
     "@storybook/addon-vitest": "^10.0.1",
     "@storybook/svelte-vite": "^10.0.1",
+    "@sveltejs/package": "^2.5.7",
     "@sveltejs/vite-plugin-svelte": "6.2.1",
     "@tsconfig/svelte": "^5.0.4",
     "@types/lodash": "^4.17.17",
@@ -39,22 +45,14 @@
     "@vitest/browser-playwright": "^4.0.5",
     "@vitest/coverage-v8": "^4.0.5",
     "autoprefixer": "^10.4.20",
-    "bits-ui": "^1.6.0",
     "browser-fs-access": "^0.35.0",
-    "clsx": "^2.1.1",
     "dts-bundle-generator": "^9.5.1",
-    "lucide-svelte": "^0.488.0",
-    "mode-watcher": "^0.5.1",
-    "monaco-editor": "^0.52.2",
     "playwright": "^1.56.1",
-    "qs": "^6.14.0",
+    "qs": "^6.14.1",
     "sortablejs": "^1.15.6",
     "storybook": "^10.0.1",
     "svelte": "5.39.8",
     "svelte-check": "^4.1.4",
-    "svelte-sonner": "^0.3.28",
-    "tailwind-merge": "^3.4.0",
-    "tailwind-variants": "^3.2.2",
     "tailwindcss": "^4.1.18",
     "tailwindcss-animate": "^1.0.7",
     "tw-animate-css": "^1.4.0",
@@ -63,15 +61,27 @@
     "vite-plugin-css-injected-by-js": "^3.5.2",
     "vitest": "^4.0.5"
   },
+  "peerDependencies": {
+    "svelte": "^5.0.0"
+  },
   "dependencies": {
     "@andrewbranch/untar.js": "^1.0.3",
     "@dagrejs/dagre": "^1.1.5",
+    "@lucide/svelte": "^0.563.1",
     "@tailwindcss/vite": "^4.1.18",
     "@wjfe/n-savant": "^0.3.0",
     "@xyflow/svelte": "^1.2.0",
+    "bits-ui": "^1.8.0",
+    "clsx": "^2.1.1",
     "fflate": "^0.8.2",
     "json-stable-stringify": "^1.3.0",
     "lodash": "^4.17.21",
-    "mustache": "^4.2.0"
+    "lucide-svelte": "^0.488.0",
+    "mode-watcher": "^0.5.1",
+    "monaco-editor": "^0.52.2",
+    "mustache": "^4.2.0",
+    "svelte-sonner": "^0.3.28",
+    "tailwind-merge": "^3.4.0",
+    "tailwind-variants": "^3.2.2"
   }
 }

package/src/{Studio.svelte → lib/components/Studio.svelte}

@@ -1,9 +1,9 @@
 <script lang="ts">
-    import { Toaster } from "./lib/components/ui/sonner";
+    import { Toaster } from "$lib/components/ui/sonner";
     import { onMount, onDestroy } from "svelte";
     import { ModeWatcher } from "mode-watcher";
     import { ctx } from "$lib/store.svelte";
-    import { lobb } from "$lib/index";
+    import { lobb } from "$lib";
     import Header from "$lib/components/header.svelte";
     import { LoaderCircle, ServerOff } from "lucide-svelte";
     import Dialog from "$lib/components/confirmationDialog/confirmationDialog.svelte";
@@ -14,13 +14,13 @@
     import {
         executeExtensionsOnStartup,
         loadExtensions,
-    } from "./extensions/extensionUtils";
+    } from "$lib/extensions/extensionUtils";
     import { mediaQueries } from "$lib/utils";
-    import Home from "./routes/home.svelte";
-    import DataModel from "./routes/data_model/dataModel.svelte";
-    import Collections from "./routes/collections/collections.svelte";
-    import Workflows from "./routes/workflows/workflows.svelte";
-    import Extension from "./routes/extensions/extension.svelte";
+    import Home from "../../routes/home.svelte";
+    import DataModel from "../../routes/data_model/dataModel.svelte";
+    import Collections from "../../routes/collections/collections.svelte";
+    import Workflows from "../../routes/workflows/workflows.svelte";
+    import Extension from "../../routes/extensions/extension.svelte";
 
     interface StudioProps {
       extensions?: any[];

package/src/lib/components/dataTable/childRecords.svelte

@@ -4,7 +4,7 @@
     import DataTable from "./dataTable.svelte";
     import CreateDetailViewButton from "../detailView/create/createDetailViewButton.svelte";
     import ExtensionsComponents from "../extensionsComponents.svelte";
-    import { getExtensionUtils } from "../../../extensions/extensionUtils";
+    import { getExtensionUtils } from "$lib/extensions/extensionUtils";
 
     interface Props {
         collectionName: string;

package/src/lib/components/detailView/create/children.svelte

@@ -3,7 +3,7 @@
     import { Link } from "lucide-svelte";
     import CreateManyView from "./createManyView.svelte";
     import ExtensionsComponents from "$lib/components/extensionsComponents.svelte";
-    import { getExtensionUtils } from "../../../../extensions/extensionUtils";
+    import { getExtensionUtils } from "$lib/extensions/extensionUtils";
 
     interface LocalProp {
         collectionName: string;

package/src/lib/components/detailView/create/createDetailView.svelte

@@ -23,7 +23,7 @@
     import { toast } from "svelte-sonner";
     import { ctx } from "$lib/store.svelte";
     import ExtensionsComponents from "../../extensionsComponents.svelte";
-    import { getExtensionUtils } from "../../../../extensions/extensionUtils";
+    import { getExtensionUtils } from "$lib/extensions/extensionUtils";
     import { getField, getFieldIcon } from "../../dataTable/utils";
     import Children from "./children.svelte";
     import {

package/src/lib/components/detailView/fieldInput.svelte

@@ -14,7 +14,7 @@
 	import Textarea from "../ui/textarea/textarea.svelte";
 	import ForeingKeyInput from "../foreingKeyInput.svelte";
     import ExtensionsComponents from "../extensionsComponents.svelte";
-    import { getExtensionUtils } from "../../../extensions/extensionUtils";
+    import { getExtensionUtils } from "$lib/extensions/extensionUtils";
 
 	interface Props {
 		collectionName: string;

package/src/lib/components/detailView/update/children.svelte

@@ -4,7 +4,7 @@
     import { Link, Plus, TableIcon } from "lucide-svelte";
     import CreateDetailViewButton from "../create/createDetailViewButton.svelte";
     import ExtensionsComponents from "$lib/components/extensionsComponents.svelte";
-    import { getExtensionUtils } from "../../../../extensions/extensionUtils";
+    import { getExtensionUtils } from "$lib/extensions/extensionUtils";
 
     interface LocalProp {
         collectionName: string;

package/src/lib/components/detailView/update/updateDetailView.svelte

@@ -25,7 +25,7 @@
     import { toast } from "svelte-sonner";
     import { ctx } from "$lib/store.svelte";
     import ExtensionsComponents from "../../extensionsComponents.svelte";
-    import { getExtensionUtils } from "../../../../extensions/extensionUtils";
+    import { getExtensionUtils } from "$lib/extensions/extensionUtils";
     import { calculateDrawerWidth, getChangedProperties } from "$lib/utils";
     import { getField, getFieldIcon } from "../../dataTable/utils";
     import Children from "../update/children.svelte";

package/src/lib/components/extensionsComponents.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
     import type { Snippet } from "svelte";
-	import { loadExtensionComponents } from "../../extensions/extensionUtils";
+	import { loadExtensionComponents } from "$lib/extensions/extensionUtils";
 
 	interface Props {
 		name: string;
@@ -28,4 +28,3 @@
 {:else}
 	{@render children?.()}
 {/if}
-	

package/src/lib/components/miniSidebar.svelte

@@ -18,7 +18,7 @@
 	import * as Accordion from "$lib/components/ui/accordion/index.js";
 
 	import { ctx } from "$lib/store.svelte";
-	import { getDashboardNavs } from "../../extensions/extensionUtils";
+	import { getDashboardNavs } from "$lib/extensions/extensionUtils";
 	import { mediaQueries } from "$lib/utils";
 	import * as Popover from "./ui/popover";
 	import { location } from "@wjfe/n-savant";

package/{vite-plugin-contextual-lib.js → vite-plugins/contextual-lib-alias.js}

@@ -14,14 +14,12 @@ const __dirname = path.dirname(__filename);
  * This allows shadcn components to work in both the Studio package and consuming projects
  * without conflicts.
  *
- * @param {Object} options - Plugin options
- * @param {string} [options.studioLibPath] - The path to the studio's src/lib directory (used for external imports)
  * @returns {import('vite').Plugin}
  */
-export function contextualLibAlias(options = {}) {
+export function contextualLibAlias() {
   let projectRoot;
   let localLibPath;
-  let studioLibPath;
+  const studioLibPath = path.resolve(__dirname, "../src/lib");
 
   return {
     name: "contextual-lib-alias",
@@ -30,9 +28,6 @@ export function contextualLibAlias(options = {}) {
     configResolved(config) {
       projectRoot = config.root;
       localLibPath = path.resolve(projectRoot, "./src/lib");
-
-      // Use provided studioLibPath or default to this package's src/lib
-      studioLibPath = options.studioLibPath || path.resolve(__dirname, "./src/lib");
     },
 
     async resolveId(source, importer, options) {

package/vite-plugins/index.js

@@ -0,0 +1,21 @@
+import { contextualLibAlias } from "./contextual-lib-alias.js";
+import { studioSourceResolver } from "./studio-source-resolver.js";
+
+/**
+ * Returns an array of Vite plugins needed for Lobb Studio integration.
+ *
+ * Includes:
+ * - contextualLibAlias: Resolves $lib imports contextually
+ * - studioSourceResolver: Resolves @lobb-js/studio to source (monorepo) or dist (standalone)
+ *
+ * @returns {import('vite').Plugin[]}
+ */
+export function lobbStudioPlugins() {
+  return [
+    studioSourceResolver(),
+    contextualLibAlias(),
+  ];
+}
+
+// Also export individual plugins for advanced usage
+export { contextualLibAlias, studioSourceResolver };

package/vite-plugins/studio-source-resolver.js

@@ -0,0 +1,41 @@
+import path from "path";
+import fs from "fs";
+import { fileURLToPath } from "url";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+/**
+ * Vite plugin that resolves @lobb-js/studio imports contextually.
+ *
+ * - Inside monorepo: Resolve to source files (./src/Studio.svelte) for HMR
+ * - Outside monorepo (from node_modules): Resolve to built files (./dist/studio.js)
+ *
+ * This allows lobb-skeleton to work identically both inside and outside the monorepo
+ * without any code changes.
+ *
+ * @returns {import('vite').Plugin}
+ */
+export function studioSourceResolver() {
+  const studioSourcePath = path.resolve(__dirname, "../src/lib/Studio.svelte");
+  const studioPackagePath = path.resolve(__dirname, "..");
+
+  return {
+    name: "studio-source-resolver",
+    enforce: "pre",
+
+    async resolveId(source, importer, options) {
+      // Only handle @lobb-js/studio main import
+      if (source !== "@lobb-js/studio") return null;
+
+      // Check if we're in a monorepo context by looking for the source file
+      if (fs.existsSync(studioSourcePath)) {
+        // We're in monorepo - resolve to source for HMR
+        return this.resolve(studioSourcePath, importer, { skipSelf: true, ...options });
+      }
+
+      // Not in monorepo - let default resolution handle it (will use dist/ from node_modules)
+      return null;
+    }
+  };
+}

package/.env.example

@@ -1 +0,0 @@
-LOBB_URL=http://localhost:3000

package/.storybook/main.ts

@@ -1,31 +0,0 @@
-import type { StorybookConfig } from '@storybook/svelte-vite';
-
-import { dirname } from "path"
-
-import { fileURLToPath } from "url"
-
-/**
-* This function is used to resolve the absolute path of a package.
-* It is needed in projects that use Yarn PnP or are set up within a monorepo.
-*/
-function getAbsolutePath(value: string): any {
-  return dirname(fileURLToPath(import.meta.resolve(`${value}/package.json`)))
-}
-const config: StorybookConfig = {
-  "stories": [
-    "../src/**/*.mdx",
-    "../src/**/*.stories.@(js|ts|svelte)"
-  ],
-  "addons": [
-    getAbsolutePath('@storybook/addon-svelte-csf'),
-    getAbsolutePath('@chromatic-com/storybook'),
-    getAbsolutePath('@storybook/addon-docs'),
-    getAbsolutePath("@storybook/addon-a11y"),
-    getAbsolutePath("@storybook/addon-vitest")
-  ],
-  "framework": {
-    "name": getAbsolutePath('@storybook/svelte-vite'),
-    "options": {}
-  }
-};
-export default config;

package/.storybook/preview.ts

@@ -1,21 +0,0 @@
-import type { Preview } from '@storybook/svelte-vite'
-
-const preview: Preview = {
-  parameters: {
-    controls: {
-      matchers: {
-       color: /(background|color)$/i,
-       date: /Date$/i,
-      },
-    },
-
-    a11y: {
-      // 'todo' - show a11y violations in the test UI only
-      // 'error' - fail CI on a11y violations
-      // 'off' - skip a11y checks entirely
-      test: 'todo'
-    }
-  },
-};
-
-export default preview;

package/.storybook/vitest.setup.ts

@@ -1,7 +0,0 @@
-import * as a11yAddonAnnotations from "@storybook/addon-a11y/preview";
-import { setProjectAnnotations } from '@storybook/svelte-vite';
-import * as projectAnnotations from './preview';
-
-// This is an important step to apply the right configuration when testing your stories.
-// More info at: https://storybook.js.org/docs/api/portable-stories/portable-stories-vitest#setprojectannotations
-setProjectAnnotations([a11yAddonAnnotations, projectAnnotations]);

package/components.json

@@ -1,16 +0,0 @@
-{
-	"$schema": "https://shadcn-svelte.com/schema.json",
-	"tailwind": {
-		"css": "src/app.css",
-		"baseColor": "slate"
-	},
-	"aliases": {
-		"components": "$lib/components",
-		"utils": "$lib/utils",
-		"ui": "$lib/components/ui",
-		"hooks": "$lib/hooks",
-		"lib": "$lib"
-	},
-	"typescript": true,
-	"registry": "https://shadcn-svelte.com/registry"
-}

package/docker-entrypoint.sh

@@ -1,7 +0,0 @@
-#!/bin/sh
-
-# insert ENV to the html
-find /app/dist -name "*.html" -exec sed -i "s|%LOBB_URL%|${LOBB_URL}|g" {} +
-
-# Start the server
-exec sirv dist --single --port 3000 --host

package/dockerfile

@@ -1,27 +0,0 @@
-# Stage 1: Build
-FROM node:22-alpine AS builder
-
-WORKDIR /app
-
-COPY package*.json ./
-RUN npm install
-
-COPY . .
-RUN npm run build
-
-# Stage 2: Runtime
-FROM node:22-alpine
-
-WORKDIR /app
-
-RUN npm install -g sirv-cli
-
-# Copy only built output
-COPY --from=builder /app/dist ./dist
-
-COPY docker-entrypoint.sh /usr/local/bin/docker-entrypoint.sh
-RUN chmod +x /usr/local/bin/docker-entrypoint.sh
-
-EXPOSE 3000
-
-ENTRYPOINT ["sh", "/usr/local/bin/docker-entrypoint.sh"]

package/index.html

@@ -1,13 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/lobb.svg" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Lobb Studio</title>
-  </head>
-  <body>
-    <div id="app"></div>
-    <script type="module" src="/src/main.ts"></script>
-  </body>
-</html>

package/public/lobb.svg

@@ -1,15 +0,0 @@
-<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_2801_3)">
-<mask id="path-1-outside-1_2801_3" maskUnits="userSpaceOnUse" x="7" y="1" width="20" height="28" fill="black">
-<rect fill="white" x="7" y="1" width="20" height="28"/>
-<path d="M25.1389 23.874L24.416 28H11.8439L12.5669 23.874H25.1389ZM17.9977 2.32685L13.5367 28H8.37029L12.8137 2.32685H17.9977Z"/>
-</mask>
-<path d="M25.1389 23.874L24.416 28H11.8439L12.5669 23.874H25.1389ZM17.9977 2.32685L13.5367 28H8.37029L12.8137 2.32685H17.9977Z" fill="black"/>
-<path d="M25.1389 23.874L26.1239 24.0465L26.3294 22.874H25.1389V23.874ZM24.416 28V29H25.256L25.401 28.1726L24.416 28ZM11.8439 28L10.8589 27.8274L10.6535 29H11.8439V28ZM12.5669 23.874V22.874H11.7268L11.5819 23.7014L12.5669 23.874ZM17.9977 2.32685L18.983 2.49805L19.1865 1.32685H17.9977V2.32685ZM13.5367 28V29H14.3779L14.5219 28.1712L13.5367 28ZM8.37029 28L7.38494 27.8295L7.18234 29H8.37029V28ZM12.8137 2.32685V1.32685H11.9719L11.8284 2.15631L12.8137 2.32685ZM24.1539 23.7014L23.431 27.8274L25.401 28.1726L26.1239 24.0465L24.1539 23.7014ZM24.416 27H11.8439V29H24.416V27ZM12.8289 28.1726L13.5519 24.0465L11.5819 23.7014L10.8589 27.8274L12.8289 28.1726ZM12.5669 24.874H25.1389V22.874H12.5669V24.874ZM17.0125 2.15565L12.5514 27.8288L14.5219 28.1712L18.983 2.49805L17.0125 2.15565ZM13.5367 27H8.37029V29H13.5367V27ZM9.35564 28.1705L13.7991 2.49739L11.8284 2.15631L7.38494 27.8295L9.35564 28.1705ZM12.8137 3.32685H17.9977V1.32685H12.8137V3.32685Z" fill="white" mask="url(#path-1-outside-1_2801_3)"/>
-</g>
-<defs>
-<clipPath id="clip0_2801_3">
-<rect width="32" height="32" fill="white"/>
-</clipPath>
-</defs>
-</svg>

package/src/app.css

@@ -1,121 +0,0 @@
-@import "tailwindcss";
-
-@import "tw-animate-css";
-
-@custom-variant dark (&:is(.dark *));
-
-:root {
-  --radius: 0.625rem;
-  --background: oklch(1 0 0);
-  --foreground: oklch(0.129 0.042 264.695);
-  --card: oklch(1 0 0);
-  --card-foreground: oklch(0.129 0.042 264.695);
-  --popover: oklch(1 0 0);
-  --popover-foreground: oklch(0.129 0.042 264.695);
-  --primary: oklch(0.208 0.042 265.755);
-  --primary-foreground: oklch(0.984 0.003 247.858);
-  --secondary: oklch(0.968 0.007 247.896);
-  --secondary-foreground: oklch(0.208 0.042 265.755);
-  --muted: oklch(0.968 0.007 247.896);
-  --muted-foreground: oklch(0.554 0.046 257.417);
-  --accent: oklch(0.968 0.007 247.896);
-  --accent-foreground: oklch(0.208 0.042 265.755);
-  --destructive: oklch(0.577 0.245 27.325);
-  --border: oklch(0.929 0.013 255.508);
-  --input: oklch(0.929 0.013 255.508);
-  --ring: oklch(0.704 0.04 256.788);
-  --chart-1: oklch(0.646 0.222 41.116);
-  --chart-2: oklch(0.6 0.118 184.704);
-  --chart-3: oklch(0.398 0.07 227.392);
-  --chart-4: oklch(0.828 0.189 84.429);
-  --chart-5: oklch(0.769 0.188 70.08);
-  --sidebar: oklch(0.984 0.003 247.858);
-  --sidebar-foreground: oklch(0.129 0.042 264.695);
-  --sidebar-primary: oklch(0.208 0.042 265.755);
-  --sidebar-primary-foreground: oklch(0.984 0.003 247.858);
-  --sidebar-accent: oklch(0.968 0.007 247.896);
-  --sidebar-accent-foreground: oklch(0.208 0.042 265.755);
-  --sidebar-border: oklch(0.929 0.013 255.508);
-  --sidebar-ring: oklch(0.704 0.04 256.788);
-}
-
-.dark {
-  --background: oklch(0.129 0.042 264.695);
-  --foreground: oklch(0.984 0.003 247.858);
-  --card: oklch(0.208 0.042 265.755);
-  --card-foreground: oklch(0.984 0.003 247.858);
-  --popover: oklch(0.208 0.042 265.755);
-  --popover-foreground: oklch(0.984 0.003 247.858);
-  --primary: oklch(0.929 0.013 255.508);
-  --primary-foreground: oklch(0.208 0.042 265.755);
-  --secondary: oklch(0.279 0.041 260.031);
-  --secondary-foreground: oklch(0.984 0.003 247.858);
-  --muted: oklch(0.279 0.041 260.031);
-  --muted-foreground: oklch(0.704 0.04 256.788);
-  --accent: oklch(0.279 0.041 260.031);
-  --accent-foreground: oklch(0.984 0.003 247.858);
-  --destructive: oklch(0.704 0.191 22.216);
-  --border: oklch(1 0 0 / 10%);
-  --input: oklch(1 0 0 / 15%);
-  --ring: oklch(0.551 0.027 264.364);
-  --chart-1: oklch(0.488 0.243 264.376);
-  --chart-2: oklch(0.696 0.17 162.48);
-  --chart-3: oklch(0.769 0.188 70.08);
-  --chart-4: oklch(0.627 0.265 303.9);
-  --chart-5: oklch(0.645 0.246 16.439);
-  --sidebar: oklch(0.208 0.042 265.755);
-  --sidebar-foreground: oklch(0.984 0.003 247.858);
-  --sidebar-primary: oklch(0.488 0.243 264.376);
-  --sidebar-primary-foreground: oklch(0.984 0.003 247.858);
-  --sidebar-accent: oklch(0.279 0.041 260.031);
-  --sidebar-accent-foreground: oklch(0.984 0.003 247.858);
-  --sidebar-border: oklch(1 0 0 / 10%);
-  --sidebar-ring: oklch(0.551 0.027 264.364);
-}
-
-@theme inline {
-  --radius-sm: calc(var(--radius) - 4px);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-lg: var(--radius);
-  --radius-xl: calc(var(--radius) + 4px);
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --color-card: var(--card);
-  --color-card-foreground: var(--card-foreground);
-  --color-popover: var(--popover);
-  --color-popover-foreground: var(--popover-foreground);
-  --color-primary: var(--primary);
-  --color-primary-foreground: var(--primary-foreground);
-  --color-secondary: var(--secondary);
-  --color-secondary-foreground: var(--secondary-foreground);
-  --color-muted: var(--muted);
-  --color-muted-foreground: var(--muted-foreground);
-  --color-accent: var(--accent);
-  --color-accent-foreground: var(--accent-foreground);
-  --color-destructive: var(--destructive);
-  --color-border: var(--border);
-  --color-input: var(--input);
-  --color-ring: var(--ring);
-  --color-chart-1: var(--chart-1);
-  --color-chart-2: var(--chart-2);
-  --color-chart-3: var(--chart-3);
-  --color-chart-4: var(--chart-4);
-  --color-chart-5: var(--chart-5);
-  --color-sidebar: var(--sidebar);
-  --color-sidebar-foreground: var(--sidebar-foreground);
-  --color-sidebar-primary: var(--sidebar-primary);
-  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
-  --color-sidebar-accent: var(--sidebar-accent);
-  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
-  --color-sidebar-border: var(--sidebar-border);
-  --color-sidebar-ring: var(--sidebar-ring);
-}
-
-@layer base {
-  * {
-    @apply border-border outline-ring/50;
-  }
-  body {
-    @apply bg-background text-foreground;
-  }
-}

package/src/components-export.ts

@@ -1,21 +0,0 @@
-// Re-export all Studio components for use in extensions and consuming apps
-export { Button } from "$lib/components/ui/button";
-export { Input } from "$lib/components/ui/input";
-export { Separator } from "$lib/components/ui/separator";
-export { Skeleton } from "$lib/components/ui/skeleton";
-export { default as LlmButton } from "$lib/components/LlmButton.svelte";
-export { default as Sidebar } from "$lib/components/sidebar/sidebar.svelte";
-export { default as SidebarTrigger } from "$lib/components/sidebar/sidebarTrigger.svelte";
-export { default as CreateDetailViewButton } from "$lib/components/detailView/create/createDetailViewButton.svelte";
-export { default as UpdateDetailViewButton } from "$lib/components/detailView/update/updateDetailViewButton.svelte";
-export * as Tooltip from "$lib/components/ui/tooltip";
-export * as Breadcrumb from "$lib/components/ui/breadcrumb";
-export { ContextMenu } from "bits-ui";
-export * as Popover from "$lib/components/ui/popover";
-export * as Icons from "lucide-svelte";
-export { default as Table } from "$lib/components/dataTable/table.svelte";
-export { default as RangeCalendarButton } from "$lib/components/rangeCalendarButton.svelte";
-export { default as DataTable } from "$lib/components/dataTable/dataTable.svelte";
-export { default as Drawer } from "$lib/components/drawer.svelte";
-export { default as SelectRecord } from "$lib/components/selectRecord.svelte";
-export { Switch } from "$lib/components/ui/switch";