diff --git a/docs/package.json b/docs/package.json index 9fe70f663905..ec9a6ddce954 100644 --- a/docs/package.json +++ b/docs/package.json @@ -46,7 +46,7 @@ "@angular/router": "catalog:", "@angular/ssr": "catalog:", "@angular/youtube-player": "workspace:*", - "@stackblitz/sdk": "^1.5.2", + "@stackblitz/sdk": "^1.11.0", "moment": "^2.29.1", "path-normalize": "^6.0.13", "rxjs": "catalog:", diff --git a/docs/src/app/shared/stackblitz/stackblitz-writer.spec.ts b/docs/src/app/shared/stackblitz/stackblitz-writer.spec.ts index 82ab6bb89225..772427a49b4f 100644 --- a/docs/src/app/shared/stackblitz/stackblitz-writer.spec.ts +++ b/docs/src/app/shared/stackblitz/stackblitz-writer.spec.ts @@ -113,7 +113,8 @@ describe('StackBlitzWriter', () => { expect(openProjectSpy).toHaveBeenCalledTimes(1); expect(openProjectSpy).toHaveBeenCalledWith(jasmine.objectContaining({files: expectedFiles}), { - openFile: 'src/app/test.ts', + openFile: 'src/example/test.ts', + startScript: 'start', }); })); }); diff --git a/docs/src/app/shared/stackblitz/stackblitz-writer.ts b/docs/src/app/shared/stackblitz/stackblitz-writer.ts index 1dcd5c1c5bd5..c62142999dd1 100644 --- a/docs/src/app/shared/stackblitz/stackblitz-writer.ts +++ b/docs/src/app/shared/stackblitz/stackblitz-writer.ts @@ -39,8 +39,6 @@ const TEMPLATE_PATH = '/assets/stackblitz/'; * file from the boilerplate. */ export const TEMPLATE_FILES = [ - '.gitignore', - '.stackblitzrc', 'angular.json', 'karma.conf.js', 'package.json', @@ -50,13 +48,10 @@ export const TEMPLATE_FILES = [ 'tsconfig.spec.json', 'src/index.html', 'src/main.ts', - 'src/styles.scss', + 'src/styles.css', 'src/test.ts', ]; -const PROJECT_TAGS = ['angular', 'material', 'cdk', 'web', 'example']; -const PROJECT_TEMPLATE = 'node'; - /** * Type describing an in-memory file dictionary, representing a * directory and its contents. @@ -83,7 +78,7 @@ export class StackBlitzWriter { // and the file requests can cause excessive change detections. return this._ngZone.runOutsideAngular(async () => { const files = await this._buildInMemoryFileDictionary(data, exampleId, isTest); - const exampleMainFile = `src/app/${data.indexFilename}`; + const exampleMainFile = `src/example/${data.indexFilename}`; return () => { this._openStackBlitz({ @@ -91,6 +86,7 @@ export class StackBlitzWriter { title: `Angular Components - ${data.description}`, description: `${data.description}\n\nAuto-generated from: https://material.angular.dev`, openFile: exampleMainFile, + startScript: isTest ? 'test' : 'start', }); }; }); @@ -102,21 +98,26 @@ export class StackBlitzWriter { description, openFile, files, + startScript, }: { title: string; description: string; openFile: string; files: FileDictionary; + startScript: string; }): void { stackblitz.openProject( { title, files, description, - template: PROJECT_TEMPLATE, - tags: PROJECT_TAGS, + template: 'node', + tags: ['angular', 'material', 'cdk', 'web', 'example'], + }, + { + openFile, + startScript, }, - {openFile}, ); } @@ -203,11 +204,6 @@ export class StackBlitzWriter { fileContent = fileContent .replace(/material-docs-example/g, data.selectorName) .replace(/\${title}/g, data.description); - } else if (fileName === '.stackblitzrc') { - fileContent = fileContent.replace( - /\${startCommand}/, - isTest ? 'npm run test' : 'npm run start', - ); } else if (fileName === 'src/main.ts') { const mainComponentName = data.componentNames[0]; diff --git a/docs/src/assets/stackblitz/.gitignore b/docs/src/assets/stackblitz/.gitignore deleted file mode 100644 index 105c00f22e08..000000000000 --- a/docs/src/assets/stackblitz/.gitignore +++ /dev/null @@ -1,46 +0,0 @@ -# See http://help.github.com/ignore-files/ for more about ignoring files. - -# compiled output -/dist -/tmp -/out-tsc -# Only exists if Bazel was run -/bazel-out - -# dependencies -/node_modules - -# profiling files -chrome-profiler-events*.json - -# IDEs and editors -/.idea -.project -.classpath -.c9/ -*.launch -.settings/ -*.sublime-workspace - -# IDE - VSCode -.vscode/* -!.vscode/settings.json -!.vscode/tasks.json -!.vscode/launch.json -!.vscode/extensions.json -.history/* - -# misc -/.angular/cache -/.sass-cache -/connect.lock -/coverage -/libpeerconnection.log -npm-debug.log -yarn-error.log -testem.log -/typings - -# System Files -.DS_Store -Thumbs.db diff --git a/docs/src/assets/stackblitz/.stackblitzrc b/docs/src/assets/stackblitz/.stackblitzrc deleted file mode 100644 index 839f0a257f66..000000000000 --- a/docs/src/assets/stackblitz/.stackblitzrc +++ /dev/null @@ -1,4 +0,0 @@ -{ - "installDependencies": true, - "startCommand": "${startCommand}" -} diff --git a/docs/src/assets/stackblitz/angular.json b/docs/src/assets/stackblitz/angular.json index 1f72421563cf..50b3897f59a6 100644 --- a/docs/src/assets/stackblitz/angular.json +++ b/docs/src/assets/stackblitz/angular.json @@ -28,12 +28,9 @@ "browser": "src/main.ts", "polyfills": ["zone.js", "@angular/localize/init"], "tsConfig": "tsconfig.app.json", - "inlineStyleLanguage": "scss", + "inlineStyleLanguage": "css", "assets": ["src/assets"], - "styles": ["src/styles.scss"], - "stylePreprocessorOptions": { - "includePaths": ["node_modules/"] - }, + "styles": ["src/styles.css", "@angular/material/prebuilt-themes/azure-blue.css"], "scripts": [] }, "configurations": { @@ -92,12 +89,9 @@ "polyfills": ["zone.js", "zone.js/testing"], "tsConfig": "tsconfig.spec.json", "karmaConfig": "karma.conf.js", - "inlineStyleLanguage": "scss", + "inlineStyleLanguage": "css", "assets": ["src/assets"], - "stylePreprocessorOptions": { - "includePaths": ["node_modules/"] - }, - "styles": ["src/styles.scss"], + "styles": ["src/styles.css", "@angular/material/prebuilt-themes/azure-blue.css"], "scripts": [] } } diff --git a/docs/src/assets/stackblitz/src/styles.css b/docs/src/assets/stackblitz/src/styles.css new file mode 100644 index 000000000000..0b9b177cade2 --- /dev/null +++ b/docs/src/assets/stackblitz/src/styles.css @@ -0,0 +1,10 @@ +body { + font-family: Roboto, 'Helvetica Neue', sans-serif; + margin: 0; + padding: 30px; + height: 100%; +} + +html { + height: 100%; +} diff --git a/docs/src/assets/stackblitz/src/styles.scss b/docs/src/assets/stackblitz/src/styles.scss deleted file mode 100644 index 125bc0b99e3f..000000000000 --- a/docs/src/assets/stackblitz/src/styles.scss +++ /dev/null @@ -1,22 +0,0 @@ -@use '@angular/material' as mat; - -body { - font-family: Roboto, 'Helvetica Neue', sans-serif; - margin: 0; - padding: 30px; - height: 100%; - - @include mat.theme(( - color: ( - theme-type: light, - primary: mat.$azure-palette, - tertiary: mat.$blue-palette, - ), - typography: Roboto, - density: 0, - )); -} - -html { - height: 100%; -} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9920c3b441b9..238c45ce6e09 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -408,7 +408,7 @@ importers: specifier: workspace:* version: link:../src/youtube-player '@stackblitz/sdk': - specifier: ^1.5.2 + specifier: ^1.11.0 version: 1.11.0 moment: specifier: ^2.29.1