dv-web-components 1.0.1 → 1.0.4

package/dist/types/alert-component/index.d.ts

@@ -0,0 +1,13 @@
+export class AppAlert extends HTMLElement {
+    static get observedAttributes(): string[];
+    handleDismiss(): void;
+    set variant(value: string);
+    get variant(): string;
+    set dismissible(value: boolean);
+    get dismissible(): boolean;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: any, oldValue: any, newValue: any): void;
+    close(): void;
+    #private;
+}

package/dist/types/card-component/index.d.ts

@@ -0,0 +1,3 @@
+declare const template: HTMLTemplateElement;
+declare class AppCard extends HTMLElement {
+}

package/dist/types/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/react/index.d.ts

@@ -0,0 +1,5 @@
+export const AppAlert: import("@lit/react").ReactWebComponent<AppAlertElement, {
+    onClose: string;
+}>;
+export const AppCard: import("@lit/react").ReactWebComponent<HTMLElement, {}>;
+import { AppAlert as AppAlertElement } from '../alert-component/index.js';

package/package.json

@@ -1,19 +1,33 @@
 {
   "name": "dv-web-components",
-  "version": "1.0.1",
+  "version": "1.0.4",
   "description": "Librería de Web Components nativos y accesibles",
   "type": "module",
   "main": "./index.js",
   "module": "./index.js",
+  "types": "./dist/types/index.d.ts",
   "exports": {
-    ".": "./index.js",
-    "./alert": "./alert-component/index.js",
-    "./card": "./card-component/index.js"
+    ".": {
+      "types": "./dist/types/index.d.ts",
+      "default": "./index.js"
+    },
+    "./react": {
+      "types": "./dist/types/react/index.d.ts",
+      "default": "./react/index.js"
+    },
+    "./*": "./*-component/index.js"
+  },
+  "scripts": {
+    "build": "tsc",
+    "prepublishOnly": "npm run build",
+    "release": "npm version patch && npm publish"
   },
   "files": [
     "index.js",
     "alert-component",
-    "card-component"
+    "card-component",
+    "react",
+    "dist"
   ],
   "keywords": [
     "web-components",
@@ -21,5 +35,25 @@
     "ui"
   ],
   "author": "Diego Villa",
-  "license": "MIT"
+  "license": "MIT",
+  "dependencies": {
+    "@lit/react": "^1.0.8"
+  },
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    },
+    "react-dom": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "typescript": "^5.0.0"
+  }
 }

package/react/index.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { createComponent } from '@lit/react';
+import { AppAlert as AppAlertElement } from '../alert-component/index.js';
+import { AppCard as AppCardElement } from '../card-component/index.js';
+
+// Envolvemos el Web Component y lo convertimos en un Componente React real
+export const AppAlert = createComponent({
+  tagName: 'app-alert',
+  elementClass: AppAlertElement,
+  react: React,
+  events: {
+    onClose: 'app-close' // 👈 Mapea el CustomEvent nativo 'app-close' a una prop React 'onClose'
+  }
+});
+
+export const AppCard = createComponent({
+  tagName: 'app-card',
+  elementClass: AppCardElement,
+  react: React
+});