@stencil/templates 5.0.0-alpha.6 → 5.0.0-alpha.8

package/LICENSE.md

@@ -0,0 +1,27 @@
+The MIT License (MIT)
+
+Copyright (c) 2019-present Drifty Co.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.
+
+-----------------------------------------
+Third-party components, software, and/or libraries (collectively, "components")
+are included under the licenses specified by their authors. For information
+about these third-party licenses, refer to the separate legal notices governing
+such components at NOTICE file at the top level of the package.

package/dist/index.d.mts

@@ -41,4 +41,35 @@ type ProjectTemplateId = (typeof PROJECT_TEMPLATES)[number];
  */
 declare function getTemplatePath(templateId: ProjectTemplateId): string;
 //#endregion
-export { PROJECT_TEMPLATES, type ProjectTemplateId, type StyleExtension, getComponentBoilerplate, getStyleBoilerplate, getTemplatePath, toPascalCase };
+//#region src/project/config.d.ts
+type OutputKey = 'loader' | 'standalone' | 'ssr' | 'ssr-wasm' | 'www';
+type DocKey = 'cem' | 'json' | 'vscode';
+interface PackageJsonFields {
+  type?: 'module';
+  module?: string;
+  types?: string;
+}
+interface ConfigSelections {
+  namespace: string;
+  outputs: ReadonlyArray<OutputKey>;
+  signals: boolean;
+  docs: ReadonlyArray<DocKey>;
+}
+/**
+ * Returns stencil.config.ts source for the given selections, or null if zero-config
+ * covers everything (outputs = [] | ['loader'], no signals, no docs).
+ *
+ * @param sel - Wizard selections to encode into the config file.
+ * @returns TypeScript source string, or null if no config file is needed.
+ */
+declare function generateStencilConfig(sel: ConfigSelections): string | null;
+/**
+ * Returns the package.json distributable fields for the given output selections.
+ * Returns an empty object for www-only (non-publishable app mode).
+ * Priority: loader > standalone > ssr > ssr-wasm.
+ * @param outputs - Wizard output selections to encode into package.json.
+ * @returns An object with the fields to write into package.json.
+ */
+declare function generatePackageJsonFields(outputs: ReadonlyArray<OutputKey>): PackageJsonFields;
+//#endregion
+export { type ConfigSelections, type DocKey, type OutputKey, PROJECT_TEMPLATES, type PackageJsonFields, type ProjectTemplateId, type StyleExtension, generatePackageJsonFields, generateStencilConfig, getComponentBoilerplate, getStyleBoilerplate, getTemplatePath, toPascalCase };

package/dist/index.mjs

@@ -65,4 +65,72 @@ function getTemplatePath(templateId) {
 	return join(__dirname, "..", "templates", "project", templateId);
 }
 //#endregion
