Context
Same migration as #81 (loewen-digital/sveltekit-ai-starter-template#4) — replacing a bespoke design system with @webtides/element-library.
button's loading state already renders an internal spinner part, which covers in-button loading. We're missing a standalone loading indicator for section/page-level loading states (e.g. "loading this panel's data"), independent of any button.
Request
- Element: el-spinner (or el-loading-indicator)
- Attribute:
size (small | medium | large, mirroring button's size vocabulary)
- Presentational (role="status" with a visually-hidden label, or an aria-label attribute) so it's announced sensibly to assistive tech
- Reads --el-color-accent and a shared --el-duration-md/--el-ease so it matches a themed page with no extra CSS
Bonus: if button's internal spinner could reuse this as a sub-component (via a part or shared internal helper), that'd keep the two visually in sync automatically.
Workaround
Keeping our existing bespoke Spinner.svelte (a small inline SVG) in the template for now, marked as an UPSTREAM workaround referencing this issue.
Context
Same migration as #81 (loewen-digital/sveltekit-ai-starter-template#4) — replacing a bespoke design system with @webtides/element-library.
button's
loadingstate already renders an internal spinner part, which covers in-button loading. We're missing a standalone loading indicator for section/page-level loading states (e.g. "loading this panel's data"), independent of any button.Request
size(small | medium | large, mirroring button'ssizevocabulary)Bonus: if button's internal spinner could reuse this as a sub-component (via a part or shared internal helper), that'd keep the two visually in sync automatically.
Workaround
Keeping our existing bespoke Spinner.svelte (a small inline SVG) in the template for now, marked as an UPSTREAM workaround referencing this issue.