From 62bfcbd6a01690d9be5a07dd1b94c771d938d3c2 Mon Sep 17 00:00:00 2001 From: Dan Ichim Date: Thu, 2 Jul 2026 11:44:22 +0300 Subject: [PATCH 1/7] add interactive spotlight sample --- README.md | 5 +++- scripts/make-runner.mjs | 29 +++++++++++++++++++ scripts/prepare-raw.mjs | 1 + src/components/Page/[...data].astro | 2 ++ src/components/SampleEmbed/SampleEmbed.jsx | 13 +++++++++ .../SampleEmbed/SampleEmbed.module.css | 6 ++++ .../SampleEmbed/SampleEmbedSection.astro | 15 ++++++++++ src/components/index.js | 4 +++ src/config/sampleEmbeds.json | 22 ++++++++++++++ src/utils/sampleEmbeds.js | 24 +++++++++++++++ 10 files changed, 120 insertions(+), 1 deletion(-) create mode 100644 src/components/SampleEmbed/SampleEmbed.jsx create mode 100644 src/components/SampleEmbed/SampleEmbed.module.css create mode 100644 src/components/SampleEmbed/SampleEmbedSection.astro create mode 100644 src/config/sampleEmbeds.json create mode 100644 src/utils/sampleEmbeds.js diff --git a/README.md b/README.md index edaa692a..cb8b00be 100644 --- a/README.md +++ b/README.md @@ -47,6 +47,9 @@ npm run build Copies of the source of Enact and other related libraries are placed into the `raw/` directory. If you need to link local copies, link them into that directory. E.g.: +`parse-docs` also clones `enactjs/samples` (branch `develop`) into `raw/samples`. Embedded samples are +configured in `src/config/sampleEmbeds.json` and built by `make-runner` into `public/`. + ## Check Broken Links To check the broken links, follow the steps below: @@ -54,4 +57,4 @@ To check the broken links, follow the steps below: 1. `npm run parse-docs` 2. `npm run parse-pages` 3. `npm run build` -4. `npm run check-links` \ No newline at end of file +4. `npm run check-links` diff --git a/scripts/make-runner.mjs b/scripts/make-runner.mjs index ff8a32a1..3e3e8f52 100644 --- a/scripts/make-runner.mjs +++ b/scripts/make-runner.mjs @@ -1,8 +1,12 @@ import fs from 'fs'; +import path from 'path'; import parseArgs from 'minimist'; import shell from 'shelljs'; import {errorExit} from './utils.mjs'; import allLibraries from '../src/data/libraryDescription.json' with {type: 'json'}; +import sampleEmbeds from '../src/config/sampleEmbeds.json' with {type: 'json'}; + +await import('./prepare-raw.mjs'); const includes = ['core', 'moonstone', 'sandstone', 'limestone', 'agate'], themes = Object.keys(allLibraries).filter(name => includes.includes(name)); @@ -66,3 +70,28 @@ themes.forEach(theme => { fs.writeFileSync(`${ilibDst}/ilibmanifest.json`, JSON.stringify({files: copiedIlib})); } }); + +sampleEmbeds.forEach(({id, build}) => { + const {src, output} = build; + + if (!fs.existsSync(src)) { + return; + } + + if (!fs.existsSync(`${src}/node_modules`)) { + if (shell.exec(`cd ${src} && npm install`).code !== 0) { + errorExit(`Error installing dependencies for ${id}. Aborting.`); + } + } + + if (fast && fs.existsSync(`${output}/index.html`)) { + // eslint-disable-next-line no-console + console.log(`Sample ${id} exists, skipping build. Use "npm run make-runner" to build`); + } else { + const relOut = path.relative(src, output).split(path.sep).join('/'); + const command = `cd ${src} && ${enactCmd} pack -p -o ${relOut}`; + if (shell.exec(command, {async: false}).code !== 0) { + errorExit(`Error building ${id}. Aborting.`); + } + } +}); diff --git a/scripts/prepare-raw.mjs b/scripts/prepare-raw.mjs index 05502192..592f6a36 100644 --- a/scripts/prepare-raw.mjs +++ b/scripts/prepare-raw.mjs @@ -40,6 +40,7 @@ const rebuild = args['rebuild-raw'], copyGitHub('enactjs/enact', 'raw/enact', rebuild, args['enact-branch'], args['ssh']); copyGitHub('enactjs/cli', 'raw/cli', rebuild, args['cli-branch'], args['ssh']); copyGitHub('enactjs/eslint-config-enact', 'raw/eslint-config-enact', rebuild, args['eslint-config-branch'], args['ssh']); +copyGitHub('enactjs/samples', 'raw/samples', rebuild, 'develop', args['ssh']); if (extraRepos) { const repos = extraRepos.split(','); diff --git a/src/components/Page/[...data].astro b/src/components/Page/[...data].astro index d0bbd06d..a345abe1 100644 --- a/src/components/Page/[...data].astro +++ b/src/components/Page/[...data].astro @@ -10,6 +10,7 @@ import { MemberObjectTypeDef, MemberProperties, ModuleImport, + SampleEmbedSection, } from '../index'; import {getJSONData, getMembers} from "./utils"; @@ -36,6 +37,7 @@ const [membersData, typeDefinitionsData] = getMembers(data);
Loading Live Preview
)} + diff --git a/src/components/SampleEmbed/SampleEmbed.jsx b/src/components/SampleEmbed/SampleEmbed.jsx new file mode 100644 index 00000000..70cd1c1e --- /dev/null +++ b/src/components/SampleEmbed/SampleEmbed.jsx @@ -0,0 +1,13 @@ +import {withBase} from '../../utils/utils'; +import css from './SampleEmbed.module.css'; + +const SampleEmbed = ({src, title = 'Sample preview'}) => ( +