Shared style atoms for the `NoData` (empty-state) component family, providing a single source of truth for icon sizing and info-block container surface styles via CVA variants. ## Key Components - **`noDataIconClasses`** — Static class string that sizes the leading icon glyph (`16px` mobile, `24px` on `md+`) using `[&_svg]` selectors. Color is intentionally omitted so the icon inherits the current text color. - **`noDataActionsVariants`** — CVA factory for the info-block group container. Currently exposes a single `outline` variant: a transparent, bordered, rounded panel with `overflow-hidden` to keep inner blocks square. - **`NoDataActionsVariant`** — Extracted union type of valid `variant` values for `noDataActionsVariants`, useful for prop typing in consumer components. ## Usage Example ```typescript import { noDataIconClasses, noDataActionsVariants, type NoDataActionsVariant, } from "./no-data-styles" // Apply icon sizing to any SVG-bearing element // Resolve container classes (defaults to "outline" variant)
{/* info blocks */}
// Explicitly pass a variant const variant: NoDataActionsVariant = "outline"
{/* info blocks */}
``` ## Notes - The `outline` variant is the default; new surface looks (e.g. `ghost`, `filled`) can be added to the `variants` map without modifying consuming markup. - `overflow-hidden` on the container ensures only the outermost wrapper has rounded corners — inner sibling blocks remain square-cornered.