@jjlmoya/utils-converters 1.1.0

package/src/tool/imagenBase64/seo.astro

@@ -0,0 +1,14 @@
+---
+import { SEORenderer } from '@jjlmoya/utils-shared';
+import { imagenBase64 } from './index';
+import type { KnownLocale } from '../../types';
+
+interface Props {
+  locale?: KnownLocale;
+}
+
+const { locale = 'es' } = Astro.props;
+const content = await imagenBase64.i18n[locale]?.();
+---
+
+{content && <SEORenderer content={{ locale, sections: content.seo }} />}

package/src/tool/imagenBase64/style.css

@@ -0,0 +1,299 @@
+.base64-container {
+    width: 100%;
+    margin-bottom: 2rem;
+}
+
+.base64-card {
+    background: var(--bg-surface);
+    border: 1px solid var(--border-base);
+    border-radius: 20px;
+
+    --card-shadow: rgba(0, 0, 0, 0.04);
+    --card-shadow-blur: 20px;
+    --card-shadow-y: 4px;
+
+    box-shadow: 0 var(--card-shadow-y) var(--card-shadow-blur) var(--card-shadow);
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+}
+
+@media (min-width: 800px) {
+    .base64-card {
+        flex-direction: row;
+        min-height: 550px;
+    }
+
+    .upload-section {
+        width: 40%;
+        border-right: 1px solid var(--border-base);
+        background: var(--bg-muted);
+        padding: 3rem 2rem;
+    }
+
+    .result-section {
+        flex: 1;
+        padding: 3rem 2rem;
+        display: flex;
+        flex-direction: column;
+        gap: 2rem;
+    }
+}
+
+.upload-section {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    padding: 2rem;
+}
+
+.result-section {
+    padding: 2rem;
+    display: flex;
+    flex-direction: column;
+    gap: 1.5rem;
+}
+
+.drop-zone {
+    position: relative;
+    border: 2px dashed var(--border-base);
+    border-radius: 16px;
+    background: var(--bg-surface);
+    padding: 2rem 1rem;
+    text-align: center;
+    cursor: pointer;
+    transition: all 0.2s ease;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 300px;
+    height: 100%;
+}
+
+.drop-zone:hover {
+    border-color: var(--accent);
+    background: var(--bg-muted);
+}
+
+.drop-content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 0.5rem;
+    pointer-events: none;
+}
+
+.upload-icon {
+    width: 40px;
+    height: 40px;
+    color: var(--text-muted);
+    margin-bottom: 0.5rem;
+}
+
+.drop-content h3 {
+    margin: 0;
+    font-size: 1.05rem;
+    font-weight: 700;
+    color: var(--text-base);
+}
+
+.drop-content p {
+    margin: 0;
+    font-size: 0.85rem;
+    color: var(--text-muted);
+}
+
+.file-input-native {
+    margin-top: 1.5rem;
+    padding: 0.5rem;
+    font-size: 0.85rem;
+    color: var(--text-muted);
+    background: var(--bg-surface);
+    border: 1px solid var(--border-base);
+    border-radius: 8px;
+    max-width: 100%;
+    cursor: pointer;
+}
+
+.drop-zone .file-input-native {
+    pointer-events: auto;
+}
+
+.preview-container {
+    position: absolute;
+    inset: 0;
+    background: var(--bg-surface);
+    z-index: 10;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 1.25rem;
+}
+
+.preview-container.hidden {
+    display: none;
+}
+
+#b64-image-preview {
+    max-width: 100%;
+    max-height: 250px;
+    object-fit: contain;
+    border-radius: 8px;
+}
+
+.clear-btn {
+    position: absolute;
+    top: 1rem;
+    right: 1rem;
+    background: var(--bg-surface);
+    border: 1px solid var(--border-base);
+    border-radius: 50%;
+    width: 32px;
+    height: 32px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: var(--text-muted);
+    cursor: pointer;
+}
+
+.image-info {
+    position: absolute;
+    bottom: 1rem;
+    display: flex;
+    background: var(--bg-muted);
+    padding: 0.4rem 0.8rem;
+    border-radius: 8px;
+    border: 1px solid var(--border-base);
+}
+
+.info-pill {
+    font-size: 0.7rem;
+    font-weight: 600;
+    color: var(--text-muted);
+}
+
+.name-pill {
+    max-width: 120px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    padding-right: 0.5rem;
+}
+
+.size-pill {
+    color: var(--accent);
+    padding-left: 0.5rem;
+    border-left: 1px solid var(--border-base);
+}
+
+.output-group {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+}
+
+.output-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.output-header label {
+    font-weight: 700;
+    color: var(--text-base);
+    font-size: 0.95rem;
+}
+
+.copy-btn {
+    background: var(--bg-surface);
+    border: 1px solid var(--border-base);
+    color: var(--text-base);
+    padding: 0.35rem 0.75rem;
+    border-radius: 6px;
+    font-size: 0.8rem;
+    font-weight: 700;
+    cursor: pointer;
+    transition: all 0.2s;
+}
+
+.copy-btn:hover {
+    background: var(--accent);
+    color: var(--text-on-accent);
+}
+
+.code-wrapper {
+    background: var(--bg-muted);
+    border: 1px solid var(--border-base);
+    border-radius: 12px;
+    padding: 1rem;
+}
+
+textarea {
+    width: 100%;
+    min-height: 120px;
+    background: transparent;
+    border: none;
+    color: var(--text-base);
+    font-size: 0.85rem;
+    line-height: 1.5;
+    resize: none;
+    outline: none;
+    word-break: break-all;
+}
+
+.toast {
+    position: fixed;
+    bottom: 2rem;
+    left: 50%;
+    transform: translateX(-50%) translateY(20px);
+    background: var(--text-base);
+    color: var(--bg-surface);
+    padding: 0.75rem 1.5rem;
+    border-radius: 50px;
+    font-weight: 700;
+    font-size: 0.9rem;
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+
+    --toast-shadow: rgba(0, 0, 0, 0.2);
+    --toast-shadow-y: 10px;
+    --toast-shadow-blur: 30px;
+
+    box-shadow: 0 var(--toast-shadow-y) var(--toast-shadow-blur) var(--toast-shadow);
+    opacity: 0;
+    pointer-events: none;
+    transition: all 0.2s;
+    z-index: 100;
+}
+
+.toast.show {
+    opacity: 1;
+    transform: translateX(-50%) translateY(0);
+}
+
+@media (max-width: 600px) {
+    .card-section {
+        padding: 1rem;
+    }
+
+    .drop-zone {
+        min-height: 280px;
+    }
+}
+
+@media (max-width: 768px) {
+    .card-section {
+        padding: 1.5rem;
+    }
+
+    .drop-zone {
+        min-height: 250px;
+    }
+
+    textarea {
+        height: 120px;
+    }
+}

