{"version":3,"file":"eui-components-eui-skeleton.mjs","sources":["../../eui-skeleton/eui-skeleton.component.ts","../../eui-skeleton/index.ts","../../eui-skeleton/eui-components-eui-skeleton.ts"],"sourcesContent":["import {\n    Component,\n    HostBinding,\n    ChangeDetectionStrategy,\n    booleanAttribute,\n    inject,\n    input,\n} from '@angular/core';\n\nimport { BaseStatesDirective } from '@eui/components/shared';\n\n/**\n * @description\n * A skeleton loading component that provides various shapes and sizes for placeholder content.\n * Used to indicate loading states in the UI with different geometric shapes.\n *\n * @usageNotes\n * ### Basic Usage\n * ```html\n * <!-- Circle skeleton -->\n * <eui-skeleton [circle]=\"true\" euiSizeM />\n *\n * <!-- Line skeleton -->\n * <eui-skeleton [line]=\"true\" euiSizeL />\n *\n * <!-- Rectangle skeleton -->\n * <eui-skeleton [rectangle]=\"true\" euiSizeXL />\n * ```\n *\n * ### Accessibility\n * - Use `aria-busy=\"true\"` on parent container while loading\n * - Provide `aria-live=\"polite\"` region for content updates\n * - Consider adding visually hidden text describing loading state\n *\n * ### Notes\n * - Only one shape should be active at a time (circle, line, square, or rectangle)\n * - Combine with size variants (euiSizeXS, euiSizeS, euiSizeM, euiSizeL, euiSizeXL) for different dimensions\n * - Use euiRounded for rounded corners on rectangle/square shapes\n */\n@Component({\n    template: '',\n    selector: 'eui-skeleton',\n    styleUrl: 'eui-skeleton.scss',\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    hostDirectives: [\n        {\n            directive: BaseStatesDirective,\n            inputs: [\n                'euiSizeXS',\n                'euiSizeS',\n                'euiSizeM',\n                'euiSizeL',\n                'euiSizeXL',\n                'euiRounded',\n                'euiSizeVariant',\n            ],\n        },\n    ],\n})\nexport class EuiSkeletonComponent {\n    /**\n     * @description\n     * Computes and returns the CSS classes for the skeleton component\n     * by delegating to the private getCssClasses method.\n     *\n     * @returns {string} Space-separated string of CSS class names\n     */\n    @HostBinding('class')\n    public get cssClasses(): string {\n        return this.getCssClasses();\n    }\n\n    /**\n     * @description\n     * When true, renders the skeleton as a circle shape\n     * @default false\n     */\n    circle = input(false, { transform: booleanAttribute });\n\n    /**\n     * @description\n     * When true, renders the skeleton as a line shape\n     * @default false\n     */\n    line = input(false, { transform: booleanAttribute });\n\n    /**\n     * @description\n     * When true, renders the skeleton as a square shape\n     * @default false\n     */\n    square = input(false, { transform: booleanAttribute });\n\n    /**\n     * @description\n     * When true, renders the skeleton as a rectangle shape\n     * @default false\n     */\n    rectangle = input(false, { transform: booleanAttribute });\n\n    /**\n     * @description\n     * Instance of BaseStatesDirective used to manage component states\n     */\n    public baseStatesDirective: BaseStatesDirective = inject(BaseStatesDirective);\n\n    /**\n     * @description\n     * Combines all CSS classes based on the component's current state and shape inputs\n     *\n     * @private\n     * @returns {string} Space-separated string of CSS class names\n     */\n    private getCssClasses(): string {\n        return [\n            this.baseStatesDirective.getCssClasses('eui-skeleton'),\n            this.circle() ? 'eui-skeleton--circle': '',\n            this.line() ? 'eui-skeleton--line': '',\n            this.square() ? 'eui-skeleton--square': '',\n            this.rectangle() ? 'eui-skeleton--rectangle': '',\n        ]\n            .join(' ')\n            .trim();\n    }\n}\n","import { EuiSkeletonComponent } from './eui-skeleton.component';\n\nexport * from './eui-skeleton.component';\n\nexport const EUI_SKELETON = [\n    EuiSkeletonComponent,\n] as const;\n\n// export { EuiSkeletonComponent as EuiSkeleton } from './eui-skeleton.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAWA;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BG;MAqBU,oBAAoB,CAAA;AApBjC,IAAA,WAAA,GAAA;AAiCI;;;;AAIG;QACH,IAAA,CAAA,MAAM,GAAG,KAAK,CAAC,KAAK,8EAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAEtD;;;;AAIG;QACH,IAAA,CAAA,IAAI,GAAG,KAAK,CAAC,KAAK,4EAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAEpD;;;;AAIG;QACH,IAAA,CAAA,MAAM,GAAG,KAAK,CAAC,KAAK,8EAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAEtD;;;;AAIG;QACH,IAAA,CAAA,SAAS,GAAG,KAAK,CAAC,KAAK,iFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAEzD;;;AAGG;AACI,QAAA,IAAA,CAAA,mBAAmB,GAAwB,MAAM,CAAC,mBAAmB,CAAC;AAoBhF,IAAA;AAhEG;;;;;;AAMG;AACH,IAAA,IACW,UAAU,GAAA;AACjB,QAAA,OAAO,IAAI,CAAC,aAAa,EAAE;IAC/B;AAoCA;;;;;;AAMG;IACK,aAAa,GAAA;QACjB,OAAO;AACH,YAAA,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,cAAc,CAAC;YACtD,IAAI,CAAC,MAAM,EAAE,GAAG,sBAAsB,GAAE,EAAE;YAC1C,IAAI,CAAC,IAAI,EAAE,GAAG,oBAAoB,GAAE,EAAE;YACtC,IAAI,CAAC,MAAM,EAAE,GAAG,sBAAsB,GAAE,EAAE;YAC1C,IAAI,CAAC,SAAS,EAAE,GAAG,yBAAyB,GAAE,EAAE;AACnD;aACI,IAAI,CAAC,GAAG;AACR,aAAA,IAAI,EAAE;IACf;8GAhES,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,w3BAnBnB,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,qiEAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAmBH,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBApBhC,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAE,YACF,cAAc,EAAA,eAAA,EAEP,uBAAuB,CAAC,MAAM,EAAA,cAAA,EAC/B;AACZ,wBAAA;AACI,4BAAA,SAAS,EAAE,mBAAmB;AAC9B,4BAAA,MAAM,EAAE;gCACJ,WAAW;gCACX,UAAU;gCACV,UAAU;gCACV,UAAU;gCACV,WAAW;gCACX,YAAY;gCACZ,gBAAgB;AACnB,6BAAA;AACJ,yBAAA;AACJ,qBAAA,EAAA,MAAA,EAAA,CAAA,qiEAAA,CAAA,EAAA;;sBAUA,WAAW;uBAAC,OAAO;;;AC/DjB,MAAM,YAAY,GAAG;IACxB,oBAAoB;;AAGxB;;ACRA;;AAEG;;;;"}