@engie-group/fluid-design-system-angular
Version:
Fluid Design System Angular
42 lines (41 loc) • 1.96 kB
TypeScript
import { SkeletonContainerProperties } from '@engie-group/fluid-types';
import * as i0 from "@angular/core";
/**
* @deprecated [skeleton-container-removal]
* `SkeletonContainerComponent` will be removed in a future minor version.
* Skeleton shapes are self-contained — place them directly in your template,
* no wrapper component needed.
* If you relied on `aria-hidden="true"` to hide the container,
* use `*ngIf`, `[hidden]`, or your own CSS instead.
*
* @example ISO replacement (identical behaviour)
* Reproduces exactly what the container did: grid layout, gap token,
* screen-reader label.
* ```html
* <!-- Before -->
* <nj-skeleton-container screenReaderLabel="Loading…">
* <nj-skeleton-rectangle scale="base"></nj-skeleton-rectangle>
* <nj-skeleton-circle scale="md"></nj-skeleton-circle>
* </nj-skeleton-container>
*
* <!-- After -->
* <div style="display: grid; gap: var(--nj-semantic-size-spacing-8)">
* <nj-skeleton-rectangle scale="base"></nj-skeleton-rectangle>
* <nj-skeleton-circle scale="md"></nj-skeleton-circle>
* <span class="nj-sr-only">Loading…</span>
* </div>
* ```
*
* @see {@link https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-busy | MDN aria-busy}
* @see {@link https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-live | MDN aria-live}
*/
export declare class SkeletonContainerComponent implements SkeletonContainerProperties {
/**
* Skeleton label (read by screen readers).
* Defaults to "Content is loading"
*/
screenReaderLabel?: SkeletonContainerProperties['screenReaderLabel'];
constructor();
static ɵfac: i0.ɵɵFactoryDeclaration<SkeletonContainerComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<SkeletonContainerComponent, "nj-skeleton-container", never, { "screenReaderLabel": { "alias": "screenReaderLabel"; "required": false; }; }, {}, never, ["*"], true, never>;
}