-export { PROJECT_TEMPLATES, getComponentBoilerplate, getStyleBoilerplate, getTemplatePath, toPascalCase };
+//#region src/project/config.ts
+/**
+* Returns stencil.config.ts source for the given selections, or null if zero-config
+* covers everything (outputs = [] | ['loader'], no signals, no docs).
+*
+* @param sel - Wizard selections to encode into the config file.
+* @returns TypeScript source string, or null if no config file is needed.
+*/
+function generateStencilConfig(sel) {
+	if ((sel.outputs.length === 0 || sel.outputs.length === 1 && sel.outputs[0] === "loader") && !sel.signals && sel.docs.length === 0) return null;
+	const outputLines = [];
+	if (sel.outputs.includes("loader") || sel.outputs.length === 0) outputLines.push(`    { type: 'loader-bundle' },`);
+	if (sel.outputs.includes("standalone")) outputLines.push(`    { type: 'standalone' },`);
+	if (sel.outputs.includes("ssr")) outputLines.push(`    { type: 'ssr' },`);
+	if (sel.outputs.includes("ssr-wasm")) outputLines.push(`    { type: 'ssr-wasm' },`);
+	if (sel.outputs.includes("www")) outputLines.push(`    { type: 'www' },`);
+	if (sel.docs.includes("cem")) outputLines.push(`    { type: 'docs-custom-elements-manifest', file: 'custom-elements.json' },`);
+	if (sel.docs.includes("json")) outputLines.push(`    { type: 'docs-json', file: 'docs/api.json' },`);
+	if (sel.docs.includes("vscode")) outputLines.push(`    { type: 'docs-vscode', file: 'vscode-data.json' },`);
+	const parts = [
+		`import type { Config } from '@stencil/core';`,
+		``,
+		`export const config: Config = {`,
+		`  namespace: '${sel.namespace}',`
+	];
+	if (outputLines.length > 0) {
+		parts.push(`  outputTargets: [`);
+		parts.push(...outputLines);
+		parts.push(`  ],`);
+	}
+	if (sel.signals) parts.push(`  signalBacking: true,`);
+	parts.push(`};`);
+	parts.push(``);
+	return parts.join("\n");
+}
+/**
+* Returns the package.json distributable fields for the given output selections.
+* Returns an empty object for www-only (non-publishable app mode).
+* Priority: loader > standalone > ssr > ssr-wasm.
+* @param outputs - Wizard output selections to encode into package.json.
+* @returns An object with the fields to write into package.json.
+*/
+function generatePackageJsonFields(outputs) {
+	const isDefault = outputs.length === 0;
+	const has = (key) => outputs.includes(key);
+	if (isDefault || has("loader")) return {
+		type: "module",
+		module: "./dist/loader-bundle/index.js",
+		types: "./dist/types/loader.d.ts"
+	};
+	if (has("standalone")) return {
+		type: "module",
+		module: "./dist/standalone/index.js",
+		types: "./dist/types/standalone.d.ts"
+	};
+	if (has("ssr")) return {
+		type: "module",
+		module: "./dist/ssr/index.js",
+		types: "./dist/ssr/index.d.ts"
+	};
+	if (has("ssr-wasm")) return {
+		type: "module",
+		module: "./dist/ssr-wasm/index.js",
+		types: "./dist/ssr-wasm/plugin.d.ts"
+	};
+	return {};
+}
+//#endregion
+export { PROJECT_TEMPLATES, generatePackageJsonFields, generateStencilConfig, getComponentBoilerplate, getStyleBoilerplate, getTemplatePath, toPascalCase };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/templates",
-  "version": "5.0.0-alpha.6",
+  "version": "5.0.0-alpha.8",
   "description": "Project and generate templates for Stencil",
   "keywords": [
     "scaffolding",
@@ -27,17 +27,17 @@
       "import": "./dist/index.mjs"
     }
   },
-  "scripts": {
-    "build": "tsdown",
-    "test": "vitest run --passWithNoTests",
-    "typecheck": "tsc --noEmit"
-  },
   "devDependencies": {
-    "tsdown": "catalog:",
-    "typescript": "catalog:",
-    "vitest": "catalog:"
+    "tsdown": ">=0.21.0 <1.0.0",
+    "typescript": ">4.0.0 <7.0.0",
+    "vitest": "^4.1.7"
   },
   "volta": {
     "extends": "../../package.json"
+  },
+  "scripts": {
+    "build": "tsdown",
+    "test": "vitest run --passWithNoTests",
+    "typecheck": "tsc --noEmit"
   }
-}
+}

package/templates/project/component-starter/package.json

@@ -6,16 +6,13 @@
   "files": [
     "dist/"
   ],
-  "main": "dist/loader-bundle/index.cjs",
-  "module": "dist/loader-bundle/index.js",
-  "types": "dist/types/index.d.ts",
   "scripts": {
     "build": "stencil build",
     "dev": "stencil build --dev --watch --serve",
     "generate": "stencil generate"
   },
   "devDependencies": {
-    "@stencil/core": "^5.0.0"
+    "@stencil/core": "{{STENCIL_VERSION}}"
   },
-  "collection": "dist/collection/collection-manifest.json"
+  "collection": "./dist/collection/collection-manifest.json"
 }

package/templates/project/component-starter/src/components/my-component/my-component.tsx

@@ -1,4 +1,6 @@
-import { Component, Host } from '@stencil/core';
+import { Component, Prop } from '@stencil/core';
+
+import { format } from '../../utils/utils';
 
 @Component({
   tag: 'my-component',
@@ -6,11 +8,20 @@ import { Component, Host } from '@stencil/core';
   encapsulation: { type: 'shadow' },
 })
 export class MyComponent {
+  /** The first name */
+  @Prop() first?: string;
+
+  /** The middle name */
+  @Prop() middle?: string;
+
+  /** The last name */
+  @Prop() last?: string;
+
+  private getText(): string {
+    return format(this.first, this.middle, this.last);
+  }
+
   render() {
-    return (
-      <Host>
-        <slot></slot>
-      </Host>
-    );
+    return <div>Hello, World! I'm {this.getText()}</div>;
   }
 }

package/templates/project/component-starter/src/utils/utils.ts

@@ -0,0 +1,3 @@
+export function format(first?: string, middle?: string, last?: string): string {
+  return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');
+}