import { ArgTypes, Canvas, Markdown, Meta } from '@storybook/addon-docs/blocks';
import { cdnJs } from '../../globals/internal/storybook-cdn';
import * as AISkeletonStories from './ai-skeleton-icon.stories';
import * as AISkeletonPlaceholderStories from './ai-skeleton-placeholder.stories';
import * as AISkeletonTextStories from './ai-skeleton-text.stories';

<Meta isTemplate />

# AI Skeleton

[Source code](https://github.com/carbon-design-system/carbon/tree/main/packages/web-components/src/components/ai-skeleton)

## Table of Contents

- [Overview](#overview)
  - [AI Skeleton Icon](#ai-skeleton-icon)
  - [AI Skeleton Placeholder](#ai-skeleton-placeholder)
  - [AI Skeleton Text](#ai-skeleton-text)
- [Component API](#component-api)
- [CDN](#cdn)
- [Feedback](#feedback)

## Overview

#### AI Skeleton Icon

<Canvas of={AISkeletonStories.AISkeletonIcon} />

#### AI Skeleton Placeholder

<Canvas of={AISkeletonPlaceholderStories.AISkeletonPlaceholder} />

#### AI Skeleton Text

<Canvas of={AISkeletonTextStories.AISkeletonText} />

## Component API

## `cds-skeleton-icon`

<ArgTypes of="cds-skeleton-icon" />

## `cds-skeleton-placeholder`

<ArgTypes of="cds-skeleton-placeholder" />

## `cds-skeleton-text`

<ArgTypes of="cds-skeleton-text" />

<Markdown>{`${cdnJs({ components: ['ai-skeleton'] })}`}</Markdown>

## Feedback

Help us improve this component by providing feedback, asking questions on Slack,
or updating this file on
[GitHub](https://github.com/carbon-design-system/carbon/tree/main/packages/web-components/src/components/ai-skeleton/ai-skeleton.mdx).
