@creaditor/business-ai
v1.0.45
Published
Business AI component with Shadow DOM support for embedding
Readme
@creaditor/business-ai
Business AI component built with Vite, React, MUI, and Shadow DOM for easy embedding into any website.
Features
- Built with Vite + React + TypeScript
- Material-UI (MUI) components
- Shadow DOM encapsulation for style isolation
- Easy to embed into any website
- Web Component standard
Installation
Via npm
npm install @creaditor/business-aiVia CDN (unpkg)
<script src="https://unpkg.com/@creaditor/business-ai@latest/dist/business-ai.umd.js"></script>Via CDN (jsDelivr)
<script src="https://cdn.jsdelivr.net/npm/@creaditor/business-ai@latest/dist/business-ai.umd.js"></script>Usage
CDN Usage (Simplest - No Build Step)
The UMD build includes all dependencies (React, MUI, etc.) bundled, so you only need one script tag:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Business AI</title>
<!-- Load from CDN (unpkg) -->
<script src="https://unpkg.com/@creaditor/business-ai@latest/dist/business-ai.umd.js"></script>
<cdtr-business-ai></cdtr-business-ai>
<!-- Or use jsDelivr -->
<!-- <script src="https://cdn.jsdelivr.net/npm/@creaditor/business-ai@latest/dist/business-ai.umd.js"></script> -->
</head>
<body>
<!-- Use the web component -->
<cdtr-business-ai></cdtr-business-ai>
<script>
// The component auto-registers when the script loads
// Optional: Access via global if needed
console.log('Business AI loaded:', window.BusinessAI);
// Example: Set properties programmatically
const element = document.querySelector('cdtr-business-ai');
// element.websiteUrl = 'https://example.com';
</script>
</body>
</html>Note: The component uses Shadow DOM, so styles are automatically isolated. The CSS file is optional and only needed if you want to override global styles.
As an ES Module (npm)
import '@creaditor/business-ai';
// The custom element is now registered
const element = document.createElement('cdtr-business-ai');
document.body.appendChild(element);As a Web Component (Local File)
<!DOCTYPE html>
<html>
<head>
<script type="module" src="path/to/business-ai.es.js"></script>
</head>
<body>
<cdtr-business-ai></cdtr-business-ai>
</body>
</html>Development
# Install dependencies
npm install
# Start dev server
npm run dev
# Build for production
npm run build
# Preview production build
npm run previewLicense
MIT