@teacss/inspector 0.4.7 → 0.5.0

package/dist/index.d.ts

@@ -3,7 +3,7 @@ import { IncomingMessage, ServerResponse } from "node:http";
 import { Plugin } from "vite";
 //#region src/types.d.ts
 /** A single matched token (utility/class) and what it produced. */
-interface MatchedToken {
+export interface MatchedToken {
   /** The raw token as written in source, e.g. `bg-color:red-500`. */
   token: string;
   /** The generated CSS declarations (rule bodies joined), for preview. */
@@ -16,12 +16,12 @@ interface MatchedToken {
   modules: string[];
 }
 /** One output layer and its CSS. */
-interface LayerCss {
+export interface LayerCss {
   name: string;
   css: string;
 }
 /** The common payload behind /overview, /module and /repl. */
-interface GenerateResultDTO {
+export interface GenerateResultDTO {
   /** Full generated CSS (all layers concatenated in order). */
   css: string;
   /** Per-layer CSS, in layer order. */
@@ -30,7 +30,7 @@ interface GenerateResultDTO {
   matched: MatchedToken[];
 }
 /** A safe, acyclic summary of the resolved config (no live objects). */
-interface ConfigSummary {
+export interface ConfigSummary {
   presets: string[];
   /** `[name, order]` pairs, sorted by order. */
   layers: [string, number][];
@@ -39,7 +39,7 @@ interface ConfigSummary {
   themeKeys: string[];
 }
 /** GET / — project + config overview chrome. */
-interface ProjectInfo {
+export interface ProjectInfo {
   version: string;
   root: string;
   /** Scanned module ids (sorted). */
@@ -49,26 +49,26 @@ interface ProjectInfo {
   config: ConfigSummary;
 }
 /** GET /overview — whole-project generated CSS + analysis. */
-interface OverviewInfo extends GenerateResultDTO {
+export interface OverviewInfo extends GenerateResultDTO {
   gzipSize: number;
 }
 /** GET /module?id= — a single module's source + what it generated. */
-interface ModuleInfo extends GenerateResultDTO {
+export interface ModuleInfo extends GenerateResultDTO {
   id: string;
   code: string;
   gzipSize: number;
 }
 /** GET /repl?token= — generate CSS from arbitrary input. */
-type ReplResult = GenerateResultDTO;
+export type ReplResult = GenerateResultDTO;
 /** Mount paths (also used to build client asset URLs). */
-declare const CLIENT_BASE = "__teacss";
-declare const API_BASE = "__teacss_api";
+export declare const CLIENT_BASE = "__teacss";
+export declare const API_BASE = "__teacss_api";
 //#endregion
 //#region src/analyzer.d.ts
 /** Map of source-module id → the tokens extracted from it. */
 type ModuleTokens = Map<string, Set<string>>;
 /** Coarse grouping family for a token: its property prefix, else the keyword stem. */
-declare function categoryOf(token: string): string;
+export declare function categoryOf(token: string): string;
 interface GenerateDTOOptions {
   /** Module attribution source; when given, each matched token lists its files. */
   moduleTokens?: ModuleTokens;
@@ -83,7 +83,7 @@ interface GenerateDTOOptions {
  * per-layer CSS, and the matched tokens with declaration bodies, counts, and
  * (optionally) which modules used each.
  */
-declare function generateDTO(generator: TeacssGenerator, input: Set<string> | string, options?: GenerateDTOOptions): Promise<GenerateResultDTO>;
+export declare function generateDTO(generator: TeacssGenerator, input: Set<string> | string, options?: GenerateDTOOptions): Promise<GenerateResultDTO>;
 //#endregion
 //#region src/index.d.ts
 /** One scanned module the inspector tracks: its source + the tokens it used. */
@@ -92,7 +92,7 @@ interface ModuleEntry {
   tokens: Set<string>;
 }
 /** The inspector's per-module state, shared between the plugin and the API. */
-interface InspectorStore {
+export interface InspectorStore {
   /** Clean id (no `?query`) → entry. */
   modules: Map<string, ModuleEntry>;
   /** Bumped whenever `modules` or the config changes — keys the overview cache. */
@@ -103,13 +103,13 @@ interface InspectorStore {
  * live generator/context plus the per-module `store` the plugin tracks. Mount it
  * under `/${API_BASE}`. The `/overview` response is cached on the store version.
  */
-declare function createInspectorApi(ctx: TeacssPluginContext, store: InspectorStore): (req: IncomingMessage, res: ServerResponse, next: () => void) => Promise<void>;
+export declare function createInspectorApi(ctx: TeacssPluginContext, store: InspectorStore): (req: IncomingMessage, res: ServerResponse, next: () => void) => Promise<void>;
 /**
  * Vite plugin: mounts the TeaCSS inspector on the dev server. Add it alongside
  * `teacss()` — it discovers the live context through that plugin's `teacss:api`
  * and serves the UI at `/${CLIENT_BASE}` with its JSON API at `/${API_BASE}`.
  * Dev-only (`apply: "serve"`).
  */
-declare function pluginInspector(): Plugin;
+export declare function pluginInspector(): Plugin;
 //#endregion
-export { API_BASE, CLIENT_BASE, ConfigSummary, GenerateResultDTO, InspectorStore, LayerCss, MatchedToken, ModuleInfo, type ModuleTokens, OverviewInfo, ProjectInfo, ReplResult, categoryOf, createInspectorApi, generateDTO, pluginInspector };
+export type { ModuleTokens };

package/dist/index.js

@@ -1,2 +1,2 @@
-import{fileURLToPath as e}from"node:url";import{gzipSync as t}from"node:zlib";import{SKIP_END_COMMENT as n,SKIP_START_COMMENT as r}from"@teacss/core";import i from"sirv";import{BlockList as a,isIP as o}from"node:net";const s=new a;s.addSubnet(`127.0.0.0`,8,`ipv4`),s.addAddress(`::1`,`ipv6`);function c(e){if(!e)return!1;let t=e.startsWith(`[`)&&e.endsWith(`]`)?e.slice(1,-1):e,n=o(t);return n?s.check(t,n===4?`ipv4`:`ipv6`):!1}function l(e){if(!e)return;let t=e.trim().toLowerCase();if(!t)return;if(o(t))return t;if(t.startsWith(`[`)){let e=t.match(/^\[([^\]]+)\](?::(\d+))?$/);return!e||!u(e[2])?void 0:e[1]}let n=t.match(/^([^:]+)(?::(\d+))?$/);if(!(!n||!u(n[2])))return n[1].replace(/\.$/,``)}function u(e){return e===void 0||Number(e)<=65535}function d(e,t){let n=l(e);return(n===`localhost`||c(n))&&c(t)}function f(e){let t=e.indexOf(`@`),n=t>=0?e.slice(0,t):e,r=n.indexOf(`:`);if(r>=0)return n.slice(0,r);let i=n.indexOf(`-`);return(i>=0?n.slice(0,i):n)||`misc`}function p(e,t){let n=new Map;if(!t.size)return n;for(let[r,i]of e)for(let e of i){if(!t.has(e))continue;let i=n.get(e);i||(i=[],n.set(e,i)),i.push(r)}for(let e of n.values())e.length>1&&e.sort();return n}function m(e){let t=new Set;for(let n of e.values())for(let e of n)t.add(e);return t}async function h(e,t,n={}){let r=await e.generate(t,{extendedInfo:!0,preflights:!1,safelist:n.safelist??!1,id:n.id}),i=n.moduleTokens?p(n.moduleTokens,r.matched):void 0,a=[];for(let[e,t]of r.matched){let n=``;for(let e of t.data){let t=e[2];t&&(n+=n?` ${t}`:t)}let r=i?.get(e)??[];a.push({token:e,css:n,count:i?r.length:1,category:f(e),modules:r})}a.sort((e,t)=>t.count-e.count||e.token.localeCompare(t.token));let o=r.layers.map(e=>({name:e,css:r.getLayer(e)??``}));return{css:r.css,layers:o,matched:a}}const g=`__teacss`,_=`__teacss_api`,v=e=>e.split(`?`)[0],y=e=>e.replace(/([?&])(?:t|v)=[^&]+$/,``).replace(/\?$/,``);function b(e){let t=new Map;for(let[n,r]of e)t.set(n,r.tokens);return t}const x=RegExp(`(//\\s*?${r}\\s*?|\\/\\*\\s*?${r}\\s*?\\*\\/|<!--\\s*?${r}\\s*?-->)[\\s\\S]*?(//\\s*?${n}\\s*?|\\/\\*\\s*?${n}\\s*?\\*\\/|<!--\\s*?${n}\\s*?-->)`,`g`);function S(e){return!e.includes(r)||!e.includes(n)?e:e.replace(x,``)}function C(e){let t=e.config;return{presets:t.presets.map(e=>e.name).filter(e=>!!e),layers:Object.entries(t.layers).sort((e,t)=>e[1]-t[1]),rules:t.rules.length,shortcuts:Array.isArray(t.shortcuts)?t.shortcuts.length:Object.keys(t.shortcuts).length,themeKeys:Object.keys(t.theme)}}function w(e,t,n){return{version:t.version,root:e.root,modules:[...n.keys()].sort(),configSources:e.getConfigFileList?.()??[],config:C(t)}}const T=e=>t(Buffer.from(e)).length;function E(e,t){let n;return async(r,i,a)=>{let o=(e,t=200)=>{i.statusCode=t,i.setHeader(`Content-Type`,`application/json`),i.end(JSON.stringify(e))};if(!d(r.headers.host,r.socket?.remoteAddress))return o({error:`forbidden`},403);try{let i=new URL(r.url??`/`,`http://localhost`);await e.ready;let s=e.generator,{modules:c}=t;switch(i.pathname){case`/`:case``:return o(w(e,s,c));case`/overview`:{let r=t.version();if(n?.version===r)return o(n.data);let i=b(c),a=m(i);for(let t of e.tokens)a.add(t);let l=await h(s,a,{moduleTokens:i}),u={...l,gzipSize:T(l.css)};return n={version:r,data:u},o(u)}case`/repl`:{let e=i.searchParams.get(`token`)??``;return e.length>5e4?o({error:`input too large`},413):o(await h(s,e,{safelist:i.searchParams.get(`safelist`)===`true`}))}case`/module`:{let e=i.searchParams.get(`id`)??``,t=c.get(e);if(!t)return o({error:`module not found`},404);let n=await h(s,t.tokens,{id:e,moduleTokens:b(c)});return o({...n,id:e,code:t.code,gzipSize:T(n.css)})}default:return a()}}catch(e){o({error:e instanceof Error?e.message:String(e)},500)}}}function D(){let t=new Map,n=new Map,r=new Map,a=0,o=()=>{a++},s={modules:t,version:()=>a},c,l,u,d;function f(e){let r=n.get(e);if(!r?.size){n.delete(e),t.delete(e);return}if(r.size===1){t.set(e,r.values().next().value);return}let i=new Set;for(let e of r.values())for(let t of e.tokens)i.add(t);let a=r.get(e)?.code??[...r.values()].map(e=>e.code).join(`
+import{fileURLToPath as e}from"node:url";import{gzipSync as t}from"node:zlib";import{SKIP_END_COMMENT as n,SKIP_START_COMMENT as r}from"@teacss/core";import i from"sirv";import{BlockList as a,isIP as o}from"node:net";const s=new a;s.addSubnet(`127.0.0.0`,8,`ipv4`),s.addAddress(`::1`,`ipv6`);function c(e){if(!e)return!1;let t=e.startsWith(`[`)&&e.endsWith(`]`)?e.slice(1,-1):e,n=o(t);return n?s.check(t,n===4?`ipv4`:`ipv6`):!1}function l(e){if(!e)return;let t=e.trim().toLowerCase();if(!t)return;if(o(t))return t;if(t.startsWith(`[`)){let e=t.match(/^\[([^\]]+)\](?::(\d+))?$/);return!e||!u(e[2])?void 0:e[1]}let n=t.match(/^([^:]+)(?::(\d+))?$/);if(n&&u(n[2]))return n[1].replace(/\.$/,``)}function u(e){return e===void 0||Number(e)<=65535}function d(e,t){let n=l(e);return(n===`localhost`||c(n))&&c(t)}function f(e){let t=e.indexOf(`@`),n=t>=0?e.slice(0,t):e,r=n.indexOf(`:`);if(r>=0)return n.slice(0,r);let i=n.indexOf(`-`);return(i>=0?n.slice(0,i):n)||`misc`}function p(e,t){let n=new Map;if(!t.size)return n;for(let[r,i]of e)for(let e of i){if(!t.has(e))continue;let i=n.get(e);i||(i=[],n.set(e,i)),i.push(r)}for(let e of n.values())e.length>1&&e.sort();return n}function m(e){let t=new Set;for(let n of e.values())for(let e of n)t.add(e);return t}async function h(e,t,n={}){let r=await e.generate(t,{extendedInfo:!0,preflights:!1,safelist:n.safelist??!1,id:n.id}),i=n.moduleTokens?p(n.moduleTokens,r.matched):void 0,a=[];for(let[e,t]of r.matched){let n=``;for(let e of t.data){let t=e[2];t&&(n+=n?` ${t}`:t)}let r=i?.get(e)??[];a.push({token:e,css:n,count:i?r.length:1,category:f(e),modules:r})}a.sort((e,t)=>t.count-e.count||e.token.localeCompare(t.token));let o=r.layers.map(e=>({name:e,css:r.getLayer(e)??``}));return{css:r.css,layers:o,matched:a}}const g=`__teacss`,_=`__teacss_api`,v=e=>e.split(`?`)[0],y=e=>e.replace(/([?&])(?:t|v)=[^&]+$/,``).replace(/\?$/,``);function b(e){let t=new Map;for(let[n,r]of e)t.set(n,r.tokens);return t}const x=RegExp(`(//\\s*?${r}\\s*?|\\/\\*\\s*?${r}\\s*?\\*\\/|<!--\\s*?${r}\\s*?-->)[\\s\\S]*?(//\\s*?${n}\\s*?|\\/\\*\\s*?${n}\\s*?\\*\\/|<!--\\s*?${n}\\s*?-->)`,`g`);function S(e){return!e.includes(r)||!e.includes(n)?e:e.replace(x,``)}function C(e){let t=e.config;return{presets:t.presets.map(e=>e.name).filter(e=>!!e),layers:Object.entries(t.layers).sort((e,t)=>e[1]-t[1]),rules:t.rules.length,shortcuts:Array.isArray(t.shortcuts)?t.shortcuts.length:Object.keys(t.shortcuts).length,themeKeys:Object.keys(t.theme)}}function w(e,t,n){return{version:t.version,root:e.root,modules:[...n.keys()].sort(),configSources:e.getConfigFileList?.()??[],config:C(t)}}const T=e=>t(Buffer.from(e)).length;function E(e,t){let n;return async(r,i,a)=>{let o=(e,t=200)=>{i.statusCode=t,i.setHeader(`Content-Type`,`application/json`),i.end(JSON.stringify(e))};if(!d(r.headers.host,r.socket?.remoteAddress))return o({error:`forbidden`},403);try{let i=new URL(r.url??`/`,`http://localhost`);await e.ready;let s=e.generator,{modules:c}=t;switch(i.pathname){case`/`:case``:return o(w(e,s,c));case`/overview`:{let r=t.version();if(n?.version===r)return o(n.data);let i=b(c),a=m(i);for(let t of e.tokens)a.add(t);let l=await h(s,a,{moduleTokens:i}),u={...l,gzipSize:T(l.css)};return n={version:r,data:u},o(u)}case`/repl`:{let e=i.searchParams.get(`token`)??``;return e.length>5e4?o({error:`input too large`},413):o(await h(s,e,{safelist:i.searchParams.get(`safelist`)===`true`}))}case`/module`:{let e=i.searchParams.get(`id`)??``,t=c.get(e);if(!t)return o({error:`module not found`},404);let n=await h(s,t.tokens,{id:e,moduleTokens:b(c)});return o({...n,id:e,code:t.code,gzipSize:T(n.css)})}default:return a()}}catch(e){o({error:e instanceof Error?e.message:String(e)},500)}}}function D(){let t=new Map,n=new Map,r=new Map,a=0,o=()=>{a++},s={modules:t,version:()=>a},c,l,u,d;function f(e){let r=n.get(e);if(!r?.size){n.delete(e),t.delete(e);return}if(r.size===1){t.set(e,r.values().next().value);return}let i=new Set;for(let e of r.values())for(let t of e.tokens)i.add(t);let a=r.get(e)?.code??[...r.values()].map(e=>e.code).join(`
 `);t.set(e,{code:a,tokens:i})}function p(e,t){return n.get(e)?.delete(t)?(f(e),!0):!1}function m(e){let i=v(e),a=y(e);if(a!==i){r.delete(a),p(i,a)&&o();return}for(let e of r.keys())v(e)===i&&r.delete(e);let s=n.delete(i),c=t.delete(i);(s||c)&&o()}function h(){d?.(),d=void 0,u?.watcher.off(`unlink`,m),u=void 0}function b(){r.clear();let e=t.size>0||n.size>0;t.clear(),n.clear(),e&&o()}function x(){h(),l?.(),l=void 0,b(),c=void 0}return{name:`teacss:inspector`,apply:`serve`,configResolved(e){l?.(),l=void 0;let t=(e.plugins.find(e=>e.name===`teacss:api`)?.api)?.getContext?.();c!==t&&(h(),b()),c=t,c?l=c.onInvalidate(o):e.logger.warn(`[teacss:inspector] no teacss() plugin found — the inspector is disabled.`)},async transform(e,t){let i=c;if(!i)return null;let a=v(t),s=y(t),l={};if(r.set(s,l),!i.filter(e,t))return r.delete(s),p(a,s)&&o(),null;try{await i.ready;let u=await i.generator.applyExtractors(S(e),t,new Set);if(c!==i||r.get(s)!==l)return null;if(u.size){let t=n.get(a);t||n.set(a,t=new Map),t.set(s,{code:e,tokens:u}),f(a),o()}else p(a,s)&&o();return null}finally{r.get(s)===l&&r.delete(s)}},async configureServer(t){let n=c;if(!n||(await n.ready,c!==n||u===t))return;if(h(),u=t,t.watcher.on(`unlink`,m),t.httpServer){let e=()=>{u===t&&x()};t.httpServer.once(`close`,e),d=()=>t.httpServer?.off(`close`,e)}let r=e(new URL(`./client`,import.meta.url));t.middlewares.use(`/${g}`,i(r,{single:!0,dev:!0})),t.middlewares.use(`/${_}`,E(n,s)),t.config.logger.info(`\n  \x1b[32m➜\x1b[0m  \x1b[36mTeaCSS Inspector\x1b[0m: \x1b[2mhttp://localhost:${t.config.server.port??5173}/${g}/\x1b[0m\n`)},closeBundle(){x()},devtools:{setup(e){e.docks.register({id:`teacss`,title:`TeaCSS`,icon:`mdi:tea`,type:`iframe`,url:`/${g}/`})}}}}export{_ as API_BASE,g as CLIENT_BASE,f as categoryOf,E as createInspectorApi,h as generateDTO,D as pluginInspector};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teacss/inspector",
-  "version": "0.4.7",
+  "version": "0.5.0",
   "description": "The inspector UI for TeaCSS — browse generated CSS, modules, and a live REPL.",
   "homepage": "https://css.teasim.com",
   "funding": "https://github.com/sponsors/billgo",
@@ -23,17 +23,17 @@
     "dev:client": "vite"
   },
   "dependencies": {
-    "@teacss/core": "0.4.7",
+    "@teacss/core": "0.5.0",
     "sirv": "^3.0.2"
   },
   "devDependencies": {
-    "@teacss/preset-standard": "0.4.7",
-    "@types/react": "^19.2.17",
-    "@types/react-dom": "^19.2.3",
-    "@vitejs/devtools-kit": "^0.4.8",
+    "@teacss/preset-standard": "0.5.0",
+    "@types/react": "^19.2.18",
+    "@types/react-dom": "^19.2.7",
+    "@vitejs/devtools-kit": "^0.7.2",
     "react": "^19.2.8",
     "react-dom": "^19.2.8",
-    "vite": "^8.1.5"
+    "vite": "^8.2.2"
   },
   "peerDependencies": {
     "vite": ">=5.0.0"