Merge a455c178d5 into 87984e2081

* feat(new tool): Markdown to HTML

Fix partially #538

* feat: add print button

* Update src/tools/markdown-to-html/index.ts

* Update src/tools/markdown-to-html/markdown-to-html.vue

---------

Co-authored-by: Corentin THOMASSET <corentin.thomasset74@gmail.com>

components.d.ts

@@ -72,6 +72,7 @@ declare module '@vue/runtime-core' {
     DockerRunToDockerComposeConverter: typeof import('./src/tools/docker-run-to-docker-compose-converter/docker-run-to-docker-compose-converter.vue')['default']
     DynamicValues: typeof import('./src/tools/benchmark-builder/dynamic-values.vue')['default']
     Editor: typeof import('./src/tools/html-wysiwyg-editor/editor/editor.vue')['default']
+    EmailNormalizer: typeof import('./src/tools/email-normalizer/email-normalizer.vue')['default']
     EmojiCard: typeof import('./src/tools/emoji-picker/emoji-card.vue')['default']
     EmojiGrid: typeof import('./src/tools/emoji-picker/emoji-grid.vue')['default']
     EmojiPicker: typeof import('./src/tools/emoji-picker/emoji-picker.vue')['default']
@@ -110,6 +111,7 @@ declare module '@vue/runtime-core' {
     JsonMinify: typeof import('./src/tools/json-minify/json-minify.vue')['default']
     JsonToCsv: typeof import('./src/tools/json-to-csv/json-to-csv.vue')['default']
     JsonToToml: typeof import('./src/tools/json-to-toml/json-to-toml.vue')['default']
+    JsonToXml: typeof import('./src/tools/json-to-xml/json-to-xml.vue')['default']
     JsonToYaml: typeof import('./src/tools/json-to-yaml-converter/json-to-yaml.vue')['default']
     JsonViewer: typeof import('./src/tools/json-viewer/json-viewer.vue')['default']
     JwtParser: typeof import('./src/tools/jwt-parser/jwt-parser.vue')['default']
@@ -119,6 +121,7 @@ declare module '@vue/runtime-core' {
     LoremIpsumGenerator: typeof import('./src/tools/lorem-ipsum-generator/lorem-ipsum-generator.vue')['default']
     MacAddressGenerator: typeof import('./src/tools/mac-address-generator/mac-address-generator.vue')['default']
     MacAddressLookup: typeof import('./src/tools/mac-address-lookup/mac-address-lookup.vue')['default']
+    MarkdownToHtml: typeof import('./src/tools/markdown-to-html/markdown-to-html.vue')['default']
     MathEvaluator: typeof import('./src/tools/math-evaluator/math-evaluator.vue')['default']
     MenuBar: typeof import('./src/tools/html-wysiwyg-editor/editor/menu-bar.vue')['default']
     MenuBarItem: typeof import('./src/tools/html-wysiwyg-editor/editor/menu-bar-item.vue')['default']
@@ -127,24 +130,23 @@ declare module '@vue/runtime-core' {
     MetaTagGenerator: typeof import('./src/tools/meta-tag-generator/meta-tag-generator.vue')['default']
     MimeTypes: typeof import('./src/tools/mime-types/mime-types.vue')['default']
     NavbarButtons: typeof import('./src/components/NavbarButtons.vue')['default']
+    NButton: typeof import('naive-ui')['NButton']
     NCode: typeof import('naive-ui')['NCode']
     NCollapseTransition: typeof import('naive-ui')['NCollapseTransition']
     NConfigProvider: typeof import('naive-ui')['NConfigProvider']
-    NDivider: typeof import('naive-ui')['NDivider']
     NEllipsis: typeof import('naive-ui')['NEllipsis']
+    NForm: typeof import('naive-ui')['NForm']
     NFormItem: typeof import('naive-ui')['NFormItem']
-    NGi: typeof import('naive-ui')['NGi']
-    NGrid: typeof import('naive-ui')['NGrid']
     NH1: typeof import('naive-ui')['NH1']
     NH3: typeof import('naive-ui')['NH3']
     NIcon: typeof import('naive-ui')['NIcon']
     NInputNumber: typeof import('naive-ui')['NInputNumber']
-    NLabel: typeof import('naive-ui')['NLabel']
     NLayout: typeof import('naive-ui')['NLayout']
     NLayoutSider: typeof import('naive-ui')['NLayoutSider']
     NMenu: typeof import('naive-ui')['NMenu']
     NScrollbar: typeof import('naive-ui')['NScrollbar']
-    NSpin: typeof import('naive-ui')['NSpin']
+    NSlider: typeof import('naive-ui')['NSlider']
+    NSwitch: typeof import('naive-ui')['NSwitch']
     NumeronymGenerator: typeof import('./src/tools/numeronym-generator/numeronym-generator.vue')['default']
     OtpCodeGeneratorAndValidator: typeof import('./src/tools/otp-code-generator-and-validator/otp-code-generator-and-validator.vue')['default']
     PasswordStrengthAnalyser: typeof import('./src/tools/password-strength-analyser/password-strength-analyser.vue')['default']
@@ -186,6 +188,7 @@ declare module '@vue/runtime-core' {
     UuidGenerator: typeof import('./src/tools/uuid-generator/uuid-generator.vue')['default']
     WifiQrCodeGenerator: typeof import('./src/tools/wifi-qr-code-generator/wifi-qr-code-generator.vue')['default']
     XmlFormatter: typeof import('./src/tools/xml-formatter/xml-formatter.vue')['default']
+    XmlToJson: typeof import('./src/tools/xml-to-json/xml-to-json.vue')['default']
     YamlToJson: typeof import('./src/tools/yaml-to-json-converter/yaml-to-json.vue')['default']
     YamlToToml: typeof import('./src/tools/yaml-to-toml/yaml-to-toml.vue')['default']
     YamlViewer: typeof import('./src/tools/yaml-viewer/yaml-viewer.vue')['default']

locales/it.yml

@@ -0,0 +1,390 @@
+home:
+  categories:
+    newestTools: Strumenti più recenti
+    favoriteTools: I tuoi strumenti preferiti
+    allTools: Tutti gli strumenti
+  subtitle: Strumenti utili per gli sviluppatori
+  toggleMenu: Menu a tendina
+  home: Home
+  uiLib: 'UI Lib'
+  support: Supporta lo sviluppo di IT-Tools
+  buyMeACoffee: Offrimi un caffè
+  follow:
+    title: Ti piace it-tools?
+    p1: Lasciaci una stella
+    githubRepository: Repository GitHub di IT-Tools
+    p2: o seguiteci su
+    twitterAccount: Account Twitter di IT-Tools
+    thankYou: Grazie!
+  nav:
+    github: Repository GitHub
+    githubRepository: Repository GitHub di IT-Tools
+    twitter: Account Twitter
+    twitterAccount: Account Twitter di IT-Tools
+    about: Informazioni su IT-Tools
+    aboutLabel: Informazioni
+    darkMode: Modalità scura
+    lightMode: Modalità chiara
+    mode: Cambia modalità scura/chiara
+about:
+  content: >
+    # Informazioni su IT-Tools
+
+    Questo meraviglioso sito web, realizzato con ❤ da [Corentin Thomasset](https://github.com/CorentinTh) , aggrega strumenti utili per gli sviluppatori e persone che lavorano nel settore IT. Se lo trovate utile, sentitevi liberi di condividerlo con le persone che pensate possano trovarlo utile e non dimenticate di metterlo tra i preferiti nella vostra barra dei segnalibri!
+
+    IT Tools è open-source (sotto licenza MIT) e gratuito, e lo sarà sempre, ma mi costa ospitare e rinnovare il nome del dominio. Se volete sostenere il mio lavoro e incoraggiarmi ad aggiungere altri strumenti, prendete in considerazione l'idea di supportarmi [sponsorizzami](https://www.buymeacoffee.com/cthmsst).
+
+    ## Tecnologie
+
+    IT Tools è realizzato in Vue.js (Vue 3) con la libreria di componenti Naive UI ed è ospitato, distribuito e utilizato da Vercel. In alcuni strumenti sono utilizzate altre librerie open-source di terze parti; l'elenco completo si trova nel file [package.json](https://github.com/CorentinTh/it-tools/blob/main/package.json) del repository.
+
+    ## Trovato un bug? Manca uno strumento?
+
+    Se avete bisogno di uno strumento che attualmente non è già presente e pensate che possa essere utile, siete invitati ad inviare una richiesta di funzionalità nella sezione [issues](https://github.com/CorentinTh/it-tools/issues/new/choose) del repository GitHub.
+
+    Se avete trovato un bug o qualcosa che non funziona come previsto, inviate una segnalazione di bug nella sezione [issues](https://github.com/CorentinTh/it-tools/issues/new/choose) del repository GitHub.
+
+404:
+  notFound: 404 Non trovato
+  sorry: Spiacente, questa pagina non sembra esistere
+  maybe: Forse la cache sta facendo cose strane, dovremmo provare a fare un refresh forzato?
+  backHome: Ritorno alla home
+favoriteButton:
+  remove: Rimuovi dai preferiti
+  add: Aggiungi ai preferiti
+toolCard:
+  new: Nuovo
+search:
+  label: Cerca
+tools:
+  categories:
+    favorite-tools: I tuoi strumenti preferiti
+    crypto: Crittografia
+    converter: Convertitore
+    web: Web
+    images and videos: Immagini & Video
+    development: Sviluppo
+    network: Rete
+    math: Matematica
+    measurement: Misurazione
+    text: Testo
+    data: Dati
+
+  password-strength-analyser:
+    title: Analizzatore della resistenza delle password
+    description: Scoprite la forza della vostra password con questo strumento client-side-only di analisi della forza delle password e che stima il tempo di cracking.
+
+  chronometer:
+    title: Cronometro
+    description: Monitora la durata di un'azione. In pratica è un cronometro con semplici funzioni di cronometro.
+
+  token-generator:
+    title: Generatore di token
+    description: Genera una stringa casuale con caratteri che desideri, lettere maiuscole o minuscole, numeri e/o simboli.
+
+    uppercase: Maiuscole (ABC...)
+    lowercase: Minuscole (abc...)
+    numbers: Numeri (123...)
+    symbols: Simboli (!-;...)
+    length: Lunghezza
+    tokenPlaceholder: Il token...
+    copied: Token copiato negli appunti
+    button:
+      copy: Copia
+      refresh: Aggiorna
+
+  percentage-calculator:
+    title: Calcolatore di percentuale
+    description: Calcolare facilmente le percentuali da un valore ad un altro valore o da una percentuale ad un valore.
+
+  svg-placeholder-generator:
+    title: Generatore di placeholder SVG
+    description: Genera immagini svg da utilizzare come placeholder nelle applicazioni.
+
+  json-to-csv:
+    title: Da JSON a CSV
+    description: Convertire da JSON a CSV con rilevamento automatico del'header
+
+  camera-recorder:
+    title: Registratore con videocamera
+    description: Scatta una foto o registra un video dalla webcam o dalla fotocamera.
+
+  keycode-info:
+    title: info Keycode
+    description: Trova il keycode javascript, il codice, la posizione e i modificatori di qualsiasi tasto premuto.
+
+  emoji-picker:
+    title: Selezionatore di emoji
+    description: Copia e incolla facilmente le emoji e ottieni l'unicode e il valore punti di codice di ciascuna emoji.
+
+  color-converter:
+    title: Convertitore di colori
+    description: Converte i colori tra i diversi formati (hex, rgb, hsl e nome css)
+
+  bcrypt:
+    title: Bcrypt
+    description: Hash e comparazione di stringhe di testo con bcrypt. Bcrypt è una funzione di password-hashing basata sul cifrario Blowfish.
+
+  crontab-generator:
+    title: Generatore di Crontab
+    description: Convalida e genera crontab e ottiene la descrizione leggibile dall'uomo della pianificazione di cron.
+
+  http-status-codes:
+    title: Codici di stato HTTP
+    description: L'elenco di tutti i codici di stato HTTP, il loro nome e il loro significato.
+
+  sql-prettify:
+    title: SQL, semplificazione e formattazione
+    description: Formattare e preconfigurare le query SQL online (supporta diversi linguaggi SQL).
+
+  benchmark-builder:
+    title: Costruttore di benchmark
+    description: Confronta facilmente i tempi di esecuzione delle attività con questo semplice strumento di benchmark online.
+
+  git-memo:
+    title: Git cheatsheet
+    description: Git è un software di gestione delle versioni decentralizzato. Con questo cheatsheet, avrete accesso rapido ai comandi git più comuni.
+
+  slugify-string:
+    title: Stringa slugify
+    description: Rende sicure le stringhe url, nome file e id.
+
+  encryption:
+    title: Criptare / decriptare il testo
+    description: Cifrare il testo in chiaro e decifrare il testo cifrato utilizzando algoritmi di crittografia come AES, TripleDES, Rabbit o RC4.
+
+  random-port-generator:
+    title: Generatore di porte casuali
+    description: Genera numeri di porta casuali al di fuori dell'intervallo di porte "note" (0-1023).
+
+  yaml-prettify:
+    title: Semplifica e Formatta YAML
+    description: Semplifica la tua stringa YAML in un formato amichevole e leggibile dall'uomo.
+
+  eta-calculator:
+    title: Calcolatore ETA
+    description: Un calcolatore di ETA (Estimated Time of Arrival) per determinare l'ora approssimativa di fine di un'attività, ad esempio l'ora e la durata del download di un file.
+
+  roman-numeral-converter:
+    title: Convertitore di numeri romani
+    description: Conversione di numeri romani in numeri e conversione di numeri in numeri romani.
+
+  hmac-generator:
+    title: Generatore Hmac
+    description: Calcola un codice di autenticazione dei messaggi basato su hash (HMAC) utilizzando una chiave segreta e la funzione di hashing desiderata.
+
+  bip39-generator:
+    title: Generatore di passphrase BIP39
+    description: Genera una passphrase BIP39 da un mnemonic esistente o casuale, oppure ottenere il mnemonic dalla passphrase.
+
+  base64-file-converter:
+    title: Convertitore di file Base64.
+    description: Converte una stringa, un file o un'immagine nella sua versione in base64.
+
+  list-converter:
+    title: Convertitore di lista
+    description: Questo strumento può elaborare dati basati su colonne e applicare varie modifiche (trasposizione, aggiunta di prefissi e suffissi, inversione dell'elenco, ordinamento dell'elenco, valori minuscoli, troncamento dei valori) a ogni riga.
+
+  base64-string-converter:
+    title: Codificatore/decodificatore di stringhe Base64
+    description: Codifica e decodifica semplicemente le stringhe nella loro versione in base64.
+
+  toml-to-yaml:
+    title: Da TOML a YAML
+    description: Analizza e converte TOML in YAML.
+
+  math-evaluator:
+    title: Valutatore matematico
+    description: Una calcolatrice per la valutazione di espressioni matematiche. È possibile utilizzare funzioni come sqrt, cos, sin, abs, ecc.
+
+  json-to-yaml-converter:
+    title: Convertitore da JSON a YAML
+    description: Facile converte online da JSON in YAML.
+
+  url-parser:
+    title: Analizzatore di URL
+    description: Analizza un URL nelle sue parti costitutive (protocollo, origine, parametri, porta, nome utente e password, ...).
+
+  iban-validator-and-parser:
+    title: Convalidatore e analizzatore di IBAN
+    description: Convalida e analizza i numeri IBAN. Controlla se un IBAN è valido e ottiene il paese, il BBAN, se è un QR-IBAN e il formato IBAN friendly.
+
+  user-agent-parser:
+    title: Analizzatore User-agent
+    description: Rileva e analizza il tipo/modello di browser, motore, sistema operativo, CPU e dispositivo da una stringa di user-agent.
+
+  numeronym-generator:
+    title: Generatore numeronimo
+    description: Un numeronimo è una parola in cui un numero è usato per formare un'abbreviazione. Ad esempio, "i18n" è un numeronimo di "internationalization", dove 18 rappresenta il numero di lettere tra la prima i e l'ultima n della parola.
+
+  case-converter:
+    title: Convertitore di carattere 
+    description: Trasforma il carattere di una stringa e sceglie tra diversi formati
+
+  json-prettify: 
+    title: Semplifica e Formatta JSON
+    description: Semplifica la stringa JSON in un formato facile da leggere per l'uomo.
+
+  docker-run-to-docker-compose-converter:
+    title: Convertitore da Docker run a Docker compose
+    description: Trasforma i comandi "docker run" in file docker-compose!
+
+  mac-address-lookup:
+    title: Ricerca dell'indirizzo MAC
+    description: Trova il fornitore e il produttore di un dispositivo in base al suo indirizzo MAC.
+
+  mime-types:
+    title: Tipi MIME
+    description: Converte i tipi MIME in estensioni di file e viceversa.
+
+  toml-to-json:
+    title: Da TOML a JSON
+    description: Analizza e converte TOML in JSON.
+
+  lorem-ipsum-generator:
+    title: Generatore Lorem ipsum
+    description: Lorem ipsum è un testo placeholder comunemente utilizzato per dimostrare la forma visiva di un documento o di un carattere tipografico senza fare affidamento su un contenuto significativo.
+
+  qrcode-generator:
+    title: Generatore di codici QR
+    description: Genera e scarica un codice QR per un URL (o un semplice testo) e personalizza i colori di sfondo e il primo piano.
+
+  wifi-qrcode-generator:
+    title: Generatore di codici QR WiFi
+    description: Genera e scarica codici QR per collegarsi rapidamente alle reti WiFi.
+
+  xml-formatter:
+    title: Semplificatore e Formattatore XML
+    description: Semplifica la stringa XML in un formato leggibile dall'uomo.
+
+  temperature-converter:
+    title: Convertitore di temperatura
+    description: Converte la temperatura in gradi per Kelvin, Celsius, Fahrenheit, Rankine, Delisle, Newton, Réaumur e Rømer.
+
+  chmod-calculator:
+    title: Calcolatrice Chmod
+    description: Calcola i vostri permessi e i comandi chmod con questo calcolatore chmod online.
+
+  rsa-key-pair-generator:
+    title: Generatore di coppie di chiavi RSA
+    description: Genera una nuova coppia casuale di chiavi RSA private e pubbliche per certificati pem.
+
+  html-wysiwyg-editor:
+    title: Editor HTML WYSIWYG
+    description: Editor online HTML WYSIWYG e ricco di funzioni che genera immediatamente il codice sorgente dei contenuti.
+
+  yaml-to-toml:
+    title: Da YAML a TOML
+    description: Analizza e converte YAML in TOML.
+
+  mac-address-generator:
+    title: Generatore di indirizzi MAC
+    description: Immettere la quantità e il prefisso. Gli indirizzi MAC saranno generati nel caso scelto (maiuscolo o minuscolo).
+
+  json-diff:
+    title: Diff JSON
+    description: Confronta due oggetti JSON e individua le differenze.
+
+  jwt-parser:
+    title: Analizzatore JWT
+    description: Analizza e decodifica il token web JSON (jwt) e ne visualizza il contenuto.
+
+  date-converter:
+    title: Convertitore data-ora
+    description: Converte la data e l'ora nei vari formati
+
+  phone-parser-and-formatter:
+    title: Analizzatore e formattatore di telefono
+    description: Analizza, convalida e formatta i numeri di telefono. Ottiene informazioni sul numero di telefono, come il codice del paese, il tipo, ecc.
+
+  ipv4-subnet-calculator:
+    title: Calcolatore di sottorete IPv4
+    description: Analizza i blocchi CIDR IPv4 e ottiene tutte le informazioni necessarie per la sottorete.
+
+  og-meta-generator:
+    title: Generatore Open graph meta
+    description: Genera meta tag HTML, open-graph e social per il vostro sito web.
+
+  ipv6-ula-generator:
+    title: Generatore di ULA IPv6
+    description: Generare indirizzi IP locali e non indirizabili per la propria rete, secondo la norma RFC4193.
+
+  hash-text:
+    title: Testo Hash
+    description: "Esegue l'hash di una stringa di testo utilizzando la funzione desiderata: MD5, SHA1, SHA256, SHA224, SHA512, SHA384, SHA3 o RIPEMD160."
+
+  json-to-toml:
+    title: Da JSON a TOML
+    description: Analizza e converte JSON in TOML.
+
+  device-information:
+    title: Informazioni sul dispositivo
+    description: Ottiene informazioni sul dispositivo attuale (dimensioni dello schermo, rapporto pixel, user agent, ...)
+
+  pdf-signature-checker:
+    title: Verificatore di firma PDF
+    description: Verifica delle firme di un file PDF. Un file PDF firmato contiene una o più firme che possono essere utilizzate per determinare se il contenuto del file è stato alterato da quando è stato firmato.
+
+  json-minify:
+    title: Minimizatore JSON
+    description: Minimizza e comprime il JSON eliminando gli spazi bianchi non necessari.
+
+  ulid-generator:
+    title: Generatore ULID
+    description: Genera casualmente un Universally Unique Lexicographically Sortable Identifier (ULID).
+
+  string-obfuscator:
+    title: Offuscatore di stringhe
+    description: Offusca una stringa (come un segreto, un IBAN o un token) per renderla condivisibile e identificabile senza rivelarne il contenuto.
+
+  base-converter:
+    title: Convertitore di basi intere
+    description: Converte un numero tra diverse basi (decimale, esadecimale, binaria, ottale, base64, ...)
+
+  yaml-to-json-converter:
+    title: Convertitore da YAML a JSON
+    description: Converte facilmente YAML in JSON con questo convertitore online.
+
+  uuid-generator:
+    title: Generatore di UUID
+    description: Un UUID (Universally Unique Identifier) è un numero di 128 bit utilizzato per identificare le informazioni nei sistemi informatici. I numeri possibili di UUID sono 16^32, cioè 2^128 o circa 3,4x10^38 (che sono tanti!).
+
+  ipv4-address-converter:
+    title: Convertitore di indirizzi IPv4
+    description: Converte un indirizzo IP in decimale, binario, esadecimale o anche in una rappresentazione IPv6.
+
+  text-statistics:
+    title: Statistiche sul testo
+    description: Ottiene informazioni su un testo, il numero di caratteri, il numero di parole, la sua dimensione in byte, ...
+
+  text-to-nato-alphabet:
+    title: Testo in alfabeto NATO
+    description: Trasforma il testo in alfabeto fonetico NATO per la comunicazione orale.
+
+  basic-auth-generator:
+    title: Generatore basico di autenticazioni
+    description: Genera un'header in base64 per l'autenticazione da un nome utente e una password.
+
+  text-to-unicode:
+    title: Da testo a Unicode
+    description: Analizza e converte il testo in unicode e viceversa
+
+  ipv4-range-expander:
+    title: Espansore di intervallo IPv4
+    description: Dato un indirizzo IPv4 iniziale e uno finale, questo strumento calcola una sottorete IPv4 valida con la sua notazione CIDR.
+
+  text-diff:
+    title: Diff testo
+    description: Confronta due testi e vede le differenza tra di loro.
+
+  otp-generator:
+    title: Generatore di codici OTP
+    description: Genera e convalida OTP (one time password) a tempo per l'autenticazione a più fattori.
+
+  url-encoder:
+    title: Codifica/decodifica delle stringhe URL formattate
+    description: Codifica il testo in formato URL (noto anche come "percent-encoded") o lo decodifica.
+
+  text-to-binary:
+    title: Da testo a binario ASCII
+    description: Converte il testo nella sua rappresentazione binaria ASCII e viceversa.

package.json

@@ -41,6 +41,7 @@
     "@tiptap/pm": "2.1.6",
     "@tiptap/starter-kit": "2.1.6",
     "@tiptap/vue-3": "2.0.3",
+    "@types/markdown-it": "^13.0.7",
     "@types/figlet": "^1.5.8",
     "@vicons/material": "^0.12.0",
     "@vicons/tabler": "^0.12.0",
@@ -57,6 +58,7 @@
     "crypto-js": "^4.1.1",
     "date-fns": "^2.29.3",
     "dompurify": "^3.0.6",
+    "email-normalizer": "^1.0.0",
     "emojilib": "^3.0.10",
     "figlet": "^1.7.0",
     "figue": "^1.2.0",
@@ -69,6 +71,7 @@
     "jwt-decode": "^3.1.2",
     "libphonenumber-js": "^1.10.28",
     "lodash": "^4.17.21",
+    "markdown-it": "^14.0.0",
     "marked": "^10.0.0",
     "mathjs": "^11.9.1",
     "mime-types": "^2.1.35",
@@ -92,6 +95,7 @@
     "vue-router": "^4.1.6",
     "vue-tsc": "^1.8.1",
     "xml-formatter": "^3.3.2",
+    "xml-js": "^1.6.11",
     "yaml": "^2.2.1"
   },
   "devDependencies": {

pnpm-lock.yaml

@@ -26,6 +26,9 @@ dependencies:
   '@types/figlet':
     specifier: ^1.5.8
     version: 1.5.8
+  '@types/markdown-it':
+    specifier: ^13.0.7
+    version: 13.0.9
   '@vicons/material':
     specifier: ^0.12.0
     version: 0.12.0
@@ -71,6 +74,9 @@ dependencies:
   dompurify:
     specifier: ^3.0.6
     version: 3.0.6
+  email-normalizer:
+    specifier: ^1.0.0
+    version: 1.0.0
   emojilib:
     specifier: ^3.0.10
     version: 3.0.10
@@ -107,6 +113,9 @@ dependencies:
   lodash:
     specifier: ^4.17.21
     version: 4.17.21
+  markdown-it:
+    specifier: ^14.0.0
+    version: 14.1.0
   marked:
     specifier: ^10.0.0
     version: 10.0.0
@@ -176,6 +185,9 @@ dependencies:
   xml-formatter:
     specifier: ^3.3.2
     version: 3.3.2
+  xml-js:
+    specifier: ^1.6.11
+    version: 1.6.11
   yaml:
     specifier: ^2.2.1
     version: 2.2.1
@@ -2946,7 +2958,6 @@ packages:
 
   /@types/linkify-it@3.0.2:
     resolution: {integrity: sha512-HZQYqbiFVWufzCwexrvh694SOim8z2d+xJl5UNamcvQFejLY/2YUtzXHYi3cHdI7PMlS8ejH2slRAOJQ32aNbA==}
-    dev: true
 
   /@types/lodash-es@4.17.10:
     resolution: {integrity: sha512-YJP+w/2khSBwbUSFdGsSqmDvmnN3cCKoPOL7Zjle6s30ZtemkkqhjVfFqGwPN7ASil5VyjE2GtyU/yqYY6mC0A==}
@@ -2968,6 +2979,13 @@ packages:
       '@types/mdurl': 1.0.2
     dev: true
 
+  /@types/markdown-it@13.0.9:
+    resolution: {integrity: sha512-1XPwR0+MgXLWfTn9gCsZ55AHOKW1WN+P9vr0PaQh5aerR9LLQXUbjfEAFhjmEmyoYFWAyuN2Mqkn40MZ4ukjBw==}
+    dependencies:
+      '@types/linkify-it': 3.0.2
+      '@types/mdurl': 1.0.2
+    dev: false
+
   /@types/mdast@3.0.11:
     resolution: {integrity: sha512-Y/uImid8aAwrEA24/1tcRZwpxX3pIFTSilcNDKSPn+Y2iDywSEachzRuvgAYYLR3wpGXAsMbv5lvKLDZLeYPAw==}
     dependencies:
@@ -2976,7 +2994,6 @@ packages:
 
   /@types/mdurl@1.0.2:
     resolution: {integrity: sha512-eC4U9MlIcu2q0KQmXszyn5Akca/0jrQmwDRgpAMJai7qBWq4amIQhZyNau4VYGtCeALvW1/NtjzJJ567aZxfKA==}
-    dev: true
 
   /@types/mime-types@2.1.1:
     resolution: {integrity: sha512-vXOTGVSLR2jMw440moWTC7H19iUyLtP3Z1YTj7cSsubOICinjMxFeb/V57v9QdyyPGbbWolUFSSmSiRSn94tFw==}
@@ -3354,7 +3371,7 @@ packages:
     dependencies:
       '@unhead/dom': 0.5.1
       '@unhead/schema': 0.5.1
-      '@vueuse/shared': 10.8.0(vue@3.3.4)
+      '@vueuse/shared': 11.0.3(vue@3.3.4)
       unhead: 0.5.1
       vue: 3.3.4
     transitivePeerDependencies:
@@ -3996,10 +4013,10 @@ packages:
       - vue
     dev: false
 
-  /@vueuse/shared@10.8.0(vue@3.3.4):
-    resolution: {integrity: sha512-dUdy6zwHhULGxmr9YUg8e+EnB39gcM4Fe2oKBSrh3cOsV30JcMPtsyuspgFCUo5xxFNaeMf/W2yyKfST7Bg8oQ==}
+  /@vueuse/shared@11.0.3(vue@3.3.4):
+    resolution: {integrity: sha512-0rY2m6HS5t27n/Vp5cTDsKTlNnimCqsbh/fmT2LgE+aaU42EMfXo8+bNX91W9I7DDmxfuACXMmrd7d79JxkqWA==}
     dependencies:
-      vue-demi: 0.14.7(vue@3.3.4)
+      vue-demi: 0.14.10(vue@3.3.4)
     transitivePeerDependencies:
       - '@vue/composition-api'
       - vue
@@ -4973,6 +4990,12 @@ packages:
   /electron-to-chromium@1.4.572:
     resolution: {integrity: sha512-RlFobl4D3ieetbnR+2EpxdzFl9h0RAJkPK3pfiwMug2nhBin2ZCsGIAJWdpNniLz43sgXam/CgipOmvTA+rUiA==}
 
+  /email-normalizer@1.0.0:
+    resolution: {integrity: sha512-wZYuuMtL4kUOmg/TPtCrf9hAZjbFq+FcjWA85Z5nr2lGllRnWJPxCJw3gy4Cx+adMoyVw4VJfGGvt/OHgIW+qg==}
+    dependencies:
+      typescript: 5.5.4
+    dev: false
+
   /emitter-component@1.1.1:
     resolution: {integrity: sha512-G+mpdiAySMuB7kesVRLuyvYRqDmshB7ReKEVuyBPkzQlmiDiLrt7hHHIy4Aff552bgknVN7B2/d3lzhGO5dvpQ==}
     dev: false
@@ -5004,7 +5027,6 @@ packages:
   /entities@4.5.0:
     resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==}
     engines: {node: '>=0.12'}
-    dev: true
 
   /errno@0.1.8:
     resolution: {integrity: sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==}
@@ -6676,6 +6698,12 @@ packages:
     dependencies:
       uc.micro: 1.0.6
 
+  /linkify-it@5.0.0:
+    resolution: {integrity: sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==}
+    dependencies:
+      uc.micro: 2.1.0
+    dev: false
+
   /local-pkg@0.4.3:
     resolution: {integrity: sha512-SFppqq5p42fe2qcZQqqEOiVRXl+WCP1MdT6k7BDEW1j++sp5fIY+/fdRQitvKgB5BrBcmrs5m/L0v2FrU5MY1g==}
     engines: {node: '>=14'}
@@ -6813,6 +6841,18 @@ packages:
       mdurl: 1.0.1
       uc.micro: 1.0.6
 
+  /markdown-it@14.1.0:
+    resolution: {integrity: sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==}
+    hasBin: true
+    dependencies:
+      argparse: 2.0.1
+      entities: 4.5.0
+      linkify-it: 5.0.0
+      mdurl: 2.0.0
+      punycode.js: 2.3.1
+      uc.micro: 2.1.0
+    dev: false
+
   /marked@10.0.0:
     resolution: {integrity: sha512-YiGcYcWj50YrwBgNzFoYhQ1hT6GmQbFG8SksnYJX1z4BXTHSOrz1GB5/Jm2yQvMg4nN1FHP4M6r03R10KrVUiA==}
     engines: {node: '>= 18'}
@@ -6861,6 +6901,10 @@ packages:
   /mdurl@1.0.1:
     resolution: {integrity: sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g==}
 
+  /mdurl@2.0.0:
+    resolution: {integrity: sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==}
+    dev: false
+
   /merge-stream@2.0.0:
     resolution: {integrity: sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==}
     dev: true
@@ -7670,6 +7714,11 @@ packages:
     resolution: {integrity: sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==}
     dev: true
 
+  /punycode.js@2.3.1:
+    resolution: {integrity: sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==}
+    engines: {node: '>=6'}
+    dev: false
+
   /punycode@2.3.0:
     resolution: {integrity: sha512-rRV+zQD8tVFys26lAGR9WUuS4iUAngJScM+ZRSKtvl5tKeZ2t5bvdNFdNHBW9FWR4guGHlgmsZ1G7BSm2wTbuA==}
     engines: {node: '>=6'}
@@ -7959,8 +8008,6 @@ packages:
   /sax@1.2.4:
     resolution: {integrity: sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==}
     requiresBuild: true
-    dev: true
-    optional: true
 
   /saxes@6.0.0:
     resolution: {integrity: sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==}
@@ -8603,6 +8650,12 @@ packages:
     engines: {node: '>=14.17'}
     hasBin: true
 
+  /typescript@5.5.4:
+    resolution: {integrity: sha512-Mtq29sKDAEYP7aljRgtPOpTvOfbwRWlS6dPRzwjdE+C0R4brX/GUyhHSecbHMFLNBLcJIPt9nl9yG5TZ1weH+Q==}
+    engines: {node: '>=14.17'}
+    hasBin: true
+    dev: false
+
   /ua-parser-js@1.0.35:
     resolution: {integrity: sha512-fKnGuqmTBnIE+/KXSzCn4db8RTigUzw1AN0DmdU6hJovUTbYJKyqj+8Mt1c4VfRDnOVJnENmfYkIPZ946UrSAA==}
     dev: false
@@ -8610,6 +8663,10 @@ packages:
   /uc.micro@1.0.6:
     resolution: {integrity: sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA==}
 
+  /uc.micro@2.1.0:
+    resolution: {integrity: sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A==}
+    dev: false
+
   /ufo@1.1.2:
     resolution: {integrity: sha512-TrY6DsjTQQgyS3E3dBaOXf0TpPD8u9FVrVYmKVegJuFw51n/YB9XPt+U6ydzFG5ZIN7+DIjPbNmXoBj9esYhgQ==}
 
@@ -9143,8 +9200,8 @@ packages:
       vue: 3.3.4
     dev: false
 
-  /vue-demi@0.14.5(vue@3.3.4):
-    resolution: {integrity: sha512-o9NUVpl/YlsGJ7t+xuqJKx8EBGf1quRhCiT6D/J0pfwmk9zUwYkC7yrF4SZCe6fETvSM3UNL2edcbYrSyc4QHA==}
+  /vue-demi@0.14.10(vue@3.3.4):
+    resolution: {integrity: sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==}
     engines: {node: '>=12'}
     hasBin: true
     requiresBuild: true
@@ -9158,8 +9215,8 @@ packages:
       vue: 3.3.4
     dev: false
 
-  /vue-demi@0.14.7(vue@3.3.4):
-    resolution: {integrity: sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==}
+  /vue-demi@0.14.5(vue@3.3.4):
+    resolution: {integrity: sha512-o9NUVpl/YlsGJ7t+xuqJKx8EBGf1quRhCiT6D/J0pfwmk9zUwYkC7yrF4SZCe6fETvSM3UNL2edcbYrSyc4QHA==}
     engines: {node: '>=12'}
     hasBin: true
     requiresBuild: true
@@ -9449,6 +9506,7 @@ packages:
 
   /workbox-google-analytics@7.0.0:
     resolution: {integrity: sha512-MEYM1JTn/qiC3DbpvP2BVhyIH+dV/5BjHk756u9VbwuAhu0QHyKscTnisQuz21lfRpOwiS9z4XdqeVAKol0bzg==}
+    deprecated: It is not compatible with newer versions of GA starting with v4, as long as you are using GAv3 it should be ok, but the package is not longer being maintained
     dependencies:
       workbox-background-sync: 7.0.0
       workbox-core: 7.0.0
@@ -9549,6 +9607,13 @@ packages:
       xml-parser-xo: 4.0.5
     dev: false
 
+  /xml-js@1.6.11:
+    resolution: {integrity: sha512-7rVi2KMfwfWFl+GpPg6m80IVMWXLRjO+PxTq7V2CDhoGak0wzYzFgUY2m4XJ47OGdXd8eLE8EmwfAmdjw7lC1g==}
+    hasBin: true
+    dependencies:
+      sax: 1.2.4
+    dev: false
+
   /xml-name-validator@4.0.0:
     resolution: {integrity: sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==}
     engines: {node: '>=12'}

src/components/TextareaCopyable.vue

@@ -7,6 +7,7 @@ import sqlHljs from 'highlight.js/lib/languages/sql';
 import xmlHljs from 'highlight.js/lib/languages/xml';
 import yamlHljs from 'highlight.js/lib/languages/yaml';
 import iniHljs from 'highlight.js/lib/languages/ini';
+import markdownHljs from 'highlight.js/lib/languages/markdown';
 import { useCopy } from '@/composable/copy';
 
 const props = withDefaults(
@@ -30,6 +31,7 @@ hljs.registerLanguage('html', xmlHljs);
 hljs.registerLanguage('xml', xmlHljs);
 hljs.registerLanguage('yaml', yamlHljs);
 hljs.registerLanguage('toml', iniHljs);
+hljs.registerLanguage('markdown', markdownHljs);
 
 const { value, language, followHeightOf, copyPlacement, copyMessage } = toRefs(props);
 const { height } = followHeightOf.value ? useElementSize(followHeightOf) : { height: ref(null) };

src/modules/i18n/components/locale-selector.vue

@@ -6,6 +6,7 @@ const localesLong: Record<string, string> = {
   de: 'Deutsch',
   es: 'Español',
   fr: 'Français',
+  it: 'Italian',
   pt: 'Português',
   ru: 'Русский',
   uk: 'Українська',

src/tools/email-normalizer/email-normalizer.vue

@@ -0,0 +1,65 @@
+<script setup lang="ts">
+import { normalizeEmail } from 'email-normalizer';
+import { withDefaultOnError } from '@/utils/defaults';
+import { useCopy } from '@/composable/copy';
+
+const emails = ref('');
+const normalizedEmails = computed(() => {
+  if (!emails.value) {
+    return '';
+  }
+
+  return emails.value
+    .split('\n')
+    .map((email) => {
+      return withDefaultOnError(() => normalizeEmail({ email }), `Unable to parse email: ${email}`);
+    })
+    .join('\n');
+});
+
+const { copy } = useCopy({ source: normalizedEmails, text: 'Normalized emails copied to the clipboard', createToast: true });
+</script>
+
+<template>
+  <div>
+    <div class="mb-2">
+      Raw emails to normalize:
+    </div>
+    <c-input-text
+      v-model:value="emails"
+      placeholder="Put your emails here (one per line)..."
+      rows="3"
+      multiline
+      autocomplete="off"
+      autocorrect="off"
+      autocapitalize="off"
+      spellcheck="false"
+      autofocus
+      monospace
+    />
+
+    <div class="mb-2 mt-4">
+      Normalized emails:
+    </div>
+    <c-input-text
+      :value="normalizedEmails"
+      placeholder="Normalized emails will appear here..."
+      rows="3"
+      autocomplete="off"
+      autocorrect="off"
+      autocapitalize="off"
+      spellcheck="false"
+      multiline
+      readonly
+      monospace
+    />
+    <div class="mt-4 flex justify-center gap-2">
+      <c-button @click="emails = ''">
+        Clear emails
+      </c-button>
+      <c-button :disabled="!normalizedEmails" @click="copy()">
+        Copy normalized emails
+      </c-button>
+    </div>
+  </div>
+</template>

src/tools/email-normalizer/index.ts

@@ -0,0 +1,12 @@
+import { Mail } from '@vicons/tabler';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+  name: 'Email normalizer',
+  path: '/email-normalizer',
+  description: 'Normalize email addresses to a standard format for easier comparison. Useful for deduplication and data cleaning.',
+  keywords: ['email', 'normalizer'],
+  component: () => import('./email-normalizer.vue'),
+  icon: Mail,
+  createdAt: new Date('2024-08-15'),
+});

src/tools/index.ts

@@ -1,11 +1,15 @@
 import { tool as base64FileConverter } from './base64-file-converter';
 import { tool as base64StringConverter } from './base64-string-converter';
 import { tool as basicAuthGenerator } from './basic-auth-generator';
+import { tool as emailNormalizer } from './email-normalizer';
 
 import { tool as asciiTextDrawer } from './ascii-text-drawer';
 
 import { tool as textToUnicode } from './text-to-unicode';
 import { tool as safelinkDecoder } from './safelink-decoder';
+import { tool as xmlToJson } from './xml-to-json';
+import { tool as jsonToXml } from './json-to-xml';
+import { tool as markdownToHtml } from './markdown-to-html';
 import { tool as pdfSignatureChecker } from './pdf-signature-checker';
 import { tool as numeronymGenerator } from './numeronym-generator';
 import { tool as macAddressGenerator } from './mac-address-generator';
@@ -107,6 +111,9 @@ export const toolsByCategory: ToolCategory[] = [
       listConverter,
       tomlToJson,
       tomlToYaml,
+      xmlToJson,
+      jsonToXml,
+      markdownToHtml,
     ],
   },
   {
@@ -148,6 +155,7 @@ export const toolsByCategory: ToolCategory[] = [
       dockerRunToDockerComposeConverter,
       xmlFormatter,
       yamlViewer,
+      emailNormalizer,
     ],
   },
   {

src/tools/json-to-xml/index.ts

@@ -0,0 +1,12 @@
+import { Braces } from '@vicons/tabler';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+  name: 'JSON to XML',
+  path: '/json-to-xml',
+  description: 'Convert JSON to XML',
+  keywords: ['json', 'xml'],
+  component: () => import('./json-to-xml.vue'),
+  icon: Braces,
+  createdAt: new Date('2024-08-09'),
+});

src/tools/json-to-xml/json-to-xml.vue

@@ -0,0 +1,32 @@
+<script setup lang="ts">
+import convert from 'xml-js';
+import JSON5 from 'json5';
+import { withDefaultOnError } from '@/utils/defaults';
+import type { UseValidationRule } from '@/composable/validation';
+
+const defaultValue = '{"a":{"_attributes":{"x":"1.234","y":"It\'s"}}}';
+function transformer(value: string) {
+  return withDefaultOnError(() => {
+    return convert.js2xml(JSON5.parse(value), { compact: true });
+  }, '');
+}
+
+const rules: UseValidationRule<string>[] = [
+  {
+    validator: (v: string) => v === '' || JSON5.parse(v),
+    message: 'Provided JSON is not valid.',
+  },
+];
+</script>
+
+<template>
+  <format-transformer
+    input-label="Your JSON content"
+    :input-default="defaultValue"
+    input-placeholder="Paste your JSON content here..."
+    output-label="Converted XML"
+    output-language="xml"
+    :transformer="transformer"
+    :input-validation-rules="rules"
+  />
+</template>

src/tools/lorem-ipsum-generator/lorem-ipsum-generator.vue

@@ -2,6 +2,7 @@
 import { generateLoremIpsum } from './lorem-ipsum-generator.service';
 import { useCopy } from '@/composable/copy';
 import { randIntFromInterval } from '@/utils/random';
+import { computedRefreshable } from '@/composable/computedRefreshable';
 
 const paragraphs = ref(1);
 const sentences = ref([3, 8]);
@@ -9,7 +10,7 @@ const words = ref([8, 15]);
 const startWithLoremIpsum = ref(true);
 const asHTML = ref(false);
 
-const loremIpsumText = computed(() =>
+const [loremIpsumText, refreshLoremIpsum] = computedRefreshable(() =>
   generateLoremIpsum({
     paragraphCount: paragraphs.value,
     asHTML: asHTML.value,
@@ -18,6 +19,7 @@ const loremIpsumText = computed(() =>
     startWithLoremIpsum: startWithLoremIpsum.value,
   }),
 );
+
 const { copy } = useCopy({ source: loremIpsumText, text: 'Lorem ipsum copied to the clipboard' });
 </script>
 
@@ -41,10 +43,13 @@ const { copy } = useCopy({ source: loremIpsumText, text: 'Lorem ipsum copied to
 
     <c-input-text :value="loremIpsumText" multiline placeholder="Your lorem ipsum..." readonly mt-5 rows="5" />
 
-    <div mt-5 flex justify-center>
+    <div mt-5 flex justify-center gap-3>
       <c-button autofocus @click="copy()">
         Copy
       </c-button>
+      <c-button @click="refreshLoremIpsum">
+        Refresh
+      </c-button>
     </div>
   </c-card>
 </template>

src/tools/markdown-to-html/index.ts

@@ -0,0 +1,12 @@
+import { Markdown } from '@vicons/tabler';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+  name: 'Markdown to HTML',
+  path: '/markdown-to-html',
+  description: 'Convert Markdown to Html and allow to print (as PDF)',
+  keywords: ['markdown', 'html', 'converter', 'pdf'],
+  component: () => import('./markdown-to-html.vue'),
+  icon: Markdown,
+  createdAt: new Date('2024-08-25'),
+});

src/tools/markdown-to-html/markdown-to-html.vue

@@ -0,0 +1,44 @@
+<script setup lang="ts">
+import markdownit from 'markdown-it';
+import TextareaCopyable from '@/components/TextareaCopyable.vue';
+
+const inputMarkdown = ref('');
+const outputHtml = computed(() => {
+  const md = markdownit();
+  return md.render(inputMarkdown.value);
+});
+
+function printHtml() {
+  const w = window.open();
+  if (w === null) {
+    return;
+  }
+  w.document.body.innerHTML = outputHtml.value;
+  w.print();
+}
+</script>
+
+<template>
+  <div>
+    <c-input-text
+      v-model:value="inputMarkdown"
+      multiline raw-text
+      placeholder="Your Markdown content..."
+      rows="8"
+      autofocus
+      label="Your Markdown to convert:"
+    />
+
+    <n-divider />
+
+    <n-form-item label="Output HTML:">
+      <TextareaCopyable :value="outputHtml" :word-wrap="true" language="html" />
+    </n-form-item>
+
+    <div flex justify-center>
+      <n-button @click="printHtml">
+        Print as PDF
+      </n-button>
+    </div>
+  </div>
+</template>

src/tools/xml-to-json/index.ts

@@ -0,0 +1,12 @@
+import { Braces } from '@vicons/tabler';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+  name: 'XML to JSON',
+  path: '/xml-to-json',
+  description: 'Convert XML to JSON',
+  keywords: ['xml', 'json'],
+  component: () => import('./xml-to-json.vue'),
+  icon: Braces,
+  createdAt: new Date('2024-08-09'),
+});

src/tools/xml-to-json/xml-to-json.vue

@@ -0,0 +1,32 @@
+<script setup lang="ts">
+import convert from 'xml-js';
+import { isValidXML } from '../xml-formatter/xml-formatter.service';
+import { withDefaultOnError } from '@/utils/defaults';
+import type { UseValidationRule } from '@/composable/validation';
+
+const defaultValue = '<a x="1.234" y="It\'s"/>';
+function transformer(value: string) {
+  return withDefaultOnError(() => {
+    return JSON.stringify(convert.xml2js(value, { compact: true }), null, 2);
+  }, '');
+}
+
+const rules: UseValidationRule<string>[] = [
+  {
+    validator: isValidXML,
+    message: 'Provided XML is not valid.',
+  },
+];
+</script>
+
+<template>
+  <format-transformer
+    input-label="Your XML content"
+    :input-default="defaultValue"
+    input-placeholder="Paste your XML content here..."
+    output-label="Converted JSON"
+    output-language="json"
+    :transformer="transformer"
+    :input-validation-rules="rules"
+  />
+</template>