ip2p-ui v1.0.4

📦 ip2p-ui

A streamlined, reusable component library for Vue applications, complete with shared assets, styles, and Storybook stories.

🚀 Features

• 🔧 Vue Components – Pre-built, reusable components in atoms/.
• 🖼️ Shared Assets – Centralized public/ and sass/ directories.
• 📖 Storybook Support – Pre-configured stories for visual testing.
• ⚙️ CLI Tool – Automates project setup.

📦 Installation

Install via npm:

npm install ip2p-ui

⚙️ Setup

Initialize the package:

npx ip2p-ui

This command copies atoms/, public/, sass/, and stories/ into your project.

💻 Vue Integration

Auto-register shared components in Vue:

📂 baseComponent.js

const modules = import.meta.glob('@/shared-stories/atoms/*/*.vue', { eager: true });

export default function loadComponents(app) {
  Object.entries(modules).forEach(([path, module]) => {
    const componentName = path.split('/').pop().split('.')[0];
    app.component(componentName, module.default);
  });
}

📂 main.js

import { createApp } from 'vue';
import App from './App.vue';
import loadComponents from './baseComponent';

const app = createApp(App);
loadComponents(app);
app.mount('#app');

🛠️ Customization

Modify or extend components, assets, and styles while maintaining a structured UI framework.

Shared Stories ensures fast, consistent, and scalable UI development. 🚀