package/src/tool/jpgAIco/bibliography.astro

@@ -0,0 +1,14 @@
+---
+import { Bibliography as SharedBibliography } from '@jjlmoya/utils-shared';
+import { jpgAIco } from './index';
+import type { KnownLocale } from '../../types';
+
+interface Props {
+  locale?: KnownLocale;
+}
+
+const { locale = 'es' } = Astro.props;
+const content = await jpgAIco.i18n[locale]?.();
+---
+
+{content && <SharedBibliography links={content.bibliography} title={content.ui.bibliographyTitle} />}

package/src/tool/jpgAIco/component.astro

@@ -0,0 +1,8 @@
+---
+import SharedImageConverter from '../../shared/ImageConverter.astro';
+import type { ImageConverterUI } from '../../shared/ImageConverter.astro';
+
+interface Props { ui: ImageConverterUI }
+const { ui } = Astro.props;
+---
+<SharedImageConverter from="jpg" to="ico" ui={ui} />

package/src/tool/jpgAIco/i18n/en.ts

@@ -0,0 +1,123 @@
+import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { ImageConverterUI } from '../../../shared/ImageConverter.astro';
+import type { JpgAIcoLocaleContent } from '../index';
+
+const slug = 'jpg-to-ico-converter';
+const title = 'JPG to ICO Converter | Create Official Icons for Windows and Web';
+const description =
+  'Convert JPG photos to ICO with real Microsoft binary headers. Automatic square crop. No file uploads. Free and private.';
+
+const ui: ImageConverterUI = {
+  dragText: 'Drag JPG files...',
+  convertText: 'To convert them to ICO instantly',
+  selectFiles: 'Select files',
+  processedFiles: 'Processed files',
+  downloadAll: 'Download All (.zip)',
+  pending: 'Pending',
+  bibliographyTitle: 'Bibliographic References',
+  faqTitle: 'Frequently Asked Questions',
+};
+
+const faq: JpgAIcoLocaleContent['faq'] = [
+  {
+    question: 'Is the resulting ICO file natively compatible to customize Windows folders?',
+    answer:
+      'Yes, we create a 100% authentic Microsoft Icon Format file by inserting a standardized binary header at a low level into the image matrix.',
+  },
+  {
+    question: 'What happens to the proportion if my original JPG is a panoramic horizontal photo?',
+    answer:
+      'The rigid global ICO standard absolutely requires a perfectly square image. Our HTML5 JS engine will center your photo and crop the excess, guaranteeing a balanced result.',
+  },
+  {
+    question: 'Is it dangerous to upload corporate or personal JPG logos to the converter?',
+    answer:
+      'The Canvas engine in JavaScript rests in your own physical browser. Converting hundreds of photos to ICO does not send a single megabyte to any cloud in questionable countries.',
+  },
+];
+
+const howTo: JpgAIcoLocaleContent['howTo'] = [
+  {
+    name: 'Gather the original JPG photos',
+    text: 'Find and collect the conventional photos and deposit them by dropping them into our friendly square.',
+  },
+  {
+    name: 'Watch the blind hexadecimal purification',
+    text: 'The re-encoding will natively and quickly insert metadata and headers asynchronously generating a strict pure icon in memory.',
+  },
+  {
+    name: 'Compile multiple ZIP designs',
+    text: 'Finish the job by downloading everything massively in a compact package in just seconds.',
+  },
+];
+
+const bibliography: JpgAIcoLocaleContent['bibliography'] = [
+  {
+    name: 'ICO Iconographic Structure and System Usage',
+    url: 'https://en.wikipedia.org/wiki/ICO_(file_format)',
+  },
+  {
+    name: 'JPEG.org Standards',
+    url: 'https://jpeg.org/',
+  },
+];
+
+const seo: JpgAIcoLocaleContent['seo'] = [
+  {
+    type: 'title',
+    text: 'Free Online JPG to ICO Converter',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'Converting JPG to ICO is necessary when you want to create custom icons for Windows, Favicons for websites or visual identifiers for applications. Microsoft\'s ICO format is the standard for all these uses and our converter generates genuine ICO files with the correct binary structure.',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'An important technical consideration when converting JPG to ICO is image proportion. The ICO format requires square images. If your original JPG is rectangular, our converter will center and automatically crop it to fit in a square format, preserving the central part of the image.',
+  },
+  {
+    type: 'tip',
+    html:
+      'For better quality icons, always use a high-resolution square JPG (at least 256x256) as source. The converter will resize to the standard ICO size maintaining maximum possible sharpness.',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'ICO files for Windows can contain multiple resolutions (16x16, 32x32, 48x48, 256x256) in a single file. Our converter generates the ICO at the optimal resolution based on your source image.',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'Since JPG has no alpha channel, the resulting ICO will not have transparency. For icons with transparency, we recommend first removing the background in an image editor, saving as PNG and then converting from PNG to ICO to get an icon with perfect transparency.',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'Convert JPG to authentic ICO with real binary headers. Automatic crop for square format. Free, private and compatible with Windows and all browsers.',
+  },
+];
+
+const appSchema: WithContext<SoftwareApplication> = {
+  '@context': 'https://schema.org',
+  '@type': 'SoftwareApplication',
+  name: title,
+  description,
+  applicationCategory: 'UtilitiesApplication',
+  operatingSystem: 'Web',
+  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
+  inLanguage: 'en',
+};
+
+export const content: JpgAIcoLocaleContent = {
+  slug,
+  title,
+  description,
+  ui,
+  seo,
+  faq,
+  bibliography,
+  howTo,
+  schemas: [appSchema as any],
+};

