wgsl-edit 0.0.17 → 0.0.19

package/README.md

@@ -76,6 +76,7 @@ editor.project = {                    // load a full project
 | `tabs` | boolean | `true` | Show tab bar |
 | `lint` | `on` `off` | `on` | Real-time WESL validation |
 | `line-numbers` | `true` `false` | `false` | Show line numbers |
+| `fetch-libs` | `true` `false` | `true` | Auto-fetch missing libraries from npm |
 | `shader-root` | string | - | Root path for shader imports |
 
 ### Properties
@@ -86,7 +87,7 @@ editor.project = {                    // load a full project
 - `project: WeslProject` - Set full project (sources, conditions, packageName, etc.)
 - `activeFile: string` - Get/set active file name
 - `fileNames: string[]` - List all file names
-- `theme`, `tabs`, `lint`, `lineNumbers`, `readonly`, `shaderRoot` - Mirror attributes
+- `theme`, `tabs`, `lint`, `lineNumbers`, `readonly`, `shaderRoot`, `fetchLibs` - Mirror attributes
 
 ### Methods
 

package/dist/Language.js

@@ -99,7 +99,7 @@ function findMissingPackages(rootAst, result, resolver, ignored, libs) {
 	const pkgs = [];
 	for (const imp of rootAst.imports) {
 		const root = imp.segments[0]?.name;
-		if (!root || !isExternalRoot(root) || ignored.has(root)) continue;
+		if (!root || !isExternalRoot(root) || ignored.has(root) || loaded.has(root)) continue;
 		const modPath = imp.segments.map((s) => s.name).join("::");
 		if (!resolver.resolveModule(modPath)) pkgs.push(root);
 	}

package/dist/WgslEdit-BiLVs-hz.js

@@ -0,0 +1,5 @@
+//#region src/WgslEdit.css?inline
+var WgslEdit_default = ":host {\n  --tab-bar-bg: transparent;\n  --tab-border: #ccc;\n  --tab-color: #999;\n  --tab-active-bg: #fff;\n  --tab-active-color: #222;\n  --tab-accent: #5f61d8;\n\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  min-height: 100px;\n}\n\n:host(.dark) {\n  --tab-bar-bg: transparent;\n  --tab-border: #555;\n  --tab-color: #999;\n  --tab-active-bg: #1e1e1e;\n  --tab-active-color: #fff;\n}\n\n.tab-bar {\n  --bar-v: 6px;\n  --bar-h: 8px;\n  display: flex;\n  align-items: center;\n  gap: 14px;\n  padding: var(--bar-v) var(--bar-h);\n  background: var(--tab-bar-bg);\n  flex-shrink: 0;\n  position: relative;\n}\n\n.tab-bar::after {\n  content: \"\";\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  height: 1px;\n  background: var(--tab-border);\n}\n\n.tab {\n  --tab-v: 5px;\n  --tab-h: 12px;\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  padding: var(--tab-v) var(--tab-h);\n  background: transparent;\n  border: none;\n  border-radius: 0;\n  color: var(--tab-color);\n  cursor: pointer;\n  position: relative;\n  font-size: 15px;\n  font-family: system-ui, sans-serif;\n}\n\n.tab.active {\n  color: var(--tab-accent);\n  font-weight: 600;\n  padding-bottom: calc(var(--tab-v) + var(--bar-v) + 0.5px);\n  margin-bottom: calc(-1 * (var(--bar-v) + 0.5px));\n  position: relative;\n  z-index: 1;\n  border-bottom: 2px solid var(--tab-accent);\n}\n\n.tab.active:first-child {\n  margin-left: calc(-1 * var(--bar-h));\n  padding-left: calc(var(--tab-h) + var(--bar-h));\n}\n\n.tab-close {\n  position: absolute;\n  right: -8px;\n  /* top: 2px; */\n  width: 16px;\n  height: 16px;\n  padding: 0;\n  border: none;\n  background: transparent;\n  color: inherit;\n  cursor: pointer;\n  opacity: 0;\n  font-size: 18px;\n  line-height: 1;\n}\n\n.tab:hover .tab-close {\n  opacity: 0.6;\n}\n\n.tab-close:hover {\n  opacity: 1;\n}\n\n.tab-rename {\n  background: var(--tab-active-bg);\n  border: 1px solid var(--tab-border);\n  border-radius: 4px;\n  color: var(--tab-active-color);\n  font-size: 15px;\n  font-family: system-ui, sans-serif;\n  padding: 0 4px;\n  outline: none;\n}\n\n.tab-add {\n  padding: 0 10px;\n  background: transparent;\n  border: none;\n  color: var(--tab-color);\n  cursor: pointer;\n  font-size: 25px;\n  line-height: 1;\n}\n\n.tab-add:hover {\n  color: var(--tab-active-color);\n}\n\n.editor-container {\n  flex: 1;\n  min-height: 0;\n  width: 100%;\n  padding: var(--editor-padding, 16px 0 0);\n}\n\n.cm-editor {\n  height: 100%;\n  font-size: var(--editor-font-size, 14px);\n}\n\n.cm-scroller {\n  overflow: auto;\n}\n\n.snackbar {\n  position: absolute;\n  bottom: 16px;\n  left: 16px;\n  background: #e8e8e8;\n  color: #333;\n  padding: 10px 20px;\n  border-radius: 8px;\n  font-size: 14px;\n  font-family: system-ui, sans-serif;\n  line-height: 1.4;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 0.2s;\n  z-index: 10;\n}\n\n:host(.dark) .snackbar {\n  background: #3a3a3a;\n  color: #e0e0e0;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);\n}\n\n.snackbar.visible {\n  opacity: 1;\n}\n";
+
+//#endregion
+export { WgslEdit_default as t };

package/dist/WgslEdit.d.ts

@@ -1,4 +1,4 @@
-import { Conditions, LinkParams } from "wesl";
+import { Conditions, LinkParams, WeslBundle } from "wesl";
 
 //#region src/WgslEdit.d.ts
 type WeslProject = Pick<LinkParams, "weslSrc" | "rootModuleName" | "conditions" | "constants" | "libs" | "packageName">;
@@ -20,13 +20,16 @@ declare class WgslEdit extends HTMLElement {
   private _lineNumbers;
   private _files;
   private _activeFile;
+  private _rootModuleName;
   private _tabs;
   private _lint;
+  private _fetchLibs;
   private _conditions;
   private _packageName;
   private _libs;
   private _ignorePackages;
   private _fetchingPkgs;
+  private _fetchedPkgs;
   private _snackTimer;
   private _externalDiagnostics;
   private _lintFromEl;
@@ -52,7 +55,12 @@ declare class WgslEdit extends HTMLElement {
   set project(value: WeslProject);
   /** Link/compile WESL sources into WGSL. Returns the compiled WGSL string. */
   link(options?: Partial<LinkParams>): Promise<string>;
-  /** Currently active file name. */
+  /** Library bundles for linking (set via project). */
+  get libs(): WeslBundle[];
+  /** Root module for linking (stable across tab switches). */
+  get rootModuleName(): string | undefined;
+  set rootModuleName(value: string | undefined);
+  /** Currently active file name (selected tab). */
   get activeFile(): string;
   /** Switch to a file by name. */
   set activeFile(name: string);
@@ -67,6 +75,9 @@ declare class WgslEdit extends HTMLElement {
   /** Line numbers visibility (default: true). */
   get lineNumbers(): boolean;
   set lineNumbers(value: boolean);
+  /** Whether to auto-fetch missing library packages from npm (default: true). */
+  get fetchLibs(): boolean;
+  set fetchLibs(value: boolean);
   /** Whether the editor is currently loading content. */
   get loading(): boolean;
   set loading(value: boolean);