@mnaoumov/create-obsidian-plugin 1.0.2 → 1.1.0

package/templates/default/scripts/{vite.config.ts.ejs → vite.config.ts_standalone.ejs}

@@ -29,8 +29,9 @@ const EXTERNAL = [
 
 <%# Each per-answer plugin partial ends its entry with a comma so two of them concatenate into a valid -%>
 <%# list; the last entry of the array must not carry one. Stripped here rather than by making every -%>
-<%# partial know whether it is last. -%>
-<% const plugins = render('plugin'); -%>
+<%# partial know whether it is last. With no entry at all the list is `[]` on one line, which is how -%>
+<%# the formatter writes an empty array. -%>
+<% const plugins = render('plugin').replace(/,(?<Trailing>\s*)$/, '$<Trailing>'); -%>
 export const config = defineConfig({
   build: {
     // An Obsidian release ships `main.js` and `styles.css` and nothing else, so ANY asset vite emits
@@ -38,7 +39,6 @@ export const config = defineConfig({
     // Every one of them is the only shape that survives that: unconditional rather than tied to any
     // Answer, because which assets a `src/` comes to import is not a property of the answers.
     assetsInlineLimit: Number.MAX_SAFE_INTEGER,
-<%- render('lint-empty-out-dir') -%>
     emptyOutDir: false,
     lib: {
       // Obsidian loads a plugin's stylesheet from `styles.css` and nothing else. Vite's lib mode names
@@ -51,7 +51,6 @@ export const config = defineConfig({
       formats: ['cjs']
     },
     minify: isProduction,
-<%- render('lint-out-dir') -%>
     outDir: distFolder,
     rollupOptions: {
       external: EXTERNAL,
@@ -68,9 +67,7 @@ if you want to view the source, please visit the github repository of this plugi
         inlineDynamicImports: true
       }
     },
-    sourcemap: isProduction ? false : 'inline'
+    sourcemap: !isProduction && 'inline'
   },
-  plugins: [
-<%- plugins.replace(/,(?<Trailing>\s*)$/, '$<Trailing>') -%>
-  ]
+  plugins: [<%- plugins === '' ? '' : `\n${plugins}  ` -%>]
 });

package/templates/default/scripts/vitest-config.ts.ejs

@@ -1,8 +1,8 @@
-import type { ObsidianPluginVitestConfigContext } from 'obsidian-dev-utils/script-utils/test-runners/vitest-config';
+import type { ObsidianPluginVitestConfigContext } from '@mnaoumov/obsidian-dev-toolkit/test-runners/vitest-config';
 import type { TestProjectConfiguration } from 'vitest/config';
 
+import { defineObsidianPluginVitestConfig } from '@mnaoumov/obsidian-dev-toolkit/test-runners/vitest-config';
 import { fileURLToPath } from 'node:url';
-import { defineObsidianPluginVitestConfig } from 'obsidian-dev-utils/script-utils/test-runners/vitest-config';
 
 /**
  * The demo-vault button suite. It drives a real desktop Obsidian like the desktop project, but opens a
@@ -70,6 +70,7 @@ export const config = defineObsidianPluginVitestConfig({
       { find: /^.+\.wasm(?:\?.*)?$/u, replacement: WASM_MODULE_STUB_PATH },
       { find: /^data-url:.+$/u, replacement: WASM_MODULE_STUB_PATH }
     ];
+<%- render('edit-context') -%>
   }
 });
 <%- render('post-config') -%>

package/templates/default/scripts/vitest-config.ts@edit-context_docs-showcase.ejs

@@ -0,0 +1,3 @@
+    // The docs showcase is the Obsidian developer docs' code blocks, which the desktop integration suite runs in a real
+    // Obsidian. A unit test cannot reach them, so they would only drag the coverage report down.
+    context.coverageExclude.push('src/docs/**');

package/templates/default/scripts/webpack.config.ts_framework.ejs

@@ -0,0 +1,19 @@
+import type { Configuration } from 'webpack';
+
+<%- sortImports(`import { ObsidianPluginWebpackPlugin } from '@mnaoumov/obsidian-dev-toolkit/bundlers/webpack';
+${render('import')}`) -%>
+<%- _buildOptionsImport -%>
+
+// The obsidian-dev-toolkit plugin fills in the entry, the mode, the CommonJS `main.js` in `dist/build` (or `dist/dev`
+// Under `--watch`) with no async chunks, Obsidian's modules as externals and the browser export conditions.
+export const config: Configuration = {
+  module: {
+    rules: [
+      // Strips the types without checking them, which `build:compile` does. `ts-loader` calls TypeScript's
+      // JavaScript API, which TypeScript 7 no longer has.
+      { loader: 'esbuild-loader', test: /\.[jt]sx?$/ }<%- render('rule') %>
+    ]
+  },
+  plugins: [new ObsidianPluginWebpackPlugin(<%- _buildOptionsArgument %>)<%- render('plugin') %>],
+  resolve: { extensions: ['.ts', '.tsx', '.js'] }
+};

package/templates/default/scripts/webpack.config.ts_framework@import_scss.ejs

@@ -0,0 +1 @@
+import MiniCssExtractPlugin from 'mini-css-extract-plugin';

package/templates/default/scripts/webpack.config.ts_framework@plugin_scss.ejs

@@ -0,0 +1 @@
+, new MiniCssExtractPlugin()

package/templates/default/scripts/webpack.config.ts_framework@rule_scss.ejs

@@ -0,0 +1,4 @@
+,
+      // The toolkit compiles plain stylesheets only, so Sass is the project's own rule. The toolkit merges the extracted
+      // Stylesheet into `styles.css`.
+      { test: /\.scss$/, use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'] }

package/templates/default/scripts/{webpack.config.ts.ejs → webpack.config.ts_standalone.ejs}

@@ -6,7 +6,7 @@ import type { Configuration } from 'webpack';
 import { join } from 'node:path';
 import process from 'node:process';
 import TerserPlugin from 'terser-webpack-plugin';
-${render('lint-webpack-default')}import webpack from 'webpack';
+import webpack from 'webpack';
 ${render('import')}`) -%>
 
 const isProduction = process.env['BUILD'] === 'production';
@@ -47,7 +47,7 @@ const EXTERNAL = [
         // From exactly such sources. \`onlyCompileBundledFiles\` keeps ts-loader to the graph webpack
         // Actually pulls in, instead of every file the tsconfig's \`include\` lists -- it was reaching
         // \`webpack.config.ts\` and \`scripts/dev.ts\`, which are no business of the bundle.
-        exclude: /node_modules/,
+        exclude: [/node_modules/],
         test: /\\.tsx?$/,
         use: {
           loader: 'ts-loader',
@@ -71,7 +71,7 @@ if you want to view the source, please visit the github repository of this plugi
 ${render('plugin')}`;
 -%>
 export const config: Configuration = {
-  devtool: isProduction ? false : 'inline-source-map',
+  devtool: !isProduction && 'inline-source-map',
   entry: './src/main.ts',
   externals: Object.fromEntries(
     EXTERNAL.map((moduleName) => [moduleName, `commonjs2 ${moduleName}`])
@@ -90,7 +90,7 @@ export const config: Configuration = {
     minimizer: [new TerserPlugin({ extractComments: false })]
   },
   output: {
-    // An Obsidian release ships `main.js` and nothing beside it, so a dynamic import -- obsidian-dev-utils
+    // An Obsidian release ships `main.js` and nothing beside it, so a dynamic import -- obsidian-lib
     // Has several -- must not become a sibling chunk that `main.js` then loads by name at runtime. This is
     // Webpack's twin of rollup's `inlineDynamicImports`.
     asyncChunks: false,

package/templates/default/src/demo-vault-buttons.demo-vault.integration.test.ts.ejs

@@ -1,11 +1,11 @@
-import { registerDemoVaultButtonSuite } from 'obsidian-dev-utils/script-utils/demo-vault-buttons';
+import { registerDemoVaultButtonSuite } from '@mnaoumov/obsidian-dev-toolkit/demo-vault-buttons';
 
 // Clicks every `code-button` in `demo-vault/` against a real Obsidian. A button fails at CLICK time -- a
 // Wrong `require('/demoSetup.ts')` path, or an API that changed shape under it -- so no other gate can
 // Catch it: `lint:md` reads the markdown and the coverage suite checks the authoring conventions, and
 // Neither executes anything.
 //
-// It needs the CodeScript Toolkit binary seeded into `demo-vault/.obsidian/plugins/`, which happens the
+// It needs the `CodeScript Toolkit` binary seeded into `demo-vault/.obsidian/plugins/`, which happens the
 // First time you open `demo-vault/` in Obsidian. See CONTRIBUTING.md.
 //
 // Isolation: `npx vitest run --project integration-tests:demo-vault`.

package/templates/default/src/demo-vault.no-app.integration.test.ts.ejs

@@ -1,11 +1,11 @@
+import { registerDemoVaultCoverageSuite } from '@mnaoumov/obsidian-dev-toolkit/demo-vault-coverage';
+import { getRootFolder } from '@mnaoumov/typescript-dev-toolkit/root';
 import process from 'node:process';
-import { registerDemoVaultCoverageSuite } from 'obsidian-dev-utils/script-utils/demo-vault-coverage';
-import { getRootFolder } from 'obsidian-dev-utils/script-utils/root';
 
 // Keeps the in-repo `demo-vault/` honest WITHOUT launching Obsidian. It enforces the authoring convention
 // Every vault owes its readers: an `# H1` and a prose opener on every note, Markdown links rather than
 // Wikilinks (which do not render on GitHub), no `[Docs]` line, every note reachable from `00 Start.md`,
-// And an `.obsidian/app.json` that commits none of the settings obsidian-dev-utils injects at release time.
+// And an `.obsidian/app.json` that commits none of the settings obsidian-dev-toolkit injects at release time.
 //
 // `rootFolder` alone is enough for those. Once your settings surface settles, add a reflection spec so the
 // Suite also fails when a setting is documented nowhere in the vault, or when a note names one that no

package/templates/default/src/docs-showcase.desktop.integration.test.ts.ejs

@@ -0,0 +1,77 @@
+import { readFileSync } from 'node:fs';
+import { evalInObsidian } from 'obsidian-integration-testing';
+import {
+  describe,
+  expect,
+  it
+} from 'vitest';
+
+/**
+ * The part of Obsidian's command registry this suite reads. It is not in the public API, so it is declared here
+ * rather than taken from `obsidian`.
+ */
+interface AppWithCommands {
+  readonly commands: CommandRegistry;
+}
+
+interface CommandEntry {
+  readonly callback?: () => unknown;
+}
+
+interface CommandRegistry {
+  readonly commands: Readonly<Record<string, CommandEntry | undefined>>;
+}
+
+const PLUGIN_ID = '<%= pluginId %>';
+
+interface DocsEntryRecord {
+  readonly id: string;
+  readonly source: string;
+}
+
+// The entries `src/docs/index.ts` registers, one per runnable code block of the docs, read when the suite is collected
+// So that each block is its own test.
+const ENTRY_PATTERN = /^ {4}id: "(?<Id>[^"]+)",\n(?:.*\n){2} {4}source: "(?<Source>[^"]+)"$/gm;
+const entries: DocsEntryRecord[] = [...readFileSync(new URL('docs/index.ts', import.meta.url), 'utf-8').matchAll(ENTRY_PATTERN)]
+  .map((match) => ({ id: match.groups?.['Id'] ?? '', source: match.groups?.['Source'] ?? '' }));
+
+// Runs every `Docs:` command in a real Obsidian and fails on any that throws: the showcase compiles by
+// Construction, and this is what proves each block also RUNS against the app it was written for.
+describe('Developer docs showcase', () => {
+  it('registers a command for every runnable code block', () => {
+    expect(entries.length).toBeGreaterThan(0);
+  });
+
+  for (const entry of entries) {
+    it(`runs docs-${entry.id}, and links its docs page from what it shows`, async () => {
+      const failure = await evalInObsidian({
+        async callback({ app, commandId, source }): Promise<string> {
+          const untypedApp: unknown = app;
+          const command = (untypedApp as AppWithCommands).commands.commands[commandId];
+          if (!command?.callback) {
+            return `There is no command ${commandId}.`;
+          }
+          // The previous block's Notices are still up, and two blocks under one heading share a page.
+          for (const notice of activeDocument.querySelectorAll('.notice')) {
+            notice.remove();
+          }
+          try {
+            await command.callback();
+            // A Notice, a modal and a settings tab are each where some command puts the link; nothing else links the docs.
+            const links = [...activeDocument.querySelectorAll('a')].map((link) => link.getAttribute('href'));
+            return links.includes(source) ? '' : `Nothing ${commandId} showed links ${source}.`;
+          } catch (error) {
+            return error instanceof Error ? error.message : String(error);
+          } finally {
+            // A block that opens a modal leaves it open; close it so it does not sit over the next one.
+            for (const modalContainer of activeDocument.querySelectorAll('.modal-container')) {
+              modalContainer.remove();
+            }
+          }
+        },
+        input: { commandId: `${PLUGIN_ID}:docs-${entry.id}`, source: entry.source }
+      });
+      expect(failure).toBe('');
+    });
+  }
+});

package/templates/default/src/editor-extensions/{sample-state-field.ts_dev-utils.ejs → sample-state-field.ts_framework.ejs}

@@ -3,7 +3,7 @@ import type {
   Transaction
 } from '@codemirror/state';
 import type { DecorationSet } from '@codemirror/view';
-import type { StateFieldSpec } from 'obsidian-dev-utils/codemirror/state-field-spec';
+import type { StateFieldSpec } from '@mnaoumov/obsidian-lib/codemirror/state-field-spec';
 
 import {
   RangeSetBuilder,

package/templates/default/src/main.ts@import_tailwind.ejs

@@ -1 +1 @@
-import './styles/tailwind.generated.css'; // Compiled from ./styles/main.css by `npm run build:styles`. Do not delete this line if you want to have a styles.css file in your build output.
+<%- render('preset') -%>

package/templates/default/src/main.ts@import_tailwind@preset_framework.ejs

@@ -0,0 +1 @@
+import './styles/main.css'; // Compiled through Tailwind CSS by the build. Do not delete this line if you want to have a styles.css file in your build output.

package/templates/default/src/main.ts@import_tailwind@preset_standalone.ejs

@@ -0,0 +1 @@
+import './styles/tailwind.generated.css'; // Compiled from ./styles/main.css by `npm run build:styles`. Do not delete this line if you want to have a styles.css file in your build output.

package/templates/default/src/{plugin-settings-component.test.ts_enhanced.ejs → plugin-settings-component.test.ts_all-in-one.ejs}

@@ -1,8 +1,8 @@
-import type { DataHandler } from 'obsidian-dev-utils/obsidian/data-handler';
-import type { PluginEventMap } from 'obsidian-dev-utils/obsidian/plugin/plugin-event-source';
+import type { DataHandler } from '@mnaoumov/obsidian-lib/data-handler';
+import type { PluginEventMap } from '@mnaoumov/obsidian-lib/plugin/plugin-event-source';
 
-import { AsyncEvents } from 'obsidian-dev-utils/async-events';
-import { noopAsync } from 'obsidian-dev-utils/function';
+import { AsyncEvents } from '@mnaoumov/typescript-lib/async-events';
+import { noopAsync } from '@mnaoumov/typescript-lib/function';
 <%- render('test-imports') -%>
 
 import { PluginSettingsComponent } from './plugin-settings-component.ts';

package/templates/default/src/plugin-settings-component.test.ts_demo.ejs

@@ -1,9 +1,9 @@
-import type { DataHandler } from 'obsidian-dev-utils/obsidian/data-handler';
-import type { PluginEventMap } from 'obsidian-dev-utils/obsidian/plugin/plugin-event-source';
+import type { DataHandler } from '@mnaoumov/obsidian-lib/data-handler';
+import type { PluginEventMap } from '@mnaoumov/obsidian-lib/plugin/plugin-event-source';
 
-import { AsyncEvents } from 'obsidian-dev-utils/async-events';
-import { noopAsync } from 'obsidian-dev-utils/function';
-import { strictProxy } from 'obsidian-dev-utils/strict-proxy';
+import { AsyncEvents } from '@mnaoumov/typescript-lib/async-events';
+import { noopAsync } from '@mnaoumov/typescript-lib/function';
+import { strictProxy } from '@mnaoumov/typescript-test-toolkit/strict-proxy';
 <%- render('test-imports') -%>
 
 import { PluginSettingsComponent } from './plugin-settings-component.ts';

package/templates/default/src/{plugin-settings-component.ts_enhanced.ejs → plugin-settings-component.ts_all-in-one.ejs}

@@ -1,7 +1,7 @@
-import type { DataHandler } from 'obsidian-dev-utils/obsidian/data-handler';
-import type { PluginEventSource } from 'obsidian-dev-utils/obsidian/plugin/plugin-event-source';
+import type { DataHandler } from '@mnaoumov/obsidian-lib/data-handler';
+import type { PluginEventSource } from '@mnaoumov/obsidian-lib/plugin/plugin-event-source';
 
-import { PluginSettingsComponentBase } from 'obsidian-dev-utils/obsidian/components/plugin-settings-component';
+import { PluginSettingsComponentBase } from '@mnaoumov/obsidian-lib/components/plugin-settings-component';
 
 import { PluginSettings } from './plugin-settings.ts';
 

package/templates/default/src/plugin-settings-component.ts_demo.ejs

@@ -1,14 +1,14 @@
 import type {
   PluginSettingsComponentBaseOnSaveSettingsParams,
   ReadonlyPluginSettingsState
-} from 'obsidian-dev-utils/obsidian/components/plugin-settings-component';
-import type { DataHandler } from 'obsidian-dev-utils/obsidian/data-handler';
-import type { PluginEventSource } from 'obsidian-dev-utils/obsidian/plugin/plugin-event-source';
-import type { MaybeReturn } from 'obsidian-dev-utils/type';
-import type { GenericObject } from 'obsidian-dev-utils/type-guards';
+} from '@mnaoumov/obsidian-lib/components/plugin-settings-component';
+import type { DataHandler } from '@mnaoumov/obsidian-lib/data-handler';
+import type { PluginEventSource } from '@mnaoumov/obsidian-lib/plugin/plugin-event-source';
+import type { MaybeReturn } from '@mnaoumov/typescript-lib/type';
+import type { GenericObject } from '@mnaoumov/typescript-lib/type-guards';
 
+import { PluginSettingsComponentBase } from '@mnaoumov/obsidian-lib/components/plugin-settings-component';
 import { Notice } from 'obsidian';
-import { PluginSettingsComponentBase } from 'obsidian-dev-utils/obsidian/components/plugin-settings-component';
 
 import {
   PluginSettings,
@@ -54,7 +54,7 @@ export class PluginSettingsComponent extends PluginSettingsComponentBase<PluginS
     }
   }
 
-  // eslint-disable-next-line obsidian-dev-utils/params-options-name-match -- Override must keep the base param type.
+  // eslint-disable-next-line typescript-dev-toolkit/params-options-name-match -- Override must keep the base param type.
   protected override async onSaveSettings(params: PluginSettingsComponentBaseOnSaveSettingsParams<PluginSettings>): Promise<void> {
     await super.onSaveSettings(params);
     if (params.newState.effectiveValues.textSetting === 'baz' && params.oldState.effectiveValues.textSetting === 'bar') {

package/templates/default/src/{plugin-settings-tab.ts_enhanced.ejs → plugin-settings-tab.ts_all-in-one.ejs}

@@ -1,6 +1,6 @@
 import type { SettingDefinitionItem } from 'obsidian';
 
-import { PluginSettingsTabBase } from 'obsidian-dev-utils/obsidian/plugin/plugin-settings-tab';
+import { PluginSettingsTabBase } from '@mnaoumov/obsidian-lib/plugin/plugin-settings-tab';
 
 import type { PluginSettings } from './plugin-settings.ts';
 

package/templates/default/src/plugin-settings-tab.ts_demo.ejs

@@ -1,6 +1,6 @@
+import { PluginSettingsTabBase } from '@mnaoumov/obsidian-lib/plugin/plugin-settings-tab';
+import { SettingEx } from '@mnaoumov/obsidian-lib/setting-ex';
 import { Notice } from 'obsidian';
-import { PluginSettingsTabBase } from 'obsidian-dev-utils/obsidian/plugin/plugin-settings-tab';
-import { SettingEx } from 'obsidian-dev-utils/obsidian/setting-ex';
 
 import type { PluginSettings } from './plugin-settings.ts';
 
@@ -9,7 +9,7 @@ import { TypedItem } from './plugin-settings.ts';
 /**
  * Built imperatively via `displayLegacy()` rather than declaratively via `getSettingDefinitionItems()`,
  * because this tab exists to show off every `SettingEx` component there is. A real plugin should prefer
- * the declarative form — see the `enhanced` preset.
+ * the declarative form — see the `all-in-one` preset.
  */
 export class PluginSettingsTab extends PluginSettingsTabBase<PluginSettings> {
   public override displayLegacy(): void {

package/templates/default/src/plugin-settings.ts_demo.ejs

@@ -1,5 +1,5 @@
-import type { IsoMonth } from 'obsidian-dev-utils/obsidian/setting-components/month-component';
-import type { IsoWeek } from 'obsidian-dev-utils/obsidian/setting-components/week-component';
+import type { IsoMonth } from '@mnaoumov/obsidian-lib/setting-components/month-component';
+import type { IsoWeek } from '@mnaoumov/obsidian-lib/setting-components/week-component';
 
 import { moment } from 'obsidian';
 

package/templates/default/src/{plugin.ts_enhanced.ejs → plugin.ts_all-in-one.ejs}

@@ -1,11 +1,11 @@
 import type { Editor } from 'obsidian';
 
+import { OpenDemoVaultCommandHandler } from '@mnaoumov/obsidian-lib/command-handlers/open-demo-vault-command-handler';
+import { PluginSettingsTabComponent } from '@mnaoumov/obsidian-lib/components/plugin-settings-tab-component';
+import { PluginDataHandler } from '@mnaoumov/obsidian-lib/data-handler';
+import { PluginBase } from '@mnaoumov/obsidian-lib/plugin/plugin';
+import { PluginEventSourceImpl } from '@mnaoumov/obsidian-lib/plugin/plugin-event-source';
 import { Notice } from 'obsidian';
-import { OpenDemoVaultCommandHandler } from 'obsidian-dev-utils/obsidian/command-handlers/open-demo-vault-command-handler';
-import { PluginSettingsTabComponent } from 'obsidian-dev-utils/obsidian/components/plugin-settings-tab-component';
-import { PluginDataHandler } from 'obsidian-dev-utils/obsidian/data-handler';
-import { PluginBase } from 'obsidian-dev-utils/obsidian/plugin/plugin';
-import { PluginEventSourceImpl } from 'obsidian-dev-utils/obsidian/plugin/plugin-event-source';
 
 <%# Sorted as one group, not written in order: `import2` is composed from the per-answer partials, whose -%>
 <%# order is the order the questions are registered, and the two settings imports sort into the middle of -%>

package/templates/default/src/plugin.ts_all-in-one@import2_css-modules.ejs

@@ -0,0 +1 @@
+import { registerSampleCssModuleCommand } from './styles/sample-css-module-command.ts';

package/templates/default/src/plugin.ts_all-in-one@import2_docs-showcase.ejs

@@ -0,0 +1 @@
+import { registerDocsShowcase } from './docs/entry.js';

package/templates/default/src/plugin.ts_all-in-one@onload_css-modules.ejs

@@ -0,0 +1 @@
+    registerSampleCssModuleCommand(this);

package/templates/default/src/plugin.ts_all-in-one@onload_docs-showcase.ejs

@@ -0,0 +1,3 @@
+
+    // One command per code block of the Obsidian developer docs: `src/docs/README.md` lists them.
+    registerDocsShowcase(this);

package/templates/default/src/plugin.ts_demo.ejs

@@ -1,31 +1,31 @@
+import type { MaybeReturn } from '@mnaoumov/typescript-lib/type';
 import type {
   Editor,
   MarkdownPostProcessorContext,
+  Menu,
   MenuItem,
   ObsidianProtocolData,
   TAbstractFile
 } from 'obsidian';
-import type { MaybeReturn } from 'obsidian-dev-utils/type';
 
+import { OpenDemoVaultCommandHandler } from '@mnaoumov/obsidian-lib/command-handlers/open-demo-vault-command-handler';
+import { PluginSettingsTabComponent } from '@mnaoumov/obsidian-lib/components/plugin-settings-tab-component';
+import { PluginDataHandler } from '@mnaoumov/obsidian-lib/data-handler';
+import { alert } from '@mnaoumov/obsidian-lib/modals/alert';
+import { confirm } from '@mnaoumov/obsidian-lib/modals/confirm';
+import { prompt } from '@mnaoumov/obsidian-lib/modals/prompt';
+import { selectItem } from '@mnaoumov/obsidian-lib/modals/select-item';
+import { PluginBase } from '@mnaoumov/obsidian-lib/plugin/plugin';
+import { PluginEventSourceImpl } from '@mnaoumov/obsidian-lib/plugin/plugin-event-source';
+import {
+  convertAsyncToSync,
+  invokeAsyncSafely
+} from '@mnaoumov/typescript-lib/async';
+import { getDebugger } from '@mnaoumov/typescript-lib/debug';
 import {
   MarkdownView,
-  Menu,
   Notice
 } from 'obsidian';
-import {
-  convertAsyncToSync,
-  invokeAsyncSafely
-} from 'obsidian-dev-utils/async';
-import { getDebugger } from 'obsidian-dev-utils/debug';
-import { OpenDemoVaultCommandHandler } from 'obsidian-dev-utils/obsidian/command-handlers/open-demo-vault-command-handler';
-import { PluginSettingsTabComponent } from 'obsidian-dev-utils/obsidian/components/plugin-settings-tab-component';
-import { PluginDataHandler } from 'obsidian-dev-utils/obsidian/data-handler';
-import { alert } from 'obsidian-dev-utils/obsidian/modals/alert';
-import { confirm } from 'obsidian-dev-utils/obsidian/modals/confirm';
-import { prompt } from 'obsidian-dev-utils/obsidian/modals/prompt';
-import { selectItem } from 'obsidian-dev-utils/obsidian/modals/select-item';
-import { PluginBase } from 'obsidian-dev-utils/obsidian/plugin/plugin';
-import { PluginEventSourceImpl } from 'obsidian-dev-utils/obsidian/plugin/plugin-event-source';
 
 <%# Sorted as one group, not written in order: the `import` section is composed from the per-answer -%>
 <%# partials, whose order is the order the questions are registered. See `sortImports` in -%>

package/templates/default/src/plugin.ts_demo@import_css-modules.ejs

@@ -0,0 +1 @@
+import { registerSampleCssModuleCommand } from './styles/sample-css-module-command.ts';

package/templates/default/src/plugin.ts_demo@onload_css-modules.ejs

@@ -0,0 +1 @@
+    registerSampleCssModuleCommand(this);

package/templates/default/src/plugin.ts_standalone.ejs

@@ -5,11 +5,13 @@ import {
 
 import type { Editor } from 'obsidian';
 
-import {
+<%# Sorted as one group: the per-answer partials contribute imports in question-registration order, -%>
+<%# which is not the order the formatter's import sorting wants. See `sortImports` in `src/templates.ts`. -%>
+<%- sortImports(`import {
   DEFAULT_SETTINGS,
-  <%= pluginShortName %>SettingTab
+  ${pluginShortName}SettingTab
 } from './settings.ts';
-<%- render('import') -%>
+${render('import')}`) -%>
 
 import type { PluginSettings } from './settings.ts';
 

package/templates/default/src/plugin.ts_standalone@import_css-modules.ejs

@@ -0,0 +1 @@
+import { registerSampleCssModuleCommand } from './styles/sample-css-module-command.ts';

package/templates/default/src/plugin.ts_standalone@onload_css-modules.ejs

@@ -0,0 +1 @@
+    registerSampleCssModuleCommand(this);

package/templates/default/src/react-components/{sample-react-component.tsx_dev-utils.ejs → sample-react-component.tsx_framework.ejs}

@@ -1,6 +1,6 @@
 import type { JSX } from 'react';
 
-import { useApp } from 'obsidian-dev-utils/obsidian/react/app-context';
+import { useApp } from '@mnaoumov/obsidian-lib/react/app-context';
 import { useState } from 'react';
 
 export interface SampleReactComponentProps {

package/templates/default/src/styles/css-modules.d.ts.ejs

@@ -1,4 +1,10 @@
-declare module '*.module.css' {
-  const classes: Record<string, string>;
-  export default classes;
+// A CSS module's default export is its scoped class names, keyed by the names the stylesheet uses.
+// TypeScript resolves an import against the FIRST declared pattern among equally long prefixes, so a
+// `declare module '*.css'` read before a `'*.module.css'` one types every CSS module as `any`, and the
+// typed lint rules then reject each use of its class names. It is spelled `*module.css`, without the
+// dot, because the same pattern string would merge with obsidian-dev-toolkit's declaration into a
+// duplicate default export.
+declare module '*module.css' {
+  const classNames: Readonly<Record<string, string>>;
+  export default classNames;
 }

package/templates/default/src/styles/{main.css_dev-utils.ejs → main.css_framework.ejs}

@@ -1,8 +1,8 @@
 <%- render('content') -%>
 /**
  * You can remove this file if you don't need any styles
- * See default library styles: https://github.com/mnaoumov/obsidian-dev-utils/blob/main/src/styles/main.scss
- * See available library css classes: https://github.com/mnaoumov/obsidian-dev-utils/blob/main/src/obsidian/css-class.ts
+ * See default library styles: https://github.com/mnaoumov/obsidian-lib/blob/main/src/styles/main.scss
+ * See available library css classes: https://github.com/mnaoumov/obsidian-lib/blob/main/src/css-class.ts
  */
 
 .<%= pluginId %>.obsidian-dev-utils {

package/templates/default/src/styles/main.module.css.ejs

@@ -1,3 +1,5 @@
-.<%= pluginId %> {
-  /* Add your plugin styles here */
+/* A CSS module: the build scopes every class name in it, and importing it gives the scoped names.
+   `sample-css-module-command.ts` applies this one. */
+.sampleNotice {
+  color: var(--text-accent);
 }

package/templates/default/src/styles/{main.scss_dev-utils.ejs → main.scss_framework.ejs}

@@ -1,7 +1,7 @@
 /**
  * You can remove this file if you don't need any styles
- * See default library styles: https://github.com/mnaoumov/obsidian-dev-utils/blob/main/src/styles/main.scss
- * See available library css classes: https://github.com/mnaoumov/obsidian-dev-utils/blob/main/src/obsidian/css-class.ts
+ * See default library styles: https://github.com/mnaoumov/obsidian-lib/blob/main/src/styles/main.scss
+ * See available library css classes: https://github.com/mnaoumov/obsidian-lib/blob/main/src/css-class.ts
  */
 
 .<%= pluginId %>.obsidian-dev-utils {

package/templates/default/src/styles/sample-css-module-command.ts.ejs

@@ -0,0 +1,30 @@
+import type { Plugin } from 'obsidian';
+
+import { Notice } from 'obsidian';
+
+import classNames from './main.module.css';
+
+/**
+ * Registers the command that shows a notice styled by the sample CSS module.
+ *
+ * This is not decoration, and deleting it does more than remove a command. A CSS module is a JavaScript
+ * module that exports its scoped class names, and a bundler drops an import whose names nothing reads --
+ * vite does, together with the CSS -- so with no real use of the class names the build emits no
+ * `styles.css` while staying green. Whatever replaces this sample, keep something in `src/` applying a
+ * class from the module.
+ */
+export function registerSampleCssModuleCommand(plugin: Plugin): void {
+  plugin.addCommand({
+    callback: () => {
+      showStyledNotice();
+    },
+    id: 'sample-css-module',
+    name: 'Sample CSS module'
+  });
+}
+
+function showStyledNotice(): void {
+  new Notice(createFragment((fragment) => {
+    fragment.createSpan({ cls: classNames['sampleNotice'] ?? '', text: 'Styled by a CSS module' });
+  }));
+}

package/templates/default/src/views/{sample-react-view.tsx_dev-utils.ejs → sample-react-view.tsx_framework.ejs}

@@ -1,7 +1,7 @@
 import type { Root } from 'react-dom/client';
 
+import { AppContext } from '@mnaoumov/obsidian-lib/react/app-context';
 import { ItemView } from 'obsidian';
-import { AppContext } from 'obsidian-dev-utils/obsidian/react/app-context';
 import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
 

package/templates/default/src/wasm/answer.ts_wasm-adapter.ejs

@@ -0,0 +1,18 @@
+import bytes from './module.wasm';
+
+/**
+ * Instantiates the sample WebAssembly module and calls its one export.
+ *
+ * obsidian-dev-toolkit's `wasm` build option inlines the module into `main.js` and makes its import the module's
+ * bytes, whichever bundler builds the plugin.
+ */
+export async function getWasmAnswer(): Promise<number> {
+  // `compile` then `instantiate`, rather than `instantiate(bytes)` in one call: `WebAssembly.Module` is
+  // Declared as an EMPTY interface, so a `Uint8Array` satisfies it too and the one-call form resolves to
+  // The overload taking an already-compiled module -- whose result is a bare `Instance` with no
+  // `instance` property on it, which is TS2339 rather than anything about WebAssembly.
+  const compiled = await WebAssembly.compile(bytes);
+  const instance = await WebAssembly.instantiate(compiled);
+  const answer = instance.exports['answer'] as () => number;
+  return answer();
+}

package/templates/default/{tsconfig.json_dev-utils.ejs → tsconfig.json_framework.ejs}

@@ -1,5 +1,5 @@
 {
-  "extends": "@tsconfig/strictest/tsconfig.json",
+  "extends": <%- _tsconfigExtendsJson %>,
   "compilerOptions": {
     "allowArbitraryExtensions": true,
     "allowImportingTsExtensions": true,
@@ -30,5 +30,5 @@
 <%- render('include') -%>
     "./src/**/*.ts",
     "./src/**/*.tsx"
-  ]
+  ]<%- render('exclude') %>
 }