### Install MCDS Dependencies

Source: https://github.com/mikemai2awesome/mcds/blob/main/README.md

Installs all necessary project dependencies using npm, as defined in package.json.

```bash
npm install
```

--------------------------------

### Start MCDS Development Server

Source: https://github.com/mikemai2awesome/mcds/blob/main/README.md

Starts the local development server for MCDS, allowing you to preview components and changes in real-time.

```bash
npm run dev
```

--------------------------------

### Astro Component with Props

Source: https://github.com/mikemai2awesome/mcds/blob/main/README.md

Shows how to pass data and configuration as props to an Astro component, using an Accordion example with multiple items.

```astro
---
import Accordion from "path/to/components/Accordion.astro";

const accordionItems = [
  {
    id: "section1",
    title: "Accessibility Features",
    content: "<p>This design system follows WCAG 2.2...</p>",
    open: true,
  },
];
---

<Accordion items={accordionItems} allowMultiple={false} />
```

--------------------------------

### Astro Basic Component Import

Source: https://github.com/mikemai2awesome/mcds/blob/main/README.md

Demonstrates how to import and use a basic Astro component, such as an Alert, within an Astro file.

```astro
---
import Alert from "path/to/components/Alert.astro";
---

<Alert type="success"> Operation completed successfully! </Alert>
```

--------------------------------

### Clone MCDS Repository

Source: https://github.com/mikemai2awesome/mcds/blob/main/README.md

Clones the MCDS project repository from GitHub to your local machine.

```bash
git clone https://github.com/mikemai2awesome/mcds.git
cd mcds
```

--------------------------------

### MCDS Available Scripts

Source: https://github.com/mikemai2awesome/mcds/blob/main/README.md

Lists the various npm scripts available for managing the MCDS project, including development, building, linting, and testing.

```bash
- `npm run dev` - Start development server
- `npm run build` - Build for production
- `npm run preview` - Preview production build
- `npm run lint` - Run ESLint
- `npm run lint:fix` - Fix ESLint issues automatically
- `npm run lint:css` - Lint CSS files with Stylelint
- `npm run lint:css:fix` - Fix CSS linting issues automatically
- `npm run format` - Format all files with Prettier
- `npm run format:check` - Check if files are properly formatted
- `npm run type-check` - Run TypeScript type checking
- `npm run type-check:watch` - Run TypeScript type checking in watch mode
- `npm run ci` - Run all checks (format, type-check, lint, build)
```

--------------------------------

### MCDS CSS Organization with Cascade Layers

Source: https://github.com/mikemai2awesome/mcds/blob/main/README.md

Illustrates the CSS cascade layer structure used in MCDS for organized and maintainable styling.

```css
@layer config     /* CSS custom properties and configuration */
@layer resets     /* CSS resets and normalization */
@layer elements   /* Base element styling */
@layer components /* Component-specific styles */
@layer utilities; /* Utility classes */
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.