| @@ -1,7 +1,7 @@ | ||
| 1 | -import blockStyleVariations from '@launch/_data/block-style-variations.json'; | |
| 2 | 1 | import themeJSON from '@launch/_data/theme-processed.json'; |
| 3 | 2 | import { usePreviewIframe } from '@launch/hooks/usePreviewIframe'; |
| 3 | +import { useVibeCss } from '@launch/hooks/useVibeCss'; | |
| 4 | 4 | import { getFontOverrides } from '@launch/lib/preview-helpers'; |
| 5 | 5 | import { hexTomatrixValues, lowerImageQuality } from '@launch/lib/util'; |
| 6 | 6 | import { pageNames } from '@shared/lib/pages'; |
| 7 | 7 | import { BlockPreview } from '@wordpress/block-editor'; |
| @@ -31,14 +31,13 @@ | ||
| 31 | 31 | const [ready, setReady] = useState(false); |
| 32 | 32 | const variation = style?.variation; |
| 33 | 33 | const theme = variation?.settings?.color?.palette?.theme; |
| 34 | 34 | const vibe = useMemo(() => style?.siteStyle?.vibe, [style?.siteStyle?.vibe]); |
| 35 | - const blockVariationCSS = useMemo(() => { | |
| 36 | - if (vibe && blockStyleVariations[vibe]) { | |
| 37 | - return blockStyleVariations[vibe]; | |
| 38 | - } | |
| 39 | - return blockStyleVariations['natural-1'] || ''; | |
| 40 | - }, [vibe]); | |
| 35 | + const { data: vibeCss } = useVibeCss(); | |
| 36 | + const blockVariationCSS = useMemo( | |
| 37 | + () => vibeCss?.[vibe] ?? vibeCss?.['natural-1'] ?? '', | |
| 38 | + [vibe, vibeCss], | |
| 39 | + ); | |
| 41 | 40 | |
| 42 | 41 | const onLoad = useCallback( |
| 43 | 42 | (frame) => { |
| 44 | 43 | // Run this 150 times at an interval of 100ms (15s) |
