@litelens/core 1.7.1 → 1.7.3

package/README.md

@@ -18,8 +18,72 @@ So this package exists to give plugin authors real types, JSDoc, and editor auto
 
 ## Contents
 
-- **`src/index.ts`** — hook declarations (currently `useClusterWideAPI`), each a stub that throws if called outside a plugin context.
-- **`src/types/`** — shared TypeScript types re-exported alongside the hooks (`api`, `nav`, `resources`, `tray`).
+- **`src/clusterWideAPI.ts`** (exported as `clusterWideAPI`) — capabilities scoped to the single-cluster view. See "Using `clusterWideAPI`" below.
+- **`src/appWideAPI.ts`** (exported as `appWideAPI`) — capabilities with no single-cluster-view constraint. See "Using `appWideAPI`" below.
+- **`src/types/`** — shared TypeScript types re-exported alongside the API namespaces above (`api`, `nav`, `resources`, `tray`).
+- **`src/build/tsupPreset.ts`** (exported as `@litelens/core/tsup-preset`) — shared tsup build config for plugin frontends: Node-only build tooling, kept out of the `.` export above so it never ships in the browser bundle the vendor shim substitutes for. See "Shared plugin build config" below.
+
+## Using `clusterWideAPI`
+
+Everything under `clusterWideAPI` is only valid inside the single-cluster view (i.e. a component rendered within `MainLayout`'s subtree). Calling the hooks from an app-wide screen (Settings, Marketplace) throws.
+
+- **`useExposeProperties()`** — hook returning cluster-scoped state: `activeContext`, `activeNamespaces`, `activeResource`, `availableNamespaces`, `resourceLinks` (open a built-in resource's detail drawer, e.g. `resourceLinks.pod(namespace, name)`), and `unifiedTray` (`{ openTab }` for the bottom tray).
+- **`useExposeMethods()`** — hook returning cluster-scoped actions, currently `onNavigateToView(view)`.
+- **`registerViews(pluginId, configs)`** — registers your plugin's main view component(s), one per resource you own. Each `config.name` must match the `view` value used in the nav entry you register via `registerNavEntry` — the host mounts whichever registered view's `name` equals the currently active resource. Optionally pass a per-view `stylesheet` (a `Promise` from a CSS import) that loads only when that view mounts.
+- **`registerNavEntry(pluginId, navEntry)`** — registers your plugin's sidebar entry (a single item or a group of items, see `NavEntry` in `src/types/nav.ts`).
+- **`registerTrayFamilies(pluginId, families)`** — registers content components for tray families your plugin owns, keyed by an arbitrary family name your own `openTab` calls reference.
+- **`registerEvents(pluginId, handlers)`** — subscribes your plugin to the host's plugin event bus, keyed by event name.
+
+`registerViews`, `registerNavEntry`, `registerTrayFamilies`, and `registerEvents` are typically all called once, at module scope, in your plugin's entry file — that way your view, nav entry, tray content, and event handlers are all available as soon as the host dynamically imports your bundle, with no component needing to mount first. Re-registering under the same `pluginId` replaces the previous registration; the host also unregisters everything automatically when the plugin is uninstalled.
+
+```ts
+import { clusterWideAPI } from "@litelens/core";
+import { HelmChartListView } from "./views/HelmChartListView";
+import { HELM_NAV_ENTRY } from "./nav";
+import { HELM_TRAY_FAMILIES } from "./tray";
+
+const PLUGIN_ID = "helm";
+
+clusterWideAPI.registerViews(PLUGIN_ID, [{ name: "helm-charts", component: HelmChartListView }]);
+clusterWideAPI.registerNavEntry(PLUGIN_ID, HELM_NAV_ENTRY);
+clusterWideAPI.registerTrayFamilies(PLUGIN_ID, HELM_TRAY_FAMILIES);
+clusterWideAPI.registerEvents(PLUGIN_ID, {
+  "helm:release-updated": (payload) => {
+    appWideAPI.getQueryClient().invalidateQueries({ queryKey: ["helm", "releases"] });
+  },
+});
+```
+
+Inside a mounted view component:
+
+```tsx
+function HelmChartListView() {
+  const { activeContext, resourceLinks } = clusterWideAPI.useExposeProperties();
+  const { onNavigateToView } = clusterWideAPI.useExposeMethods();
+  // ...
+}
+```
+
+## Using `appWideAPI`
+
+- **`registerStylesheets(pluginId, stylesheets)`** — registers your plugin's global stylesheet(s) (e.g. compiled Tailwind output), loaded once at the app level regardless of which of your views is active. Call this once at module scope, alongside the `clusterWideAPI` registration calls above — don't use per-view `stylesheet` on `registerViews` for CSS that should apply across all of your views.
+- **`getQueryClient()`** — returns the host's singleton `QueryClient`. Use this from code that isn't a mounted React component (e.g. the module-scope `registerEvents` handler above) and therefore can't call `useQueryClient()`.
+
+## Shared plugin build config
+
+`@litelens/core/tsup-preset` exports `createPluginTsupConfig({ pluginRoot })`, the tsup config every plugin frontend needs: externalizes the host-shared runtime deps (`PLUGIN_SHARED_EXTERNALS`), inlines Tailwind-compiled CSS as text via a local Tailwind CLI pass, and optionally emits a bundle-analysis report to `dist/stats/` when `ANALYZE=true`. A plugin's own `tsup.config.ts` becomes:
+
+```ts
+import { createPluginTsupConfig } from "@litelens/core/tsup-preset";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+
+export default createPluginTsupConfig({
+  pluginRoot: path.dirname(fileURLToPath(import.meta.url)),
+});
+```
+
+Pass `entry` or `external` to override the entrypoint or add plugin-specific externals. Unlike the `.` export, this subpath pulls in real Node dependencies (`tsup`, `esbuild-visualizer`, `@tailwindcss/cli`) — they're declared as `dependencies` of this package (not `devDependencies`) so consuming plugins get them transitively.
 
 ## Versioning
 

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 import { ElementType, ReactNode, ComponentType } from 'react';
+import { QueryClient } from '@tanstack/react-query';
 
 interface UseQueryCallback<T = unknown> {
     select?: (data?: T) => T;
@@ -905,50 +906,182 @@ interface SharedUnifiedTrayContext {
 }
 
 /**
- * @litelens/core — React hooks for litelens plugin development
- *
- * This package exports hooks that plugin frontends can consume. The implementations
- * are provided by the host at runtime via import injection.
- */
-/**
- * Hook to access cluster-scoped APIs exposed to plugins. Returns a collection
- * of capabilities valid only within the single-cluster view — i.e. inside
- * MainLayout's subtree (MainLayoutProvider → DetailDrawerProvider). Calling
- * this from a component rendered outside that subtree (e.g. Settings,
- * Marketplace, or any future app-wide screen) will throw, because the
- * underlying host state (DetailDrawerContext) has no provider there. A future
- * useAppWideAPI() will cover capabilities that don't have this constraint.
+ * Hook to access cluster-scoped property values exposed to plugins. Valid
+ * only within the single-cluster view — i.e. inside MainLayout's subtree
+ * (MainLayoutProvider → DetailDrawerProvider). Calling this from a component
+ * rendered outside that subtree (e.g. Settings, Marketplace, or any future
+ * app-wide screen) will throw, because the underlying host state
+ * (DetailDrawerContext) has no provider there. A future appWideAPI will
+ * cover capabilities that don't have this constraint.
  *
  * Example:
- *   const { activeContext, activeNamespaces, activeResource, availableNamespaces, onNavigateToView, resourceLinks, unifiedTray, useRegisterClusterWideEvents, useRegisterNavEntry, useRegisterTrayFamilies } = useClusterWideAPI();
+ *   const { activeContext, activeNamespaces, activeResource, availableNamespaces, resourceLinks, unifiedTray } = clusterWideAPI.useExposeProperties();
  *   resourceLinks.pod(namespace, podName);  // Opens pod detail drawer
  *   unifiedTray.openTab("my-plugin-family", { pluginId: "my-plugin", label: "...", dedupeKey: "..." });
- *   useRegisterClusterWideEvents({
- *     "helm:release-updated": (payload) => { console.log("Release updated:", payload); },
- *   });
- *   useRegisterNavEntry("helm", "Helm", HELM_NAV_ENTRY);
- *   useRegisterTrayFamilies("helm", HELM_TRAY_FAMILIES);
  *
  * This signature is duplicated from the host's real implementation at
- * frontend/src/expose/hooks/useClusterWideAPI.ts (which this package can't
+ * frontend/src/expose/hooks/useExposeProperties.ts (which this package can't
  * import directly — see main.tsx's vendor injection). If that hook's return
  * type changes, update this signature to match.
  */
-declare function useClusterWideAPI(): {
+declare function useExposeProperties(): {
     activeContext: string;
     activeNamespaces: string[];
     activeResource: string;
     availableNamespaces: Array<{
         Name: string;
     }>;
-    onNavigateToView: (view: string) => void;
     resourceLinks: Record<string, (namespace: string, name: string) => void>;
     unifiedTray: {
         openTab: (family: string, params: unknown) => void;
     } | null;
-    useRegisterClusterWideEvents: (handlers: Record<string, (payload: unknown) => void>) => void;
-    useRegisterNavEntry: (pluginId: string, pluginName: string, navEntry: NavEntry<string> | undefined) => void;
-    useRegisterTrayFamilies: (pluginId: string, families: Record<string, ComponentType<SharedUnifiedTrayContentProps>> | undefined) => void;
+};
+/**
+ * Hook to access cluster-scoped plain functions exposed to plugins. Valid
+ * only within the single-cluster view — same constraints as useExposeProperties().
+ *
+ * Example:
+ *   const { onNavigateToView } = clusterWideAPI.useExposeMethods();
+ *
+ * This signature is duplicated from the host's real implementation at
+ * frontend/src/expose/hooks/useExposeMethods.ts (which this package can't
+ * import directly — see main.tsx's vendor injection). If that hook's return
+ * type changes, update this signature to match.
+ */
+declare function useExposeMethods(): {
+    onNavigateToView: (view: string) => void;
+};
+/**
+ * Register this plugin's event handlers with the host's plugin event bus.
+ * Called once by a plugin, typically at module scope alongside
+ * registerViews/registerNavEntry/registerTrayFamilies. Re-registering under
+ * the same plugin ID replaces its handlers; the host also unregisters them
+ * automatically when the plugin is uninstalled.
+ *
+ * Example:
+ *   const queryClient = appWideAPI.getQueryClient();
+ *   clusterWideAPI.registerEvents("helm", {
+ *     "helm:release-updated": (payload) => { queryClient.invalidateQueries(...); },
+ *   });
+ *
+ * This function is replaced at runtime by the host's actual implementation
+ * (injected in frontend/src/expose/index.tsx). If you see this error, registerEvents
+ * was called before the host initialized the injection.
+ */
+declare function registerEvents(pluginId: string, handlers: Record<string, (payload: any) => void>): void;
+/**
+ * Register this plugin's tray-family content components with the host's
+ * unified bottom tray. Called once by a plugin, typically at module scope
+ * alongside registerViews/registerNavEntry, so the plugin's tray content is
+ * available as soon as the plugin's bundle is imported — no component needs
+ * to mount first.
+ *
+ * Example:
+ *   clusterWideAPI.registerTrayFamilies("helm", HELM_TRAY_FAMILIES);
+ *
+ * This function is replaced at runtime by the host's actual implementation
+ * (injected in frontend/src/expose/index.tsx). If you see this error, registerTrayFamilies
+ * was called before the host initialized the injection.
+ */
+declare function registerTrayFamilies(pluginId: string, families: Record<string, ComponentType<SharedUnifiedTrayContentProps>> | undefined): void;
+/**
+ * Register one or more named view components with the host. Called by
+ * plugins to provide their main view UI, one per resource the plugin owns.
+ * `name` must match the resource's nav entry `view` value (see
+ * registerNavEntry) — the host mounts whichever registered view's `name`
+ * equals the currently active resource and keeps the rest hidden, so a
+ * plugin no longer needs to switch on the active resource itself. Each view
+ * may optionally supply its own `stylesheet`, loaded only when that view
+ * mounts — for a plugin's global stylesheet (e.g. Tailwind output shared
+ * across all its views), use appWideAPI.registerStylesheets instead, which
+ * loads once at the app level regardless of which view is active.
+ *
+ * Example:
+ *   clusterWideAPI.registerViews("helm", [
+ *     { name: "helm-charts", component: HelmChartListView, stylesheet: import("./chart-list.css") },
+ *     { name: "helm-releases", component: HelmReleaseListView },
+ *   ]);
+ *
+ * This function is replaced at runtime by the host's actual implementation
+ * (injected in frontend/src/expose/index.tsx). If you see this error, registerViews
+ * was called before the host initialized the injection.
+ */
+declare function registerViews(pluginId: string, configs: Array<{
+    name: string;
+    component: ComponentType;
+    stylesheet?: Promise<{
+        default: string;
+    }>;
+}>): void;
+/**
+ * Register this plugin's sidebar nav entry with the host. Called once by a
+ * plugin, typically at module scope alongside registerViews, so the entry
+ * appears in the sidebar as soon as the plugin's bundle is imported — no
+ * component needs to mount first.
+ *
+ * Example:
+ *   clusterWideAPI.registerNavEntry("helm", HELM_NAV_ENTRY);
+ *
+ * This function is replaced at runtime by the host's actual implementation
+ * (injected in frontend/src/expose/index.tsx). If you see this error, registerNavEntry
+ * was called before the host initialized the injection.
+ */
+declare function registerNavEntry(pluginId: string, navEntry: NavEntry<string> | undefined): void;
+/**
+ * Cluster-scoped capabilities exposed to plugins, valid only within the
+ * single-cluster view (see useExposeProperties() for the exact constraint).
+ * A future appWideAPI namespace will cover capabilities that don't have
+ * this constraint.
+ *
+ * Example:
+ *   const { onNavigateToView } = clusterWideAPI.useExposeMethods();
+ */
+declare const clusterWideAPI: {
+    useExposeProperties: typeof useExposeProperties;
+    useExposeMethods: typeof useExposeMethods;
+    registerViews: typeof registerViews;
+    registerNavEntry: typeof registerNavEntry;
+    registerTrayFamilies: typeof registerTrayFamilies;
+    registerEvents: typeof registerEvents;
+};
+
+/**
+ * Register the plugin's global stylesheet(s) with the host. Unlike
+ * clusterWideAPI.registerViews, this isn't scoped per-view — a plugin's
+ * compiled CSS (e.g. Tailwind output) applies across all of its views, so
+ * it's registered once per plugin rather than attached to each view config.
+ *
+ * Example:
+ *   appWideAPI.registerStylesheets("helm", [import("./style.css")]);
+ *
+ * This function is replaced at runtime by the host's actual implementation
+ * (injected in frontend/src/expose/index.tsx). If you see this error,
+ * registerStylesheets was called before the host initialized the injection.
+ */
+declare function registerStylesheets(pluginId: string, stylesheets: Array<Promise<{
+    default: string;
+}>>): void;
+/**
+ * Get the host's singleton QueryClient instance. Useful for plugin code
+ * that isn't a mounted React component (e.g. module-scope registration in
+ * index.ts) and therefore can't call useQueryClient()'s hook.
+ *
+ * Example:
+ *   const queryClient = appWideAPI.getQueryClient();
+ *   queryClient.invalidateQueries({ queryKey: [...] });
+ *
+ * This function is replaced at runtime by the host's actual implementation
+ * (injected in frontend/src/expose/index.tsx). If you see this error,
+ * getQueryClient was called before the host initialized the injection.
+ */
+declare function getQueryClient(): QueryClient;
+/**
+ * App-wide capabilities exposed to plugins — not scoped to the single-cluster
+ * view, unlike clusterWideAPI (see useExposeProperties() for that constraint).
+ */
+declare const appWideAPI: {
+    registerStylesheets: typeof registerStylesheets;
+    getQueryClient: typeof getQueryClient;
 };
 
-export { type CRBSubject, type ClusterRole, type ClusterRoleBinding, type ConfigMap, type CronJob, type CronJobSummary, type DaemonSet, type DaemonSetSummary, type Deployment, type DeploymentCondition, type DeploymentSummary, type Endpoint, type EndpointAddress, type EndpointPort, type EndpointSlice, type EndpointSliceEndpoint, type EndpointSlicePort, type EndpointSubset, type Event, type HPA, type HPADetail, type HPAMetric, type Ingress, type IngressClass, type IngressDetail, type IngressPath, type IngressRule, type Job, type JobCondition, type JobSummary, type Lease, type LimitRange, type LimitRangeDetail, type ManagedField, type Namespace, type NavEntry, type NavGroup, type NavItem, type NetworkPolicy, type NetworkPolicyDetail, type NetworkPolicyEgressRule, type NetworkPolicyIngressRule, type NetworkPolicyPeer, type Node, type NodeAddress, type NodeCondition, type PersistentVolume, type PersistentVolumeClaim, type PersistentVolumeClaimDetail, type PersistentVolumeDetail, type Pod, type PodCondition, type PodContainerDetail, type PodContainerLastStatus, type PodContainerMount, type PodContainerPort, type PodDisruptionBudget, type PodDisruptionBudgetDetail, type PodSummary, type PodVolume, type PodVolumeSource, type PolicyRule, type PortForward, type PriorityClass, type RBSubject, type ReplicaSet, type ReplicaSetSummary, type ResourceQuota, type ResourceQuotaDetail, type Role, type RoleBinding, type ScaleTargetRef, type Secret, type SecretDetail, type Service, type ServiceAccount, type ServicePort, type SharedNamespaceContext, type SharedUnifiedTrayContentProps, type SharedUnifiedTrayContext, type SharedUnifiedTrayOpenParams, type SharedUnifiedTrayTab, type StatefulSet, type StatefulSetSummary, type StorageClass, type TolerationDetail, type UnifiedTrayAllFamily, type UnifiedTrayCoreFamily, type UseQueryCallback, type ValidatingWebhookConfig, type ValidatingWebhookConfigDetail, type WebhookDetail, useClusterWideAPI };
+export { type CRBSubject, type ClusterRole, type ClusterRoleBinding, type ConfigMap, type CronJob, type CronJobSummary, type DaemonSet, type DaemonSetSummary, type Deployment, type DeploymentCondition, type DeploymentSummary, type Endpoint, type EndpointAddress, type EndpointPort, type EndpointSlice, type EndpointSliceEndpoint, type EndpointSlicePort, type EndpointSubset, type Event, type HPA, type HPADetail, type HPAMetric, type Ingress, type IngressClass, type IngressDetail, type IngressPath, type IngressRule, type Job, type JobCondition, type JobSummary, type Lease, type LimitRange, type LimitRangeDetail, type ManagedField, type Namespace, type NavEntry, type NavGroup, type NavItem, type NetworkPolicy, type NetworkPolicyDetail, type NetworkPolicyEgressRule, type NetworkPolicyIngressRule, type NetworkPolicyPeer, type Node, type NodeAddress, type NodeCondition, type PersistentVolume, type PersistentVolumeClaim, type PersistentVolumeClaimDetail, type PersistentVolumeDetail, type Pod, type PodCondition, type PodContainerDetail, type PodContainerLastStatus, type PodContainerMount, type PodContainerPort, type PodDisruptionBudget, type PodDisruptionBudgetDetail, type PodSummary, type PodVolume, type PodVolumeSource, type PolicyRule, type PortForward, type PriorityClass, type RBSubject, type ReplicaSet, type ReplicaSetSummary, type ResourceQuota, type ResourceQuotaDetail, type Role, type RoleBinding, type ScaleTargetRef, type Secret, type SecretDetail, type Service, type ServiceAccount, type ServicePort, type SharedNamespaceContext, type SharedUnifiedTrayContentProps, type SharedUnifiedTrayContext, type SharedUnifiedTrayOpenParams, type SharedUnifiedTrayTab, type StatefulSet, type StatefulSetSummary, type StorageClass, type TolerationDetail, type UnifiedTrayAllFamily, type UnifiedTrayCoreFamily, type UseQueryCallback, type ValidatingWebhookConfig, type ValidatingWebhookConfigDetail, type WebhookDetail, appWideAPI, clusterWideAPI };

package/dist/index.js

@@ -1,8 +1,57 @@
-// src/index.ts
-function useClusterWideAPI() {
+// src/clusterWideAPI.ts
+function useExposeProperties() {
   throw new Error(
-    "useClusterWideAPI is not available. This hook must be imported from '@litelens/core' within a plugin bundle loaded by the litelens host."
+    "clusterWideAPI.useExposeProperties is not available. This hook must be imported from '@litelens/core' within a plugin bundle loaded by the litelens host."
   );
 }
+function useExposeMethods() {
+  throw new Error(
+    "clusterWideAPI.useExposeMethods is not available. This hook must be imported from '@litelens/core' within a plugin bundle loaded by the litelens host."
+  );
+}
+function registerEvents(pluginId, handlers) {
+  throw new Error(
+    "clusterWideAPI.registerEvents is not available. This function must be imported from '@litelens/core' within a plugin bundle loaded by the litelens host."
+  );
+}
+function registerTrayFamilies(pluginId, families) {
+  throw new Error(
+    "clusterWideAPI.registerTrayFamilies is not available. This function must be imported from '@litelens/core' within a plugin bundle loaded by the litelens host."
+  );
+}
+function registerViews(pluginId, configs) {
+  throw new Error(
+    "clusterWideAPI.registerViews is not available. This function must be imported from '@litelens/core' within a plugin bundle loaded by the litelens host."
+  );
+}
+function registerNavEntry(pluginId, navEntry) {
+  throw new Error(
+    "clusterWideAPI.registerNavEntry is not available. This function must be imported from '@litelens/core' within a plugin bundle loaded by the litelens host."
+  );
+}
+var clusterWideAPI = {
+  useExposeProperties,
+  useExposeMethods,
+  registerViews,
+  registerNavEntry,
+  registerTrayFamilies,
+  registerEvents
+};
+
+// src/appWideAPI.ts
+function registerStylesheets(pluginId, stylesheets) {
+  throw new Error(
+    "appWideAPI.registerStylesheets is not available. This function must be imported from '@litelens/core' within a plugin bundle loaded by the litelens host."
+  );
+}
+function getQueryClient() {
+  throw new Error(
+    "appWideAPI.getQueryClient is not available. This function must be imported from '@litelens/core' within a plugin bundle loaded by the litelens host."
+  );
+}
+var appWideAPI = {
+  registerStylesheets,
+  getQueryClient
+};
 
-export { useClusterWideAPI };
+export { appWideAPI, clusterWideAPI };

package/dist/tsup-preset.d.ts

@@ -0,0 +1,33 @@
+import { Options } from 'tsup';
+
+/**
+ * Externals every plugin frontend must share with the host's own module
+ * instances (resolved via the host's import map + vendor shims) rather than
+ * bundling its own copy — required for react-dom/@tanstack/react-query
+ * context objects to resolve correctly when a plugin component is mounted
+ * inline in the host's fiber tree.
+ */
+declare const PLUGIN_SHARED_EXTERNALS: readonly ["react", "react-dom", "@litelens/design-system", "@tanstack/react-query", "@litelens/core"];
+interface CreatePluginTsupConfigOptions {
+    /** Absolute path to the plugin frontend package's root directory (e.g.
+     * `path.dirname(fileURLToPath(import.meta.url))` from the plugin's own
+     * `tsup.config.ts`). Used as the Tailwind CLI's `--cwd` and to resolve the
+     * package name for the bundle-report title. */
+    pluginRoot: string;
+    /** Defaults to `["src/index.ts"]`. */
+    entry?: string[];
+    /** Extra externals beyond {@link PLUGIN_SHARED_EXTERNALS}. */
+    external?: string[];
+    /** Defaults to `process.env.ANALYZE === "true"`. */
+    analyze?: boolean;
+}
+/**
+ * Shared tsup config for litelens plugin frontends: bundles `src/index.ts`
+ * to a single ESM file, externalizing the host-shared runtime deps, inlining
+ * Tailwind-compiled CSS as text (see {@link createInlineTailwindPlugin}), and
+ * optionally emitting a bundle-analysis report to `dist/stats/` when
+ * `ANALYZE=true`.
+ */
+declare function createPluginTsupConfig(options: CreatePluginTsupConfigOptions): Options;
+
+export { type CreatePluginTsupConfigOptions, PLUGIN_SHARED_EXTERNALS, createPluginTsupConfig };

package/dist/tsup-preset.js

@@ -0,0 +1,99 @@
+import { visualizer, prepareVisualizerData } from 'esbuild-visualizer';
+import { execFileSync } from 'child_process';
+import fs from 'fs';
+import { createRequire } from 'module';
+import path from 'path';
+
+// src/build/tsupPreset.ts
+var PLUGIN_SHARED_EXTERNALS = [
+  "react",
+  "react-dom",
+  "@litelens/design-system",
+  "@tanstack/react-query",
+  "@litelens/core"
+];
+var require2 = createRequire(import.meta.url);
+function resolveTailwindCliEntry() {
+  const tailwindCliPkg = JSON.parse(
+    fs.readFileSync(require2.resolve("@tailwindcss/cli/package.json"), "utf-8")
+  );
+  return path.join(
+    path.dirname(require2.resolve("@tailwindcss/cli/package.json")),
+    tailwindCliPkg.bin.tailwindcss
+  );
+}
+var RESOLVED_SUFFIX = ".tw-inline";
+function createInlineTailwindPlugin(pluginRoot) {
+  const tailwindCliEntry = resolveTailwindCliEntry();
+  return {
+    name: "inline-tailwind",
+    setup(build) {
+      build.onResolve({ filter: /\.css$/ }, (args) => {
+        if (args.namespace !== "file") return;
+        const absPath = path.isAbsolute(args.path) ? args.path : path.join(args.resolveDir, args.path);
+        return { path: absPath + RESOLVED_SUFFIX, namespace: "inline-tailwind" };
+      });
+      build.onLoad({ filter: /\.tw-inline$/, namespace: "inline-tailwind" }, (args) => {
+        const realPath = args.path.slice(0, -RESOLVED_SUFFIX.length);
+        const contents = execFileSync(
+          process.execPath,
+          [tailwindCliEntry, "-i", realPath, "-m", "--cwd", pluginRoot],
+          { encoding: "utf-8" }
+        );
+        return { contents, loader: "text" };
+      });
+    }
+  };
+}
+function createPluginTsupConfig(options) {
+  const { pluginRoot, entry = ["src/index.ts"], external = [], analyze } = options;
+  const shouldAnalyze = analyze ?? process.env.ANALYZE === "true";
+  const pkg = JSON.parse(fs.readFileSync(path.join(pluginRoot, "package.json"), "utf-8"));
+  return {
+    entry,
+    format: ["esm"],
+    outDir: "dist",
+    target: "es2020",
+    splitting: true,
+    sourcemap: false,
+    clean: true,
+    metafile: shouldAnalyze,
+    external: [...PLUGIN_SHARED_EXTERNALS, ...external],
+    // Tailwind CSS is compiled in-memory by the inline-tailwind esbuild plugin
+    // (above) and imported as raw text via `import("./style.css")`, so it ends
+    // up embedded directly in dist/index.js instead of shipped as a separate
+    // stylesheet asset. Must be set here (tsup's top-level `loader` option)
+    // rather than inside esbuildOptions — tsup's own CSS-handling esbuild
+    // plugin reads this value before esbuildOptions runs.
+    loader: {
+      ".css": "text"
+    },
+    // tsup's own esbuild-plugin array (postcss, svelte, etc.) is built statically
+    // before the build starts; a plugin pushed onto `options.plugins` inside
+    // esbuildOptions arrives too late; esbuild has already snapshotted the array
+    // for setup. `esbuildPlugins` is tsup's supported hook for adding one upfront.
+    esbuildPlugins: [createInlineTailwindPlugin(pluginRoot)],
+    esbuildOptions: (esbuildOptions) => {
+      esbuildOptions.banner = {
+        js: "/* Plugin bundle - loaded dynamically */"
+      };
+    },
+    onSuccess: async () => {
+      const metafilePath = path.join(pluginRoot, "dist", "metafile-esm.json");
+      if (shouldAnalyze && fs.existsSync(metafilePath)) {
+        const statsDir = path.join(pluginRoot, "dist", "stats");
+        fs.mkdirSync(statsDir, { recursive: true });
+        const metadata = JSON.parse(fs.readFileSync(metafilePath, "utf-8"));
+        const html = await visualizer(metadata, {
+          title: `${pkg.name} Bundle Report`,
+          template: "treemap"
+        });
+        fs.writeFileSync(path.join(statsDir, "bundle-report.html"), html);
+        fs.writeFileSync(path.join(statsDir, "bundle-stats.json"), prepareVisualizerData(metadata));
+        fs.renameSync(metafilePath, path.join(statsDir, "metafile-esm.json"));
+      }
+    }
+  };
+}
+
+export { PLUGIN_SHARED_EXTERNALS, createPluginTsupConfig };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@litelens/core",
-  "version": "1.7.1",
+  "version": "1.7.3",
   "description": "React hooks and utilities for litelens plugin development",
   "private": false,
   "repository": {
@@ -20,22 +20,31 @@
   "exports": {
     ".": {
       "import": "./dist/index.js"
+    },
+    "./tsup-preset": {
+      "import": "./dist/tsup-preset.js"
     }
   },
   "peerDependencies": {
+    "@tanstack/react-query": "^5.101.4",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
+  "dependencies": {
+    "@tailwindcss/cli": "^4.3.3",
+    "esbuild-visualizer": "^0.7.0",
+    "tsup": "^8.5.1"
+  },
   "devDependencies": {
+    "@tanstack/react-query": "^5.101.4",
     "@types/node": "^26.2.0",
     "@types/react": "^19.2.18",
     "@types/react-dom": "^19.2.4",
-    "@vitejs/plugin-react": "^6.0.5",
-    "@vitest/coverage-v8": "^4.1.10",
+    "@vitejs/plugin-react": "^6.1.0",
+    "@vitest/coverage-v8": "^4.1.11",
     "jsdom": "^29.1.1",
-    "tsup": "^8.5.1",
     "typescript": "^6.0.3",
-    "vitest": "^4.1.10"
+    "vitest": "^4.1.11"
   },
   "scripts": {
     "build": "tsup",