@jvsoft/components 1.0.0-alpha.10 → 1.0.0-alpha.12

package/index.d.ts

@@ -6,3 +6,4 @@ export * from './mat-suffix-search-button';
 export * from './menu';
 export * from './lista-arbol/public-api';
 export * from './filtro-busqueda';
+export * from './alerta';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jvsoft/components",
-  "version": "1.0.0-alpha.10",
+  "version": "1.0.0-alpha.12",
   "description": "JVSOFT Angular Components",
   "publishConfig": {
     "tag": "alpha",
@@ -12,30 +12,35 @@
     "@angular/forms": ">=16.0.0",
     "@angular/material": ">=16.0.0",
     "@jvsoft/utils": "workspace:*",
-    "@ngneat/until-destroy": "^10.0.0",
-    "moment": "^2.30.1",
-    "shorthash2": "^1.0.5",
     "tailwindcss": "3",
     "xlsx": "^0.18.5"
   },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
   "sideEffects": false,
   "exports": {
+    ".": {
+      "sass": "./src/styles/base.scss",
+      "default": "./fesm2022/jvsoft-components.mjs",
+      "types": "./index.d.ts"
+    },
+    "./tailwind": "./src/tailwind/index.js",
     "./base.scss": "./src/styles/base.scss",
-    "./styles.css": "./src/styles/base-jvsoft-components.css",
     "./package.json": {
       "default": "./package.json"
     },
-    ".": {
-      "types": "./index.d.ts",
-      "default": "./fesm2022/jvsoft-components.mjs"
+    "./alerta": {
+      "types": "./alerta/index.d.ts",
+      "default": "./fesm2022/jvsoft-components-alerta.mjs"
     },
     "./dialog-flotante": {
       "types": "./dialog-flotante/index.d.ts",
       "default": "./fesm2022/jvsoft-components-dialog-flotante.mjs"
     },
-    "./filtro-busqueda": {
-      "types": "./filtro-busqueda/index.d.ts",
-      "default": "./fesm2022/jvsoft-components-filtro-busqueda.mjs"
+    "./lista-arbol": {
+      "types": "./lista-arbol/index.d.ts",
+      "default": "./fesm2022/jvsoft-components-lista-arbol.mjs"
     },
     "./luces-navidad": {
       "types": "./luces-navidad/index.d.ts",
@@ -45,14 +50,14 @@
       "types": "./mat-suffix-search-button/index.d.ts",
       "default": "./fesm2022/jvsoft-components-mat-suffix-search-button.mjs"
     },
+    "./filtro-busqueda": {
+      "types": "./filtro-busqueda/index.d.ts",
+      "default": "./fesm2022/jvsoft-components-filtro-busqueda.mjs"
+    },
     "./menu": {
       "types": "./menu/index.d.ts",
       "default": "./fesm2022/jvsoft-components-menu.mjs"
     },
-    "./lista-arbol": {
-      "types": "./lista-arbol/index.d.ts",
-      "default": "./fesm2022/jvsoft-components-lista-arbol.mjs"
-    },
     "./tabla-mantenimiento": {
       "types": "./tabla-mantenimiento/index.d.ts",
       "default": "./fesm2022/jvsoft-components-tabla-mantenimiento.mjs"
@@ -63,8 +68,5 @@
     }
   },
   "module": "fesm2022/jvsoft-components.mjs",
-  "typings": "index.d.ts",
-  "dependencies": {
-    "tslib": "^2.3.0"
-  }
+  "typings": "index.d.ts"
 }

package/src/styles/base.scss

@@ -1,10 +1,7 @@
-@use "tailwind.scss";
-/*@use "components/index.scss";*/
-
-
-
-@use "../../../components/tabla-mantenimiento/tabla-mantenimiento.component";
-@use "../../../components/dialog-flotante/dialog-flotante.component";
-@use "../../../components/filtro-busqueda/filtro-busqueda.component";
-
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
 
+@import "../../../components/tabla-mantenimiento/tabla-mantenimiento.component";
+@import "../../../components/dialog-flotante/dialog-flotante.component";
+@import "../../../components/filtro-busqueda/filtro-busqueda.component";

package/src/tailwind/colors.js

@@ -0,0 +1,66 @@
+module.exports = {
+    current: 'currentColor',
+    transparent: 'transparent',
+
+    'contrast-black': 'black',
+    'contrast-white': 'white',
+
+    gray: {
+        light: 'rgba(158, 158, 158, 0.1)',
+        DEFAULT: 'rgb(158, 158, 158)',
+    },
+    red: {
+        light: 'rgba(244, 67, 54, 0.1)',
+        DEFAULT: 'rgb(244, 67, 54)',
+    },
+    orange: {
+        light: 'rgba(255, 152, 0, 0.1)',
+        DEFAULT: 'rgb(255, 152, 0)',
+    },
+    'deep-orange': {
+        light: 'rgba(255, 87, 34, 0.1)',
+        DEFAULT: 'rgb(255, 87, 34)',
+    },
+    amber: {
+        light: 'rgba(255, 193, 7, 0.1)',
+        DEFAULT: 'rgb(255, 193, 7)',
+    },
+    green: {
+        light: 'rgba(76, 175, 80, 0.1)',
+        DEFAULT: 'rgb(76, 175, 80)',
+    },
+    teal: {
+        light: 'rgba(0, 150, 136, 0.1)',
+        DEFAULT: 'rgb(0, 150, 136)',
+    },
+    cyan: {
+        light: 'rgba(0, 188, 212, 0.1)',
+        DEFAULT: 'rgb(0, 188, 212)',
+    },
+    purple: {
+        light: 'rgba(156, 39, 176, 0.1)',
+        DEFAULT: 'rgb(156, 39, 176)',
+    },
+    'deep-purple': {
+        light: 'rgba(103, 58, 183, 0.1)',
+        DEFAULT: 'rgb(103, 58, 183)',
+    },
+    pink: {
+        light: 'rgba(233, 30, 99, 0.1)',
+        DEFAULT: 'rgb(233, 30, 99)',
+    },
+    pdf: {
+        light: 'rgba(179,11,0, 0.1)',
+        DEFAULT: 'rgb(179,11,0)',
+        "100": 'rgba(179,11,0, 0.1)',
+        "700": 'rgb(179,11,0)',
+        "900": 'rgb(121,9,0)',
+    },
+    excel: {
+        light: 'rgba(30, 110, 66, 0.1)',
+        DEFAULT: 'rgb(30 110 66)',
+        "100": 'rgba(30, 110, 66, 0.1)',
+        "700": 'rgb(30 110 66)',
+        "900": 'rgb(17,75,44)',
+    }
+};

package/src/tailwind/index.js

@@ -0,0 +1,11 @@
+/**
+ * JVSoft Tailwind Plugins
+ * -----------------------
+ * Punto de entrada para todos los plugins personalizados de Tailwind.
+ * Esto permite a los consumidores importar todos los plugins con un solo require.
+ */
+module.exports = [
+  require('./plugins/jvs-buttons'),
+  require('./plugins/jvs-grid'),
+  require('./plugins/jvs-icons'),
+];

package/src/tailwind/plugins/jvs-buttons.js

@@ -0,0 +1,32 @@
+const plugin = require('tailwindcss/plugin');
+
+/**
+ * Plugin de Botones JVSoft
+ * -----------------------
+ * Define clases base para botones consistentes en toda la plataforma.
+ */
+module.exports = plugin(function ({ addComponents, theme }) {
+  const colors = {
+    primary: theme('colors.primary.DEFAULT'),
+    accent: theme('colors.accent.DEFAULT'),
+    warn: theme('colors.warn.DEFAULT'),
+  };
+
+  addComponents({
+    '.jvs-button': {
+      '@apply inline-flex items-center justify-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-offset-2 transition-colors duration-200': {},
+      '&:disabled': {
+        '@apply opacity-50 cursor-not-allowed': {},
+      }
+    },
+    '.jvs-button-primary': {
+      '@apply text-white bg-primary hover:bg-primary-dark focus:ring-primary': {},
+    },
+    '.jvs-button-accent': {
+      '@apply text-white bg-accent hover:bg-accent-dark focus:ring-accent': {},
+    },
+    '.jvs-button-warn': {
+      '@apply text-white bg-warn hover:bg-warn-dark focus:ring-warn': {},
+    }
+  });
+});

package/src/tailwind/plugins/jvs-grid.js

@@ -0,0 +1,69 @@
+const plugin = require('tailwindcss/plugin');
+
+/**
+ * Plugin de Grid y Layout JVSoft
+ * ------------------------------
+ * Proporciona utilidades para el sistema de rejilla y espaciado de cabeceras.
+ */
+module.exports = plugin(function ({ addComponents, theme }) {
+  const gutter = theme('spacing.gutter', '1rem');
+  const colors = {
+    primary: theme('colors.primary.DEFAULT'),
+    icon: 'rgba(0, 0, 0, 0.54)',
+  };
+
+  addComponents({
+    '.jvs-grid-title': {
+      '@apply flex items-center gap-2 text-lg font-bold py-3 px-4 border-b border-gray-100 mb-4': {},
+      'mat-icon': {
+        color: colors.icon,
+      },
+      '&.jvs-grid-title-primary': {
+        color: colors.primary,
+        'mat-icon': {
+          color: colors.primary,
+        }
+      }
+    }
+  });
+
+  // --- Generación Automática de Columnas (1-12) ---
+  const numericColumns = {};
+  for (let i = 1; i <= 12; i++) {
+    numericColumns[`.jvs-col-${i}`] = {
+      flexBasis: `${(i / 12) * 100}%`,
+      maxWidth: `${(i / 12) * 100}%`,
+      paddingLeft: gutter,
+      paddingRight: gutter,
+    };
+  }
+  addComponents(numericColumns);
+
+  // --- Generación Automática de Fracciones ---
+  const fractions = {
+    '1/2': '50%',
+    '1/3': '33.333333%',
+    '2/3': '66.666667%',
+    '1/4': '25%',
+    '2/4': '50%',
+    '3/4': '75%',
+    '1/5': '20%',
+    '2/5': '40%',
+    '3/5': '60%',
+    '4/5': '80%',
+    '1/6': '16.666667%',
+    '5/6': '83.333333%',
+  };
+
+  const fractionalColumns = {};
+  Object.entries(fractions).forEach(([key, value]) => {
+    fractionalColumns[`.jvs-col-${key.replace('/', '\\/')}`] = {
+      flexBasis: value,
+      maxWidth: value,
+      paddingLeft: gutter,
+      paddingRight: gutter,
+    };
+  });
+  addComponents(fractionalColumns);
+
+});

package/src/tailwind/plugins/jvs-icons.js

@@ -0,0 +1,36 @@
+const plugin = require('tailwindcss/plugin');
+
+/**
+ * Plugin de Iconos JVSoft
+ * -----------------------
+ * Genera utilidades de tamaño para mat-icon y SVG.
+ * Centraliza las dimensiones para evitar redundancia.
+ */
+module.exports = plugin(function ({ addUtilities }) {
+  const iconSizes = {
+    '3xs': '0.5rem',
+    '2xs': '0.75rem',
+    'xs': '1rem',
+    'sm': '1.25rem',
+    'base': '1.5rem',
+    'lg': '1.75rem',
+    'xl': '2rem',
+    '2xl': '2.25rem',
+    '3xl': '2.5rem',
+    '4xl': '2.75rem',
+    '5xl': '3rem',
+  };
+
+  const utilities = {};
+  
+  Object.entries(iconSizes).forEach(([size, value]) => {
+    utilities[`.icon-${size}, .icon-${size} svg`] = {
+      'font-size': value,
+      'height': value,
+      'width': value,
+      'line-height': value,
+    };
+  });
+
+  addUtilities(utilities);
+});

package/tabla-mantenimiento/tabla-mantenimiento.component.d.ts

@@ -29,6 +29,7 @@ export declare class TablaMantenimientoComponent<T> implements OnInit, AfterCont
     readonly id: string;
     readonly router: Router;
     readonly route: ActivatedRoute;
+    private readonly destroyRef;
     get templateBotonesComunes(): BotonMantenimiento[];
     get templateColumnasTabla(): ColumnaTabla<any>[];
     dataSuscription: Observable<any> | undefined;