package/src/tool/jpgAIco/i18n/es.ts

@@ -0,0 +1,123 @@
+import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { ImageConverterUI } from '../../../shared/ImageConverter.astro';
+import type { JpgAIcoLocaleContent } from '../index';
+
+const slug = 'convertidor-jpg-a-ico';
+const title = 'Convertidor de JPG a ICO | Crea iconos oficiales para Windows y Web';
+const description =
+  'Convierte fotos JPG a ICO con cabeceras binarias reales de Microsoft. Recorte automático cuadrado. Sin subir archivos. Gratis y privado.';
+
+const ui: ImageConverterUI = {
+  dragText: 'Arrastra archivos JPG...',
+  convertText: 'Para convertirlos a ICO al instante',
+  selectFiles: 'Seleccionar archivos',
+  processedFiles: 'Archivos procesados',
+  downloadAll: 'Descargar Todo (.zip)',
+  pending: 'Pendiente',
+  bibliographyTitle: 'Referencias Bibliográficas',
+  faqTitle: 'Preguntas Frecuentes',
+};
+
+const faq: JpgAIcoLocaleContent['faq'] = [
+  {
+    question: '¿El archivo ICO que resulta es compatible nativamente para personalizar carpetas Windows?',
+    answer:
+      'Sí, creamos un archivo Microsoft Icon Format 100% auténtico insertando a bajo nivel una cabecera binaria estandarizada a la matriz de imagen.',
+  },
+  {
+    question: '¿Qué pasa con la proporción si mi JPG original es una foto horizontal panorámica?',
+    answer:
+      'El estándar rígido global del ICO requiere obligatoriamente una imagen perfectamente cuadrada. Nuestro motor JS HTML5 centrará tu foto y recortará los excedentes garantizando un resultado equilibrado.',
+  },
+  {
+    question: '¿Es peligroso subir corporativos o logotipos personales JPG al conversor?',
+    answer:
+      'El motor Canvas en JavaScript descansa en tu propio explorador físico. Convertir cientos de fotos a ICO no manda un solo megabyte hacia ninguna nube en países dudosos.',
+  },
+];
+
+const howTo: JpgAIcoLocaleContent['howTo'] = [
+  {
+    name: 'Junta las Fotocopias JPG Originales',
+    text: 'Busca y acapara las fotos convencionales y deposítalas tirándolas en nuestro cuadrado amigable.',
+  },
+  {
+    name: 'Observa la Purificación Hexadecimal Ciega',
+    text: 'La recodificación insertará nativa y velozmente los metadatos y encabezados generando asincrónico por memoria un estricto icono puro.',
+  },
+  {
+    name: 'Compila Múltiples Diseños ZIP',
+    text: 'Termina la labor descargando todo masivamente en paquete compacto en pocos segundos.',
+  },
+];
+
+const bibliography: JpgAIcoLocaleContent['bibliography'] = [
+  {
+    name: 'Estructura Iconográfica y Uso en Sistemas ICO',
+    url: 'https://en.wikipedia.org/wiki/ICO_(file_format)',
+  },
+  {
+    name: 'JPEG.org Standards',
+    url: 'https://jpeg.org/',
+  },
+];
+
+const seo: JpgAIcoLocaleContent['seo'] = [
+  {
+    type: 'title',
+    text: 'Convertidor JPG a ICO Online Gratuito',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'Convertir JPG a ICO es necesario cuando quieres crear iconos personalizados para Windows, Favicons para sitios web o identificadores visuales para aplicaciones. El formato ICO de Microsoft es el estándar para todos estos usos y nuestro convertidor genera archivos ICO genuinos con la estructura binaria correcta.',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'Una consideración técnica importante al convertir JPG a ICO es la proporción de la imagen. El formato ICO requiere imágenes cuadradas. Si tu foto JPG original es rectangular (horizontal o vertical), nuestro convertidor la centrará y recortará automáticamente para que quepa en un formato cuadrado, preservando la parte central de la imagen.',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'Como el JPG no tiene canal alfa, el ICO resultante no tendrá transparencia. Para iconos con transparencia, te recomendamos primero eliminar el fondo en un editor de imágenes, guardar como PNG y luego convertir de PNG a ICO para obtener un icono con transparencia perfecta.',
+  },
+  {
+    type: 'tip',
+    html:
+      'Para iconos de mejor calidad, usa siempre una imagen JPG cuadrada de alta resolución (al menos 256x256) como fuente. El convertidor redimensionará al tamaño ICO estándar manteniendo la máxima nitidez posible.',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'Los archivos ICO para Windows pueden contener múltiples resoluciones (16x16, 32x32, 48x48, 256x256) en un mismo archivo. Nuestro convertidor genera el ICO en la resolución óptima según tu imagen de origen.',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'Convierte JPG a ICO auténtico con cabeceras binarias reales. Recorte automático para formato cuadrado. Gratis, privado y compatible con Windows y todos los navegadores.',
+  },
+];
+
+const appSchema: WithContext<SoftwareApplication> = {
+  '@context': 'https://schema.org',
+  '@type': 'SoftwareApplication',
+  name: title,
+  description,
+  applicationCategory: 'UtilitiesApplication',
+  operatingSystem: 'Web',
+  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
+  inLanguage: 'es',
+};
+
+export const content: JpgAIcoLocaleContent = {
+  slug,
+  title,
+  description,
+  ui,
+  seo,
+  faq,
+  bibliography,
+  howTo,
+  schemas: [appSchema as any],
+};

