mirror of
https://github.com/gromlab-ru/svg-sprites.git
synced 2026-07-22 04:40:17 +03:00
Добавлены exact modes: - vue@vite и vue@webpack - nuxt@vite и nuxt@webpack - svelte@vite, svelte@webpack и sveltekit@vite - angular@application и angular@webpack - astro@vite - solid@vite, solid@webpack и solid-start@vite - preact@vite и preact@webpack - qwik@vite - lit@vite и lit@webpack - alpine@vite и alpine@webpack Для каждого mode реализованы изолированный adapter, нативный framework-компонент, declarations, manifest, CSS и внешний asset URL. Добавлены production integration-стенды с генерацией, typecheck, сборкой и Playwright-проверкой рендера спрайта и Viewer. Обновлены Viewer, RU/EN-гайды, README, technical reference и AI skills. Итоговая матрица включает 29 exact modes. Проверки: - 48 unit-тестов - 29 integration E2E-тестов
33 lines
863 B
JavaScript
33 lines
863 B
JavaScript
import { component$, useSignal, useVisibleTask$ } from '@builder.io/qwik'
|
|
|
|
import { IconsIcon } from './sprite'
|
|
import './style.css'
|
|
|
|
export default component$(() => {
|
|
const viewerHost = useSignal()
|
|
|
|
useVisibleTask$(async () => {
|
|
await import('@gromlab/svg-sprites/viewer/element')
|
|
const viewer = document.createElement('gromlab-sprite-viewer')
|
|
viewer.viewerTitle = 'Qwik Vite Viewer'
|
|
viewer.sources = [() => import('./sprite/.svg-sprite/svg-sprite.manifest.js')]
|
|
viewerHost.value?.append(viewer)
|
|
})
|
|
|
|
return (
|
|
<main>
|
|
<h1>Qwik + Vite</h1>
|
|
<IconsIcon
|
|
data-testid="icon"
|
|
data-app="qwik-vite"
|
|
icon="check"
|
|
aria-label="Check icon"
|
|
width={64}
|
|
height={64}
|
|
style={{ '--icon-color-1': '#16a34a' }}
|
|
/>
|
|
<div class="viewer" ref={viewerHost} />
|
|
</main>
|
|
)
|
|
})
|