@lls/vitescripts 1.0.0-3f6849c24 → 1.0.0-874f17b14

package/package.json

@@ -1,30 +1,30 @@
 {
   "name": "@lls/vitescripts",
-  "version": "1.0.0-3f6849c24",
+  "version": "1.0.0-874f17b14",
   "description": "lls vite plugins",
   "main": "src/index.mjs",
   "files": [
     "src/"
   ],
   "dependencies": {
-    "browserslist": "4.22.1",
+    "lightningcss": "1.22.1",
     "esbuild-plugin-lightningcss-modules": "0.1.1",
-    "lightningcss": "1.22.1"
+    "browserslist": "4.22.1"
   },
   "type": "module",
   "author": "",
   "license": "ISC",
   "devDependencies": {
+    "@lls/eslint-config-lls": "1.1.12",
     "@lls/lls-kit": "23.0.0",
-    "lodash": "4.17.21",
     "nano-staged": "0.8.0",
-    "vitest": "1.0.4"
+    "vitest": "0.34.6"
   },
   "nano-staged": {
-    "*.{js,jsx,mjs,tsx,ts}": "pnpm vitest related --run"
+    "*.{js,jsx,mjs,tsx,ts}": "CONF_ENV=test npx vitest related --run"
   },
   "scripts": {
-    "test": "pnpm vitest run",
-    "precommit": "pnpm nano-staged"
+    "test": "CONF_ENV=test npx vitest run",
+    "precommit": "npx nano-staged"
   }
 }

package/src/index.mjs

@@ -1,6 +1,7 @@
 export { default as llsAssetsPlugin } from './llsAssetsPlugin.mjs'
 export { default as llsLinariaImportsPlugin } from './llsLinariaImportsPlugin.mjs'
 export { default as llsCssSsrCollectPlugin } from './llsCssSsrCollectPlugin.mjs'
+export { default as llsRequirePlugin } from './llsRequirePlugin.mjs'
 export { default as llsSideRefreshMetaPlugin } from './llsSideRefreshMetaPlugin.mjs'
 export { default as llsVitestMockPlugin } from './llsVitestMockPlugin.mjs'
 export { default as llsLadlePlugin } from './llsLadlePlugin.mjs'

package/src/llsAssetsPlugin.mjs

