SDC - Component library

Introduction

SDC Component Library makes developing Drupal components more efficient by enabling easy rendering and visual testing of Single-Directory Components (SDCs) directly from the theme. Components with a .story.twig file can be previewed with dummy data.

Features

The SDC Component Library module provides the following functionality:

• Automatically reads and lists all SDCs from your theme.
• Allows rendering components with a .story.twig file using dummy data.
• Enables visual inspection and testing of components at /components.
• Integration with a WCAG checker for accessibility validation.

This module is perfect for developers who want to streamline their component development workflow, allowing them to see and test their components without setting up full content pages.

Use cases include:

• Rapid component development and testing.
• Ensuring consistent design system implementation.
• Accessibility checks directly within component previews.

Post-Installation

Once installed, the module reads all components from your theme folder that are set up as SDCs. You can access the component list at /components. No additional configuration is needed. However, to utilize the full functionality, ensure your components have a .story.twig file, which allows them to be rendered with sample data.
Additional Requirements

• Single Directory Components (SDC) module enabled.

This module requires the SDC module to be active and functional within your theme.

Similar Projects

Other component development modules in Drupal exist, such as UI Patterns or storybook. However, SDC Component Library is uniquely focused on leveraging Single-Directory Components and providing direct visual previews of each component without complex setup.