@lilaquadrat/design-core 0.2.2 → 0.3.0

package/tooling/vite.js

@@ -9,12 +9,12 @@ import { visualizer } from 'rollup-plugin-visualizer';
 
 import previewBundle, { dropPreviewAssets, previewBuildOptions } from './preview.plugin.js';
 
-function resolveTarget (mode) {
+function resolveTarget(mode) {
 
-  if(mode === 'production') return 'live';
-  if(mode === 'next') return 'next';
+    if(mode === 'production') return 'live';
+    if(mode === 'next') return 'next';
 
-  return 'local';
+    return 'local';
 
 }
 
@@ -23,202 +23,210 @@ function resolveTarget (mode) {
  * override either by keeping a file of the same name in its root, otherwise the
  * package template is used.
  */
-function resolveTemplate (root, name) {
+function resolveTemplate(root, name) {
 
-  const projectTemplate = resolve(root, name);
+    const projectTemplate = resolve(root, name);
 
-  if(existsSync(projectTemplate)) return projectTemplate;
+    if(existsSync(projectTemplate)) return projectTemplate;
 
-  return fileURLToPath(new URL(`../html/${name}`, import.meta.url));
+    return fileURLToPath(new URL(`../html/${name}`, import.meta.url));
 
 }
 
-export function createViteConfig (options) {
+export function createViteConfig(options) {
 
-  /**
+    /**
    * absolute on purpose: the globalVars below are prepended to every less file,
    * including the ones inside the package, where a project relative path would
    * resolve against node_modules
    */
-  const lessDir = resolve(options.root, options.lessDir ?? './src/assets/less');
-  const ssrEntry = options.ssrEntry ?? '/src/server-entry.ts';
-  const ssrFixturesEntry = options.ssrFixturesEntry ?? '/src/ssr-test.fixtures.ts';
+    const lessDir = resolve(options.root, options.lessDir ?? './src/assets/less');
+    const ssrEntry = options.ssrEntry ?? '/src/server-entry.ts';
+    const ssrFixturesEntry = options.ssrFixturesEntry ?? '/src/ssr-test.fixtures.ts';
 
-  return defineConfig((settings) => {
+    return defineConfig((settings) => {
 
-    const target = resolveTarget(settings.mode);
-    const isProduction = target === 'live';
-    /**
+        const target = resolveTarget(settings.mode);
+        const isProduction = target === 'live';
+        /**
      * shareable static module gallery: preview routes, hash history, no auth and
      * inlined assets, so the output runs from file:// without a server
      */
-    const isPreview = settings.mode === 'preview';
-    /**
+        const isPreview = settings.mode === 'preview';
+        /**
      * a second ssr bundle holding nothing but the design's fixtures, so the ssr
      * preflight can read viewData and the registries while still rendering
      * through the real dist/server build
      */
-    const isSsrTest = settings.mode === 'ssr-test';
-    /**
+        const isSsrTest = settings.mode === 'ssr-test';
+        /**
      * builds meant to be handed out rather than debugged: minified, no
      * sourcemaps, no vue dev instrumentation
      */
-    const isOptimized = isProduction || isPreview;
-    const config = options.config[target];
-    const viteConfig = {
-      plugins: [
-        vue(),
-        visualizer(),
-        ...isPreview ? [previewBundle()] : [dropPreviewAssets()]
-      ],
-      base  : './',
-      server: {
-        host: '0.0.0.0',
-      },
-      optimizeDeps: {
-        // design-core ships source, and its less needs the project variables
-        // injected below - a prebundle would not see them.
-        //
-        // @lilaquadrat/frontend rides along because design-core imports it:
-        // prebundling it there and serving it raw here would give the resize and
-        // inview singletons two module identities, and a second scroll listener
-        // with it
-        exclude: ['@lilaquadrat/design-core', '@lilaquadrat/frontend']
-      },
-      build: {
-        cssCodeSplit   : false,
-        cssMinify      : isOptimized,
-        sourcemap      : !isOptimized,
-        minify         : isOptimized,
-        rolldownOptions: {
-          output: {
-            dir          : 'dist/app',
-            // rolldown manual chunking: split deps into a vendor chunk, but
-            // never emit a chunk smaller than minSize - small groups fall back
-            // into the entry instead of producing hundreds of tiny files.
-            codeSplitting: {
-              minSize: 30_000,
-              groups : [
-                { name: 'qrcode', test: /[\\/]node_modules[\\/]qrcode[\\/]/, minSize: 0 },
-                { name: 'vendor', test: /[\\/]node_modules[\\/]/ },
-              ],
+        const isOptimized = isProduction || isPreview;
+        // const config = options.config[target];
+        const viteConfig = {
+            plugins: [
+                vue(),
+                visualizer(),
+                ...isPreview ? [previewBundle()] : [dropPreviewAssets()]
+            ],
+            base: './',
+            server: {
+                host: '0.0.0.0',
             },
-            assetFileNames: (assetInfo) => {
-              if (assetInfo.name?.endsWith('woff') || assetInfo.name?.endsWith('png')) {
-                return '[name][extname]';
-              }
-
-              return '[name]-[hash][extname]';
+            optimizeDeps: {
+                // design-core ships source, and its less needs the project variables
+                // injected below - a prebundle would not see them.
+                //
+                // @lilaquadrat/frontend rides along because design-core imports it:
+                // prebundling it there and serving it raw here would give the resize and
+                // inview singletons two module identities, and a second scroll listener
+                // with it
+                exclude: ['@lilaquadrat/design-core', '@lilaquadrat/frontend']
             },
-            chunkFileNames: '[name]-[hash].js',
-            entryFileNames: '[name]-[hash].js',
-          }
-        }
-      },
-      css: {
-        devSourcemap       : true,
-        preprocessorOptions: {
-          less: {
-            sourceMap : true,
-            globalVars: {
-              globalVariables: `true; @import (reference) "${lessDir}/variables.less";`,
-              globalMixins   : `true; @import (reference) "${lessDir}/mixins.less";`,
-              globalFonts    : `true; @import (reference) "${lessDir}/fonts.less";`,
+            build: {
+                cssCodeSplit: false,
+                cssMinify: isOptimized,
+                sourcemap: !isOptimized,
+                minify: isOptimized,
+                rolldownOptions: {
+                    output: {
+                        dir: 'dist/app',
+                        // rolldown chunking: only auth0 and qrcode get their own files,
+                        // every other dependency stays in the entry. minSize 0 forces a
+                        // group to be captured regardless of size; the global minSize keeps
+                        // automatic grouping from emitting hundreds of tiny chunks.
+                        codeSplitting: {
+                            minSize: 30_000,
+                            groups: [
+                                { name: 'auth0', test: /[\\/]node_modules[\\/]@auth0[\\/]/, minSize: 0 },
+                                { name: 'qrcode', test: /[\\/]node_modules[\\/]qrcode[\\/]/, minSize: 0 },
+                            ],
+                        },
+                        assetFileNames: (assetInfo) => {
+
+                            if (assetInfo.name?.endsWith('woff') || assetInfo.name?.endsWith('png')) {
+
+                                return '[name][extname]';
+                            
+                            }
+
+                            return '[name]-[hash][extname]';
+                        
+                        },
+                        chunkFileNames: '[name]-[hash].js',
+                        entryFileNames: '[name]-[hash].js',
+                    }
+                }
             },
-          }
-        }
-      },
-      resolve: {
-        alias: {
-          '~fonts': resolve(options.root, 'src/assets/fonts'),
-          '@'     : resolve(options.root, 'src'),
-        },
-        /**
+            css: {
+                devSourcemap: true,
+                preprocessorOptions: {
+                    less: {
+                        sourceMap: true,
+                        globalVars: {
+                            globalVariables: `true; @import (reference) "${lessDir}/variables.less";`,
+                            globalMixins: `true; @import (reference) "${lessDir}/mixins.less";`,
+                            globalFonts: `true; @import (reference) "${lessDir}/fonts.less";`,
+                        },
+                    }
+                }
+            },
+            resolve: {
+                alias: {
+                    '~fonts': resolve(options.root, 'src/assets/fonts'),
+                    '@': resolve(options.root, 'src'),
+                },
+                /**
          * a linked @lilaquadrat/design-core resolves these from its own
          * node_modules, which would give the app a second vue and a second
          * pinia - one app instance registering into a store nobody reads.
          * dedupe pins every shared runtime to the project copy.
          */
-        dedupe: [
-          'vue',
-          'vue-router',
-          'vue-i18n',
-          'pinia',
-          // holds a static request cache, so a second copy would cache twice
-          '@lilaquadrat/sdk',
-          // resize and inview are singletons: a second copy means a second
-          // scroll listener and a second set of refs nobody reads
-          '@lilaquadrat/frontend',
-          '@auth0/auth0-spa-js',
-          'axios',
-          'dayjs',
-        ],
-        /**
+                dedupe: [
+                    'vue',
+                    'vue-router',
+                    'vue-i18n',
+                    'pinia',
+                    // holds a static request cache, so a second copy would cache twice
+                    '@lilaquadrat/sdk',
+                    // resize and inview are singletons: a second copy means a second
+                    // scroll listener and a second set of refs nobody reads
+                    '@lilaquadrat/frontend',
+                    '@auth0/auth0-spa-js',
+                    'axios',
+                    'dayjs',
+                ],
+                /**
          * @lilaquadrat/studio is deliberately NOT deduped: it is the backend
          * package and a project may still hold a copy for other reasons, while
          * a second one costs nothing here.
          *
          * @lilaquadrat/interfaces is types only, so it has nothing to dedupe.
          */
-      },
-      define: {
-        '__FRONTEND_CONFIG__'                  : JSON.stringify(config),
-        '__TARGET__'                           : JSON.stringify(target),
-        '__PREVIEW__'                          : JSON.stringify(isPreview),
-        __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: isOptimized ? 'false' : 'true',
-        __VUE_PROD_DEVTOOLS__                  : isOptimized ? 'false' : 'true',
-        ...options.define
-      }
-    };
-
-    if (isPreview) {
-
-      viteConfig.build = previewBuildOptions(viteConfig.build);
-
-    }
-
-    if (settings.isSsrBuild) {
-
-      viteConfig.build = {
-        ...viteConfig.build,
-        rolldownOptions: {
-          input  : isSsrTest ? ssrFixturesEntry : ssrEntry,
-          plugins: isSsrTest ? [] : [
-            {
-              name: 'emit-html-templates',
-              async generateBundle () {
-                const { readFile } = await import('node:fs/promises');
-                const [mailHtml, serverHtml] = await Promise.all([
-                  readFile(resolveTemplate(options.root, 'index.mail.html'), 'utf-8'),
-                  readFile(resolveTemplate(options.root, 'index.server.html'), 'utf-8'),
-                ]);
-
-                this.emitFile({ type: 'asset', fileName: 'index.mail.html', source: mailHtml });
-                this.emitFile({ type: 'asset', fileName: 'index.server.html', source: serverHtml });
-              }
+            },
+            define: {
+                // '__FRONTEND_CONFIG__'                  : JSON.stringify(config),
+                '__TARGET__': JSON.stringify(target),
+                '__PREVIEW__': JSON.stringify(isPreview),
+                __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: isOptimized ? 'false' : 'true',
+                __VUE_PROD_DEVTOOLS__: isOptimized ? 'false' : 'true',
+                ...options.define
+            }
+        };
+
+        if (isPreview) {
+
+            viteConfig.build = previewBuildOptions(viteConfig.build);
+
+        }
+
+        if (settings.isSsrBuild) {
+
+            viteConfig.build = {
+                ...viteConfig.build,
+                rolldownOptions: {
+                    input: isSsrTest ? ssrFixturesEntry : ssrEntry,
+                    plugins: isSsrTest
+                        ? []
+                        : [
+                            {
+                                name: 'emit-html-templates',
+                                async generateBundle() {
+
+                                    const { readFile } = await import('node:fs/promises');
+                                    const [mailHtml, serverHtml] = await Promise.all([
+                                        readFile(resolveTemplate(options.root, 'index.mail.html'), 'utf-8'),
+                                        readFile(resolveTemplate(options.root, 'index.server.html'), 'utf-8'),
+                                    ]);
+
+                                    this.emitFile({ type: 'asset', fileName: 'index.mail.html', source: mailHtml });
+                                    this.emitFile({ type: 'asset', fileName: 'index.server.html', source: serverHtml });
+                                
+                                }
+                            }
+                        ],
+                    output: {
+                        ...viteConfig.build?.rolldownOptions?.output,
+                        codeSplitting: false,
+                        dir: isSsrTest ? 'dist/ssr-test' : 'dist/server',
+                        entryFileNames: '[name].js',
+                    }
+                },
+                ssrManifest: !isSsrTest,
+            }
+            viteConfig.ssr = {
+                target: 'webworker',
+                noExternal: true,
+                external: ['node:stream', 'http', 'https', 'crypto', 'path', 'highlight.js'],
             }
-          ],
-          output: {
-            ...viteConfig.build?.rolldownOptions?.output,
-            codeSplitting       : false,
-            inlineDynamicImports: true,
-            dir                 : isSsrTest ? 'dist/ssr-test' : 'dist/server',
-            entryFileNames      : '[name].js',
-          }
-        },
-        ssrManifest: !isSsrTest,
-      }
-      viteConfig.ssr = {
-        target    : 'webworker',
-        noExternal: true,
-        external  : ['node:stream', 'http', 'https', 'crypto', 'path', 'highlight.js'],
-      }
-
-    }
-
-    return viteConfig;
-
-  });
+
+        }
+
+        return viteConfig;
+
+    });
 
 }
 

package/src/interfaces/EditorConfiguration.interface.ts

@@ -1,15 +0,0 @@
-export interface EditorTitleDescription {
-    short?: string
-    full?: string
-}
-export default interface EditorConfiguration {
-
-    editorUrl?: string
-    breakpointTablet?: string
-    breakpointDesktop?: string
-    breakpointWide?: string
-    preloadImages?: boolean
-    title?: EditorTitleDescription
-    description?: EditorTitleDescription
-
-}

package/tooling/stylelint.config.mjs

@@ -1,24 +0,0 @@
-/** @type {import('stylelint').Config} */
-export default {
-  'extends': [
-    'stylelint-config-html',
-    'stylelint-config-recommended-vue'
-  ],
-  'plugins': [
-    'stylelint-order'
-  ],
-  'overrides': [
-    {
-      'files'       : ['*.vue', '**/*.vue'],
-      'customSyntax': 'postcss-html'
-    },
-    {
-      'files'       : ['*.less', '**/*.less'],
-      'customSyntax': 'postcss-less'
-    }
-  ],
-  'rules': {
-    'media-query-no-invalid'               : null,
-    'declaration-property-value-no-unknown': null
-  }
-}