Skeleton Loading Layer
- Added soft and consistent skeleton effects during card pre-render and render phases to reduce jarring layout jumps
- Preview area now uses a controlled skeleton layer to prevent the "single horizontal line" collapse issue before content loads
- Lightweight overlay added for quick re-renders to make brief refreshes feel smoother
Graceful Image Fallback
- Missing or failed images now display a clean light gray visual placeholder instead of leaving broken gaps
YAML Entity List Recognition
- When pasting complete YAML configurations into the editor, entity arrays are now recognized more reliably and preserved in the config state
External Script Library Support
- Added support for importing external script libraries including Tailwind CSS (twcss), Bootstrap JS Bundle, anime.js, and other utility frameworks
- Skeleton placeholders are shown while scripts load, then smoothly transition to rendered content once ready to prevent style flashing
- Key online JS library URL:
https://cdn.tailwindcss.com - Usage: Add a
scriptsfield to the card configuration with the external script URLs. The system loads them in order during initialization and keeps the skeleton state active until all resources are ready.
type: custom:html-pro-card
scripts:
- https://cdn.tailwindcss.com
content: |
<div class="bg-blue-500 text-white p-4 rounded-lg shadow-md">
<h1 class="text-xl font-bold">Hello Tailwind</h1>
<p class="mt-2">This card is powered by Tailwind CSS utility classes.</p>
</div>
Full Changelog: v3.7...v3.8