package/src/tool/jpgAIco/i18n/fr.ts

@@ -0,0 +1,118 @@
+import type { WithContext, SoftwareApplication } from 'schema-dts';
+import type { ImageConverterUI } from '../../../shared/ImageConverter.astro';
+import type { JpgAIcoLocaleContent } from '../index';
+
+const slug = 'convertisseur-jpg-en-ico';
+const title = 'Convertisseur JPG vers ICO | Créez des Icônes Officielles pour Windows et Web';
+const description =
+  'Convertissez des photos JPG en ICO avec de vrais en-têtes binaires Microsoft. Recadrage carré automatique. Sans téléchargement. Gratuit et privé.';
+
+const ui: ImageConverterUI = {
+  dragText: 'Faites glisser des fichiers JPG...',
+  convertText: 'Pour les convertir en ICO instantanément',
+  selectFiles: 'Sélectionner des fichiers',
+  processedFiles: 'Fichiers traités',
+  downloadAll: 'Tout télécharger (.zip)',
+  pending: 'En attente',
+  bibliographyTitle: 'Références Bibliographiques',
+  faqTitle: 'Questions Fréquentes',
+};
+
+const faq: JpgAIcoLocaleContent['faq'] = [
+  {
+    question: 'Le fichier ICO résultant est-il nativement compatible pour personnaliser les dossiers Windows ?',
+    answer:
+      'Oui, nous créons un fichier Microsoft Icon Format 100% authentique en insérant un en-tête binaire standardisé à bas niveau dans la matrice d\'image.',
+  },
+  {
+    question: 'Que se passe-t-il avec la proportion si mon JPG original est une photo horizontale panoramique ?',
+    answer:
+      'Le standard ICO mondial rigide exige absolument une image parfaitement carrée. Notre moteur JS HTML5 centrera votre photo et rognera les excédents, garantissant un résultat équilibré.',
+  },
+  {
+    question: 'Est-il dangereux de télécharger des logos JPG corporatifs ou personnels dans le convertisseur ?',
+    answer:
+      'Le moteur Canvas en JavaScript repose dans votre propre navigateur physique. Convertir des centaines de photos en ICO n\'envoie pas un seul mégaoctet vers n\'importe quel cloud.',
+  },
+];
+
+const howTo: JpgAIcoLocaleContent['howTo'] = [
+  {
+    name: 'Rassemblez les photos JPG originales',
+    text: 'Trouvez et collectez les photos conventionnelles et déposez-les en les faisant glisser dans notre carré convivial.',
+  },
+  {
+    name: 'Regardez la purification hexadécimale aveugle',
+    text: 'Le réencodage insérera nativement et rapidement les métadonnées et en-têtes générant de manière asynchrone une icône pure stricte en mémoire.',
+  },
+  {
+    name: 'Compilez plusieurs designs ZIP',
+    text: 'Terminez le travail en téléchargeant tout massivement dans un package compact en quelques secondes.',
+  },
+];
+
+const bibliography: JpgAIcoLocaleContent['bibliography'] = [
+  {
+    name: 'Structure Iconographique ICO et Utilisation Système',
+    url: 'https://en.wikipedia.org/wiki/ICO_(file_format)',
+  },
+  {
+    name: 'Standards JPEG.org',
+    url: 'https://jpeg.org/',
+  },
+];
+
+const seo: JpgAIcoLocaleContent['seo'] = [
+  {
+    type: 'title',
+    text: 'Convertisseur JPG vers ICO en Ligne Gratuit',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'Convertir JPG en ICO est nécessaire lorsque vous voulez créer des icônes personnalisées pour Windows, des Favicons pour des sites web ou des identificateurs visuels pour des applications. Le format ICO de Microsoft est le standard pour tous ces usages et notre convertisseur génère de vrais fichiers ICO avec la structure binaire correcte.',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'Une considération technique importante lors de la conversion JPG en ICO est la proportion de l\'image. Le format ICO nécessite des images carrées. Si votre JPG original est rectangulaire, notre convertisseur le centrera et le recadrera automatiquement pour s\'adapter à un format carré, préservant la partie centrale de l\'image.',
+  },
+  {
+    type: 'tip',
+    html:
+      'Pour des icônes de meilleure qualité, utilisez toujours un JPG carré haute résolution (au moins 256x256) comme source. Le convertisseur redimensionnera à la taille ICO standard en maintenant la netteté maximale possible.',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'Les fichiers ICO pour Windows peuvent contenir plusieurs résolutions (16x16, 32x32, 48x48, 256x256) dans un même fichier. Notre convertisseur génère l\'ICO à la résolution optimale selon votre image source.',
+  },
+  {
+    type: 'paragraph',
+    html:
+      'Convertissez JPG en ICO authentique avec de vrais en-têtes binaires. Recadrage automatique pour format carré. Gratuit, privé et compatible avec Windows et tous les navigateurs.',
+  },
+];
+
+const appSchema: WithContext<SoftwareApplication> = {
+  '@context': 'https://schema.org',
+  '@type': 'SoftwareApplication',
+  name: title,
+  description,
+  applicationCategory: 'UtilitiesApplication',
+  operatingSystem: 'Web',
+  offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
+  inLanguage: 'fr',
+};
+
+export const content: JpgAIcoLocaleContent = {
+  slug,
+  title,
+  description,
+  ui,
+  seo,
+  faq,
+  bibliography,
+  howTo,
+  schemas: [appSchema as any],
+};