@@ -17,10 +17,6 @@ const llsAssetsPlugin = (llsRepos, publicDir = 'ladleassets', { stripRoot = true
   const fileExists = (s) => new Promise(resolve => fs.access(s, e => resolve(!e)))
   const srcRoot = process.cwd() + '/src'
   const storyRoot = process.cwd() + '/stories'
-
-  if (process.env.VITEST) {
-    return
-  }
   return {
     name: 'lls:copyassets',
     async config () {

package/src/llsRequirePlugin.mjs

@@ -0,0 +1,26 @@
+/**
+ * Plugin using vite-plugin-require-transform, used to transform require syntax to import
+ * Needed when we use viewer in sideRefresh
+ * @returns the plugin with its transform method
+ */
+const llsSsrRequirePlugin = async () => {
+  const VitePluginRequireTransform = await import('vite-plugin-require-transform').then(m => m.default)
+  // Lazy loaded viewer modules that are using require syntax
+  const fileRegex = /(?:(Audio|Playlist|Recorder|Python|Video|QuestionRich|CodemirrorEditor|useLazyModule)\.jsx$|@lls_lls-code)/
+  const back = VitePluginRequireTransform({ fileRegex })
+  return {
+    name: 'lls:require',
+    transform: async function (code, id) {
+      const { transform } = await back
+      if (fileRegex.test(id)) {
+        code = code.replace(/interop\(require\(['"][^'"]+\.browser['"]\)\)/, '() => null')
+      }
+      return {
+        ...await transform.apply(this, [code, id]),
+        map: null
+      }
+    }
+  }
+}
+
+export default llsSsrRequirePlugin

package/src/llsSideRefreshMetaPlugin.mjs

@@ -1,33 +1,32 @@
 import fs from 'fs'
 import path from 'path'
 
-const toLocal = pkgName => new URL(pkgName, import.meta.url).pathname
-const pwd = toLocal('../')
-
 // sideRefreshActiveModules is of the form ['viewer', 'superkit', ...] with 'viewer' if repo launched
 // WITH_VIEWER=1 npm start
 export const makeSideRefreshThemeInterceptor = async (sideRefreshActiveModules) => {
   const parentDir = path.basename(path.dirname(process.cwd()))
   const sideRefreshThemes = {}
-  const cssThemeMap = {
-    viewer: path.join(pwd, '../viewer/src/utils/css-bare.mjs'),
-    // kit: no themes for kit
-    superkit: path.join(pwd, '../superkit/src/internals/utils/css-bare.mjs'),
-    core: path.join(pwd, '../core/src/utils/css-bare.mjs'),
-    audio: path.join(pwd, '../lls-audio/src/utils/css-bare.mjs'),
-    code: path.join(pwd, '../lls-code/src/utils/css-bare.mjs')
-  }
-  await Promise.all(Object.keys(cssThemeMap).map(sideRefreshName => {
-    if (!cssThemeMap[sideRefreshName]) {
-      throw new Error('invalid side refresh name' + sideRefreshName)
+  if (sideRefreshActiveModules.length) {
+    const cssThemeMap = {
+      viewer: '@lls/viewer/lib/css-bare.mjs',
+      // kit: no themes for kit
+      superkit: '@lls/superkit/lib/css-bare.mjs',
+      core: '@lls/core/lib/css-bare.mjs',
+      audio: '@lls/lls-audio/lib/css-bare.mjs',
+      code: '@lls/lls-code/lib/css-bare.mjs'
     }
-    return import(cssThemeMap[sideRefreshName]).then(m => {
-      const mod = m.default || m
-      sideRefreshThemes[`${sideRefreshName}_dark`] = mod.themeIsDarkMode
-      sideRefreshThemes[`${sideRefreshName}_free`] = mod.themeIsFreeMode
-      sideRefreshThemes[`${sideRefreshName}_light`] = mod.themeIsNotDarkMode
-    })
-  }))
+    await Promise.all(sideRefreshActiveModules.map(sideRefreshName => {
+      if (!cssThemeMap[sideRefreshName]) {
+        throw new Error('invalid side refresh name' + sideRefreshName)
+      }
+      return import(cssThemeMap[sideRefreshName]).then(m => {
+        const mod = m.default || m
+        sideRefreshThemes[`${sideRefreshName}_dark`] = mod.themeIsDarkMode
+        sideRefreshThemes[`${sideRefreshName}_free`] = mod.themeIsFreeMode
+        sideRefreshThemes[`${sideRefreshName}_light`] = mod.themeIsNotDarkMode
+      })
+    }))
+  }
   const folderRegex = new RegExp(Object.keys(sideRefreshThemes).map(capName => parentDir + '/' + capName.split('_')[0]).join('|'))
   return (cap, id, next) => {
     const match = id.match(folderRegex)?.[0]
@@ -63,7 +62,7 @@ const llsSideRefreshMetaPlugin = ({ audio: iAudio, viewer: iViewer, superkit: iS
     const projectDir = path.join(projectPath, 'src/')
     const projectDirs = fs.readdirSync(projectDir).map(x => x.replace(/\.[jt]sx?$/, ''))
     return {
-      async resolve(id, from) {
+      async resolve (id, from) {
         if (projectDirs.some(dir => id.startsWith(dir))) {
           try {
             const resolution = await this.resolve(projectDir + id, from, { skipSelf: true })
@@ -84,7 +83,7 @@ const llsSideRefreshMetaPlugin = ({ audio: iAudio, viewer: iViewer, superkit: iS
         ['@' + dirname]: path.join(projectPath, 'src'),
         [aliasImport || '@' + dirname]: path.join(projectPath, 'src')
       },
-      shouldResolve(from) {
+      shouldResolve (from) {
         return from.includes(dirname)
       }
     }
@@ -96,7 +95,7 @@ const llsSideRefreshMetaPlugin = ({ audio: iAudio, viewer: iViewer, superkit: iS
   const viewer = (iViewer && makeResolver('viewer')) || makeNoopResolver()
   const superkit = (iSuperkit && makeResolver('superkit')) || makeNoopResolver()
   const kit = (iKit && makeResolver('lls-kit', '@kit')) || makeNoopResolver()
-  const utils = (iUtils && makeResolver('utils', '@utils')) || makeNoopResolver()
+  const utils = (iUtils && makeResolver('utils', 'commons')) || makeNoopResolver()
   const core = (iCore && makeResolver('core', '@core')) || makeNoopResolver()
   const code = (iCode && makeResolver('lls-code', '@code')) || makeNoopResolver()
   const audio = (iAudio && makeResolver('lls-audio', '@audio')) || makeNoopResolver()
@@ -115,7 +114,7 @@ const llsSideRefreshMetaPlugin = ({ audio: iAudio, viewer: iViewer, superkit: iS
   }))
   const plugin = () => ({
     name: 'lls:sideRefresh',
-    async resolveId(id, from) {
+    async resolveId (id, from) {
       const basename = path.basename(id)
       if (['core.css', 'viewer.css', 'superkit.css', 'lls-kit.css', 'lls-kit-fonts.css', 'lls-audio.css', 'lls-code.css', 'lls-audio.css'].includes(basename)) {
         return VIRTUAL_ID + key(basename)
@@ -129,7 +128,7 @@ const llsSideRefreshMetaPlugin = ({ audio: iAudio, viewer: iViewer, superkit: iS
       if (audio.shouldResolve(from)) { return audio.resolve.call(this, id, from) }
     },
 
-    async load(id) {
+    async load (id) {
       if (loads.has(id)) {
         return loads.get(id)()
       }