feat: добавить серверную генерацию спрайтов

integration/apps/vue-webpack/src/App.vue

@@ -1,17 +1,19 @@
 <script setup>
 import '@gromlab/svg-sprites/viewer/element'
 
-import { IconsIcon } from './sprite/index.js'
+import { AppIcon } from './app-icons/index.js'
+import { RemoteAppIcon } from './remote-app-icons/index.js'
 
 const viewerSources = [
-  () => import('./sprite/.svg-sprite/svg-sprite.manifest.js'),
+  () => import('./app-icons/.svg-sprite/svg-sprite.manifest.js'),
+  () => import('./remote-app-icons/.svg-sprite/svg-sprite.manifest.js'),
 ]
 </script>
 
 <template>
   <main>
     <h1>Vue + Webpack</h1>
-    <IconsIcon
+    <AppIcon
       data-testid="icon"
       data-app="vue-webpack"
       icon="check"
@@ -20,6 +22,15 @@ const viewerSources = [
       height="64"
       style="--icon-color-1: #16a34a"
     />
+    <RemoteAppIcon
+      data-testid="remote-icon"
+      data-app="vue-webpack-remote"
+      icon="check"
+      aria-label="Remote check icon"
+      width="64"
+      height="64"
+      style="--icon-color-1: #16a34a"
+    />
     <gromlab-sprite-viewer
       :sources="viewerSources"
       viewer-title="Vue Webpack Viewer"

integration/apps/vue-webpack/src/app-icons/svg-sprite.config.ts

@@ -2,7 +2,7 @@ import { defineSpriteConfig } from '@gromlab/svg-sprites'
 
 export default defineSpriteConfig({
   mode: 'vue@webpack',
-  name: 'icons',
+  name: 'app',
   input: '../../../../fixtures/icons/check.svg',
   generatedNotice: false,
 })

integration/apps/vue-webpack/src/generated-contract.typecheck.ts

@@ -1,15 +1,30 @@
-import { IconsIcon } from './sprite/.svg-sprite/index.js'
-import type { IconsIconName, IconsIconProps } from './sprite/.svg-sprite/index.js'
+import { AppIcon } from './app-icons/.svg-sprite/index.js'
+import type { AppIconName, AppIconProps } from './app-icons/.svg-sprite/index.js'
+import { RemoteAppIcon } from './remote-app-icons/.svg-sprite/index.js'
+import type {
+  RemoteAppIconName,
+  RemoteAppIconProps,
+} from './remote-app-icons/.svg-sprite/index.js'
 
-const iconName: IconsIconName = 'check'
-const iconProps: IconsIconProps = {
+const iconName: AppIconName = 'check'
+const iconProps: AppIconProps = {
   icon: iconName,
   width: 64,
   style: { '--icon-color-1': '#16a34a' },
 }
+const remoteIconName: RemoteAppIconName = 'check'
+const remoteIconProps: RemoteAppIconProps = {
+  icon: remoteIconName,
+  width: 64,
+  style: { '--icon-color-1': '#16a34a' },
+}
 
-void [IconsIcon, iconProps]
+void [AppIcon, RemoteAppIcon, iconProps, remoteIconProps]
 
 // @ts-expect-error Generated icon names form a literal union.
-const missingIcon: IconsIconName = 'missing'
+const missingIcon: AppIconName = 'missing'
 void missingIcon
+
+// @ts-expect-error Generated remote icon names form a literal union.
+const missingRemoteIcon: RemoteAppIconName = 'missing'
+void missingRemoteIcon

integration/apps/vue-webpack/src/remote-app-icons/.gitignore

@@ -0,0 +1,2 @@
+# @generated by @gromlab/svg-sprites. Do not edit.
+/.svg-sprite/

integration/apps/vue-webpack/src/remote-app-icons/index.d.ts

@@ -0,0 +1 @@
+export * from './.svg-sprite/index.js'

integration/apps/vue-webpack/src/remote-app-icons/index.js

@@ -0,0 +1 @@
+export * from './.svg-sprite/index.js'

integration/apps/vue-webpack/src/remote-app-icons/svg-sprite.config.js

@@ -0,0 +1,6 @@
+export default {
+  mode: 'vue@webpack',
+  source: 'remote',
+  input: process.env.SVG_SPRITE_REMOTE_MANIFEST_URL
+    ?? '../../../standalone-server/cases/mixed-input/.svg-sprite/svg-sprite.manifest.json',
+}