feat: standalone mode

integration/apps/standalone-vite/src/main.ts

@@ -0,0 +1,20 @@
+import spriteManifest from './sprite/.svg-sprite/svg-sprite.manifest.js'
+import { getIconsIconHref, iconsSpriteUrl } from './sprite'
+import './style.css'
+
+const check = spriteManifest.icons.find((icon) => icon.name === 'check')
+if (!check || spriteManifest.spriteUrl !== iconsSpriteUrl) {
+  throw new Error('Generated Vite facade and manifest disagree.')
+}
+
+document.querySelector<HTMLDivElement>('#app')!.innerHTML = `
+  <h1>Standalone + Vite</h1>
+  <svg
+    data-testid="icon"
+    data-app="standalone-vite"
+    viewBox="${check.viewBox ?? '0 0 24 24'}"
+    aria-label="Check icon"
+  >
+    <use href="${getIconsIconHref('check')}"></use>
+  </svg>
+`

integration/apps/standalone-vite/src/sprite/.gitignore

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

integration/apps/standalone-vite/src/sprite/index.ts

@@ -0,0 +1,7 @@
+export {
+  getIconsIconHref,
+  iconsIconIds,
+  iconsIconNames,
+  iconsSpriteUrl,
+} from './.svg-sprite/index.js'
+export type { IconsIconName } from './.svg-sprite/index.js'

integration/apps/standalone-vite/src/sprite/svg-sprite.config.ts

@@ -0,0 +1,8 @@
+import { defineSpriteConfig } from '@gromlab/svg-sprites'
+
+export default defineSpriteConfig({
+  mode: 'standalone@vite',
+  name: 'icons',
+  inputFiles: ['../../../../fixtures/icons/check.svg'],
+  generatedNotice: false,
+})

integration/apps/standalone-vite/src/style.css

@@ -0,0 +1,12 @@
+body {
+  margin: 0;
+  padding: 40px;
+  font-family: system-ui, sans-serif;
+}
+
+[data-testid='icon'] {
+  width: 64px;
+  height: 64px;
+  color: #16a34a;
+  --icon-color-1: #16a34a;
+}

integration/apps/standalone-vite/src/vite-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />