diff --git a/.github/fern-banner.svg b/.github/fern-banner.svg
new file mode 100644
index 00000000..20b918f7
--- /dev/null
+++ b/.github/fern-banner.svg
@@ -0,0 +1,11 @@
+
diff --git a/.github/logo-dark.png b/.github/logo-dark.png
new file mode 100644
index 00000000..9bee8a9c
Binary files /dev/null and b/.github/logo-dark.png differ
diff --git a/.github/logo-white.png b/.github/logo-white.png
new file mode 100644
index 00000000..560a135b
Binary files /dev/null and b/.github/logo-white.png differ
diff --git a/.github/logo.png b/.github/logo.png
deleted file mode 100644
index 18bac950..00000000
Binary files a/.github/logo.png and /dev/null differ
diff --git a/README.md b/README.md
index a51f9c53..dfe7f3d4 100644
--- a/README.md
+++ b/README.md
@@ -1,7 +1,15 @@
-
+
+
+
+
+
Useful tools for developer and people working in IT. [Have a look !](https://it-tools.tech).
+## Sponsors
+
+[](https://bit.ly/3zBl7DG)
+
## Functionalities and roadmap
Please check the [issues](https://github.com/CorentinTh/it-tools/issues) to see if some feature listed to be implemented.
@@ -113,7 +121,7 @@ Big thanks to all the people who have already contributed!
## Credits
-Coded with ❤️ by [Corentin Thomasset](//corentin-thomasset.fr).
+Coded with ❤️ by [Corentin Thomasset](https://corentin.tech?utm_source=it-tools&utm_medium=readme).
This project is continuously deployed using [vercel.com](https://vercel.com).
diff --git a/components.d.ts b/components.d.ts
index 8e59366a..3e65c3cc 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -130,23 +130,19 @@ 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']
+ NCheckbox: typeof import('naive-ui')['NCheckbox']
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']
NH1: typeof import('naive-ui')['NH1']
NH3: typeof import('naive-ui')['NH3']
NIcon: typeof import('naive-ui')['NIcon']
- NInputNumber: typeof import('naive-ui')['NInputNumber']
NLayout: typeof import('naive-ui')['NLayout']
NLayoutSider: typeof import('naive-ui')['NLayoutSider']
NMenu: typeof import('naive-ui')['NMenu']
- NScrollbar: typeof import('naive-ui')['NScrollbar']
- NSlider: typeof import('naive-ui')['NSlider']
- NSwitch: typeof import('naive-ui')['NSwitch']
+ NSpace: typeof import('naive-ui')['NSpace']
+ NTable: typeof import('naive-ui')['NTable']
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']
@@ -156,6 +152,9 @@ declare module '@vue/runtime-core' {
PhoneParserAndFormatter: typeof import('./src/tools/phone-parser-and-formatter/phone-parser-and-formatter.vue')['default']
QrCodeGenerator: typeof import('./src/tools/qr-code-generator/qr-code-generator.vue')['default']
RandomPortGenerator: typeof import('./src/tools/random-port-generator/random-port-generator.vue')['default']
+ RegexMemo: typeof import('./src/tools/regex-memo/regex-memo.vue')['default']
+ 'RegexMemo.content': typeof import('./src/tools/regex-memo/regex-memo.content.md')['default']
+ RegexTester: typeof import('./src/tools/regex-tester/regex-tester.vue')['default']
ResultRow: typeof import('./src/tools/ipv4-range-expander/result-row.vue')['default']
RomanNumeralConverter: typeof import('./src/tools/roman-numeral-converter/roman-numeral-converter.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/locales/de.yml b/locales/de.yml
index 5a47c85d..e59ca114 100644
--- a/locales/de.yml
+++ b/locales/de.yml
@@ -38,7 +38,7 @@ about:
# Über IT-Tools
Diese wunderbare Website, erstellt mit ❤ von [Corentin
- Thomasset](https://github.com/CorentinTh), sammelt nützliche Tools für
+ Thomasset](https://corentin.tech?utm_source=it-tools&utm_medium=about), sammelt nützliche Tools für
Entwickler und Menschen, die in der IT arbeiten. Wenn du sie nützlich
findest, teile sie gerne mit Personen, von denen du denkst, dass sie sie
ebenfalls nützlich finden könnten, und vergiss nicht, sie in deiner
diff --git a/locales/en.yml b/locales/en.yml
index d09d435a..d1cd21c4 100644
--- a/locales/en.yml
+++ b/locales/en.yml
@@ -30,7 +30,7 @@ about:
content: >
# About IT-Tools
- This wonderful website, made with ❤ by [Corentin Thomasset](https://github.com/CorentinTh) , aggregates useful tools for developer and people working in IT. If you find it useful, please feel free to share it to people you think may find it useful too and don't forget to bookmark it in your shortcut bar!
+ This wonderful website, made with ❤ by [Corentin Thomasset](https://corentin.tech?utm_source=it-tools&utm_medium=about) , aggregates useful tools for developer and people working in IT. If you find it useful, please feel free to share it to people you think may find it useful too and don't forget to bookmark it in your shortcut bar!
IT Tools is open-source (under the MIT license) and free, and will always be, but it costs me money to host and renew the domain name. If you want to support my work, and encourage me to add more tools, please consider supporting by [sponsoring me](https://www.buymeacoffee.com/cthmsst).
diff --git a/locales/es.yml b/locales/es.yml
index b87502fc..2d8b2515 100644
--- a/locales/es.yml
+++ b/locales/es.yml
@@ -30,7 +30,7 @@ about:
content: >
# Sobre IT-Tools
- Este maravilloso sitio web, hecho con ❤ por [Corentin Thomasset](https://github.com/CorentinTh) , agrega herramientas útiles para desarrolladores y personas que trabajan en IT. Si lo encuentra útil, no dude en compartirlo con las personas que crea que también pueden encontrarlo útil y ¡no olvide marcarlo como favorito en su barra de accesos directos!
+ Este maravilloso sitio web, hecho con ❤ por [Corentin Thomasset](https://corentin.tech?utm_source=it-tools&utm_medium=about) , agrega herramientas útiles para desarrolladores y personas que trabajan en IT. Si lo encuentra útil, no dude en compartirlo con las personas que crea que también pueden encontrarlo útil y ¡no olvide marcarlo como favorito en su barra de accesos directos!
IT Tools es de código abierto (under the MIT license) y gratis, y siempre lo será, pero me cuesta dinero alojar y renovar el nombre de dominio. Si desea apoyar mi trabajo y animarme a agregar más herramientas, considere apoyarme a través de[sponsoring me](https://www.buymeacoffee.com/cthmsst).
@@ -39,7 +39,7 @@ about:
IT Tools está creado en Vue.js (Vue 3) con la biblioteca de componentes Naive UI y Vercel lo aloja y lo implementa continuamente. En algunas herramientas se utilizan bibliotecas de código abierto de terceros; puede encontrar la lista completa en [package.json](https://github.com/CorentinTh/it-tools/blob/main/package.json) archivo del repositorio.
## ¿Encontraste un error? ¿Falta una herramienta?
-
+
Si necesita una herramienta que actualmente no está presente aquí y cree que puede ser útil, puede enviar una solicitud de función en el [issues section](https://github.com/CorentinTh/it-tools/issues/new/choose) en el repositorio de GitHub.
Y si encontró un error o algo no funciona como se esperaba, presente un reporte de error en el [issues section](https://github.com/CorentinTh/it-tools/issues/new/choose) en el repositorio de GitHub.
@@ -68,4 +68,4 @@ tools:
math: Math
measurement: Measurement
text: Text
- data: Data
\ No newline at end of file
+ data: Data
diff --git a/locales/fr.yml b/locales/fr.yml
index 35c7df2e..cd5cc0e8 100644
--- a/locales/fr.yml
+++ b/locales/fr.yml
@@ -29,7 +29,7 @@ about:
content: >
# À propos de IT-Tools
- Ce merveilleux site, fait avec ❤ par [Corentin Thomasset](https://github.com/CorentinTh), regroupe des outils utiles pour les développeurs et les personnes travaillant dans l'informatique. Si vous le trouvez utile, n'hésitez pas à le partager et n'oubliez pas de le mettre dans vos favoris !
+ Ce merveilleux site, fait avec ❤ par [Corentin Thomasset](https://corentin.tech?utm_source=it-tools&utm_medium=about), regroupe des outils utiles pour les développeurs et les personnes travaillant dans l'informatique. Si vous le trouvez utile, n'hésitez pas à le partager et n'oubliez pas de le mettre dans vos favoris !
IT Tools est open-source (sous licence MIT) et gratuit, et le restera toujours, mais cela me coûte de l'argent pour l'héberger et renouveler le nom de domaine. Si vous voulez soutenir mon travail, et m'encourager à ajouter plus d'outils, n'hésitez pas à me [soutenir](https://www.buymeacoffee.com/cthmsst).
diff --git a/locales/pt.yml b/locales/pt.yml
index 96fdaed4..822bea8a 100644
--- a/locales/pt.yml
+++ b/locales/pt.yml
@@ -30,7 +30,7 @@ about:
content: >
# Sobre o IT-Tools
- Este site maravilhoso, feito com ❤ por [Corentin Thomasset](https://github.com/CorentinTh), junta ferramentas úteis para desenvolvedores e outras pessoas que trabalham com TI. Se você achar o site útil, fique à vontade para compartilhar com quem também possa gostar e não esqueça de salvar o bookmark na sua barra de atalhos!
+ Este site maravilhoso, feito com ❤ por [Corentin Thomasset](https://corentin.tech?utm_source=it-tools&utm_medium=about), junta ferramentas úteis para desenvolvedores e outras pessoas que trabalham com TI. Se você achar o site útil, fique à vontade para compartilhar com quem também possa gostar e não esqueça de salvar o bookmark na sua barra de atalhos!
O IT Tools é código aberto (sob a licença MIT), é gratuito, e sempre será, mas custa dinheiro para hospedar e renovar o domínio. Se quiser apoiar meu trabalho e me encorajar a adicionar mais ferramentas, por favor considere [ser patrocinador](https://www.buymeacoffee.com/cthmsst).
diff --git a/locales/uk.yml b/locales/uk.yml
index 2d28f157..ad455a7d 100644
--- a/locales/uk.yml
+++ b/locales/uk.yml
@@ -30,7 +30,7 @@ about:
content: >
# Про IT-Tools
- Цей чудовий вебсайт, створений з ❤ [Corentin Thomasset](https://github.com/CorentinTh), агрегує корисні інструменти для розробників і людей, які працюють в сфері IT. Якщо вам це корисно, будь ласка, поділіться цим з людьми, які, на вашу думку, також можуть знайти його корисним, і не забудьте додати його до закладок у вашій панелі швидкого доступу!
+ Цей чудовий вебсайт, створений з ❤ [Corentin Thomasset](https://corentin.tech?utm_source=it-tools&utm_medium=about), агрегує корисні інструменти для розробників і людей, які працюють в сфері IT. Якщо вам це корисно, будь ласка, поділіться цим з людьми, які, на вашу думку, також можуть знайти його корисним, і не забудьте додати його до закладок у вашій панелі швидкого доступу!
IT Tools є відкритим програмним забезпеченням (під ліцензією MIT) і безкоштовним, і завжди буде таким, але мені коштує гроші для хостингу і продовження доменного імені. Якщо ви хочете підтримати мою роботу і підтримати мене у додаванні нових інструментів, розгляньте можливість підтримки, [спонсоруючи мене](https://www.buymeacoffee.com/cthmsst).
diff --git a/locales/vi.yml b/locales/vi.yml
index 9eb16bf0..de574a6c 100644
--- a/locales/vi.yml
+++ b/locales/vi.yml
@@ -30,7 +30,7 @@ about:
content: >
# Về IT-Tools
- Website tuyệt vời này, được tạo ra bằng ❤ bởi [Corentin Thomasset](https://github.com/CorentinTh), tổng hợp các công cụ hữu ích cho nhà phát triển và những người làm việc trong lĩnh vực IT. Nếu bạn thấy nó hữu ích, xin đừng ngần ngại chia sẻ cho những người mà bạn nghĩ sẽ thấy nó hữu ích và đừng quên đánh dấu nó trong thanh lối tắt của bạn!
+ Website tuyệt vời này, được tạo ra bằng ❤ bởi [Corentin Thomasset](https://corentin.tech?utm_source=it-tools&utm_medium=about), tổng hợp các công cụ hữu ích cho nhà phát triển và những người làm việc trong lĩnh vực IT. Nếu bạn thấy nó hữu ích, xin đừng ngần ngại chia sẻ cho những người mà bạn nghĩ sẽ thấy nó hữu ích và đừng quên đánh dấu nó trong thanh lối tắt của bạn!
IT Tools là mã nguồn mở (dưới giấy phép MIT) và miễn phí, và sẽ luôn như vậy, nhưng tôi phải trả tiền để lưu trữ và gia hạn tên miền. Nếu bạn muốn hỗ trợ công việc của tôi, và khích lệ tôi thêm nhiều công cụ hơn, hãy xem xét hỗ trợ bằng cách [tài trợ cho tôi](https://www.buymeacoffee.com/cthmsst).
diff --git a/locales/zh.yml b/locales/zh.yml
index 947e6bac..5a34834c 100644
--- a/locales/zh.yml
+++ b/locales/zh.yml
@@ -30,7 +30,7 @@ about:
content: >
# 关于 IT-Tools
- IT-Tools 由 [Corentin Thomasset](https://github.com/CorentinTh) 用 ❤ 开发，汇集了对开发人员和 IT 从业者有用的工具。如果对您有帮助，请将其分享给您的朋友，并且添加到收藏夹中！
+ IT-Tools 由 [Corentin Thomasset](https://corentin.tech?utm_source=it-tools&utm_medium=about) 用 ❤ 开发，汇集了对开发人员和 IT 从业者有用的工具。如果对您有帮助，请将其分享给您的朋友，并且添加到收藏夹中！
IT-Tools 永久免费且开源（MIT 许可证），但需要资金用于托管和续订域名。如果您想支持我的工作，并鼓励我添加更多工具，请考虑通过 [赞助我](https://www.buymeacoffee.com/cthmsst) 进行支持。
diff --git a/package.json b/package.json
index 63e5856a..8a1c069f 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,14 @@
{
"name": "it-tools",
"version": "2024.5.13-a0bc346",
+ "packageManager": "pnpm@8.15.3",
"description": "Collection of handy online tools for developers, with great UX. ",
+ "author": "Corentin Th (https://corentin.tech)",
+ "license": "GNU GPLv3",
+ "repository": {
+ "type": "git",
+ "url": "https://github.com/CorentinTh/it-tools"
+ },
"keywords": [
"productivity",
"converter",
@@ -13,12 +20,6 @@
"developer-tools",
"developer-productivity"
],
- "author": "Corentin Th (https://github.com/CorentinTh)",
- "license": "GNU GPLv3",
- "repository": {
- "type": "git",
- "url": "https://github.com/CorentinTh/it-tools"
- },
"scripts": {
"dev": "vite",
"build": "vue-tsc --noEmit && NODE_OPTIONS=--max_old_space_size=4096 vite build",
@@ -37,12 +38,13 @@
"dependencies": {
"@it-tools/bip39": "^0.0.4",
"@it-tools/oggen": "^1.3.0",
+ "@regexper/render": "^1.0.0",
"@sindresorhus/slugify": "^2.2.1",
"@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",
+ "@types/markdown-it": "^13.0.7",
"@vicons/material": "^0.12.0",
"@vicons/tabler": "^0.12.0",
"@vueuse/core": "^10.3.0",
@@ -84,6 +86,7 @@
"pinia": "^2.0.34",
"plausible-tracker": "^0.3.8",
"qrcode": "^1.5.1",
+ "randexp": "^0.5.3",
"sql-formatter": "^13.0.0",
"ua-parser-js": "^1.0.35",
"ulid": "^2.3.0",
@@ -93,6 +96,7 @@
"vue": "^3.3.4",
"vue-i18n": "^9.9.1",
"vue-router": "^4.1.6",
+ "vue-shadow-dom": "^4.2.0",
"vue-tsc": "^1.8.1",
"xml-formatter": "^3.3.2",
"xml-js": "^1.6.11",
@@ -142,6 +146,5 @@
"vitest": "^0.34.0",
"workbox-window": "^7.0.0",
"zx": "^7.2.1"
- },
- "packageManager": "pnpm@8.15.3"
+ }
}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 2311f3af..e43a3217 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -11,6 +11,9 @@ dependencies:
'@it-tools/oggen':
specifier: ^1.3.0
version: 1.3.0
+ '@regexper/render':
+ specifier: ^1.0.0
+ version: 1.0.0
'@sindresorhus/slugify':
specifier: ^2.2.1
version: 2.2.1
@@ -152,6 +155,9 @@ dependencies:
qrcode:
specifier: ^1.5.1
version: 1.5.1
+ randexp:
+ specifier: ^0.5.3
+ version: 0.5.3
sql-formatter:
specifier: ^13.0.0
version: 13.0.0
@@ -179,6 +185,9 @@ dependencies:
vue-router:
specifier: ^4.1.6
version: 4.1.6(vue@3.3.4)
+ vue-shadow-dom:
+ specifier: ^4.2.0
+ version: 4.2.0
vue-tsc:
specifier: ^1.8.1
version: 1.8.1(typescript@5.2.2)
@@ -2480,6 +2489,17 @@ packages:
resolution: {integrity: sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==}
dev: false
+ /@regexper/parser@1.0.0:
+ resolution: {integrity: sha512-S8AWIGpCNdl9PNHdbhI6TpXZsPk6FDU/RTZI+6UFF4rVFqDQKjCIbZSgFu7NihoEZKq57wKFPbbT1EzrjVvPHA==}
+ dev: false
+
+ /@regexper/render@1.0.0:
+ resolution: {integrity: sha512-xYm9RUgnhhZotTtf8UZpK1PG2CcTRXQ3JPwfTlYUZsy2J+UcTVc7BaO/MJadpMoVuT8jrIyptH4Y0HLzqhI3hQ==}
+ dependencies:
+ '@regexper/parser': 1.0.0
+ '@svgdotjs/svg.js': 3.2.4
+ dev: false
+
/@remirror/core-constants@2.0.1:
resolution: {integrity: sha512-ZR4aihtnnT9lMbhh5DEbsriJRlukRXmLZe7HmM+6ufJNNUDoazc75UX26xbgQlNUqgAqMcUdGFAnPc1JwgAdLQ==}
dependencies:
@@ -2629,6 +2649,10 @@ packages:
string.prototype.matchall: 4.0.10
dev: true
+ /@svgdotjs/svg.js@3.2.4:
+ resolution: {integrity: sha512-BjJ/7vWNowlX3Z8O4ywT58DqbNRyYlkk6Yz/D13aB7hGmfQTvGX4Tkgtm/ApYlu9M7lCQi15xUEidqMUmdMYwg==}
+ dev: false
+
/@tiptap/core@2.1.12(@tiptap/pm@2.1.6):
resolution: {integrity: sha512-ZGc3xrBJA9KY8kln5AYTj8y+GDrKxi7u95xIl2eccrqTY5CQeRu6HRNM1yT4mAjuSaG9jmazyjGRlQuhyxCKxQ==}
peerDependencies:
@@ -4962,6 +4986,11 @@ packages:
tslib: 2.5.0
dev: false
+ /drange@1.1.1:
+ resolution: {integrity: sha512-pYxfDYpued//QpnLIm4Avk7rsNtAtQkUES2cwAYSvD/wd2pKD71gN2Ebj3e7klzXwjocvE8c5vx/1fxwpqmSxA==}
+ engines: {node: '>=4'}
+ dev: false
+
/duplexer@0.1.2:
resolution: {integrity: sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg==}
dev: true
@@ -7758,6 +7787,14 @@ packages:
ret: 0.1.15
dev: false
+ /randexp@0.5.3:
+ resolution: {integrity: sha512-U+5l2KrcMNOUPYvazA3h5ekF80FHTUG+87SEAmHZmolh1M+i/WyTCxVzmi+tidIa1tM4BSe8g2Y/D3loWDjj+w==}
+ engines: {node: '>=4'}
+ dependencies:
+ drange: 1.1.1
+ ret: 0.2.2
+ dev: false
+
/randombytes@2.1.0:
resolution: {integrity: sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==}
dependencies:
@@ -7928,6 +7965,11 @@ packages:
engines: {node: '>=0.12'}
dev: false
+ /ret@0.2.2:
+ resolution: {integrity: sha512-M0b3YWQs7R3Z917WRQy1HHA7Ba7D8hvZg6UE5mLykJxQVE2ju0IXbGlaHPPlkY+WN7wFP+wUMXmBFA0aV6vYGQ==}
+ engines: {node: '>=4'}
+ dev: false
+
/reusify@1.0.4:
resolution: {integrity: sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==}
engines: {iojs: '>=1.0.0', node: '>=0.10.0'}
@@ -9268,6 +9310,10 @@ packages:
vue: 3.3.4
dev: false
+ /vue-shadow-dom@4.2.0:
+ resolution: {integrity: sha512-lguI064rT2HT/dxqSmXtz860KOvCq+W3nU1jMqroTmX3K1H46q22BMR4emh/Ld3ozy35XJKOaNGcr6mkJ/t/yg==}
+ dev: false
+
/vue-template-compiler@2.7.14:
resolution: {integrity: sha512-zyA5Y3ArvVG0NacJDkkzJuPQDF8RFeRlzV2vLeSnhSpieO6LK2OVbdLPi5MPPs09Ii+gMO8nY4S3iKQxBxDmWQ==}
dependencies:
diff --git a/src/composable/queryParams.ts b/src/composable/queryParams.ts
index 9699abbc..7cc8cc0d 100644
--- a/src/composable/queryParams.ts
+++ b/src/composable/queryParams.ts
@@ -1,7 +1,8 @@
import { useRouteQuery } from '@vueuse/router';
import { computed } from 'vue';
+import { useStorage } from '@vueuse/core';
-export { useQueryParam };
+export { useQueryParam, useQueryParamOrStorage };
const transformers = {
number: {
@@ -16,6 +17,12 @@ const transformers = {
fromQuery: (value: string) => value.toLowerCase() === 'true',
toQuery: (value: boolean) => (value ? 'true' : 'false'),
},
+ object: {
+ fromQuery: (value: string) => {
+ return JSON.parse(value);
+ },
+ toQuery: (value: object) => JSON.stringify(value),
+ },
};
function useQueryParam({ name, defaultValue }: { name: string; defaultValue: T }) {
@@ -33,3 +40,27 @@ function useQueryParam({ name, defaultValue }: { name: string; defaultValue:
},
});
}
+
+function useQueryParamOrStorage({ name, storageName, defaultValue }: { name: string; storageName: string; defaultValue: T }) {
+ const type = typeof defaultValue;
+ const transformer = transformers[type as keyof typeof transformers] ?? transformers.string;
+
+ const storageRef = useStorage(storageName, defaultValue);
+ const proxyDefaultValue = transformer.toQuery(defaultValue as never);
+ const proxy = useRouteQuery(name, proxyDefaultValue);
+
+ const r = ref(defaultValue);
+
+ watch(r,
+ (value) => {
+ proxy.value = transformer.toQuery(value as never);
+ storageRef.value = value as never;
+ },
+ { deep: true });
+
+ r.value = (proxy.value && proxy.value !== proxyDefaultValue
+ ? transformer.fromQuery(proxy.value) as unknown as T
+ : storageRef.value as T) as never;
+
+ return r;
+}
diff --git a/src/composable/validation.ts b/src/composable/validation.ts
index 472ca4b2..33a6a7b2 100644
--- a/src/composable/validation.ts
+++ b/src/composable/validation.ts
@@ -3,9 +3,11 @@ import _ from 'lodash';
import { type Ref, reactive, watch } from 'vue';
type ValidatorReturnType = unknown;
+type GetErrorMessageReturnType = string;
export interface UseValidationRule {
validator: (value: T) => ValidatorReturnType
+ getErrorMessage?: (value: T) => GetErrorMessageReturnType
message: string
}
@@ -24,6 +26,15 @@ export function isFalsyOrHasThrown(cb: () => ValidatorReturnType): boolean {
}
}
+export function getErrorMessageOrThrown(cb: () => GetErrorMessageReturnType): string {
+ try {
+ return cb() || '';
+ }
+ catch (e: any) {
+ return e.toString();
+ }
+}
+
export interface ValidationAttrs {
feedback: string
validationStatus: string | undefined
@@ -61,7 +72,13 @@ export function useValidation({
for (const rule of get(rules)) {
if (isFalsyOrHasThrown(() => rule.validator(source.value))) {
- state.message = rule.message;
+ if (rule.getErrorMessage) {
+ const getErrorMessage = rule.getErrorMessage;
+ state.message = rule.message.replace('{0}', getErrorMessageOrThrown(() => getErrorMessage(source.value)));
+ }
+ else {
+ state.message = rule.message;
+ }
state.status = 'error';
}
}
diff --git a/src/config.ts b/src/config.ts
index 2558d038..fa2421ef 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -59,6 +59,12 @@ export const config = figue({
default: false,
env: 'VITE_SHOW_BANNER',
},
+ showSponsorBanner: {
+ doc: 'Show the sponsor banner',
+ format: 'boolean',
+ default: false,
+ env: 'VITE_SHOW_SPONSOR_BANNER',
+ },
})
.loadEnv({
...import.meta.env,
diff --git a/src/layouts/base.layout.vue b/src/layouts/base.layout.vue
index 62ac5113..ef534209 100644
--- a/src/layouts/base.layout.vue
+++ b/src/layouts/base.layout.vue
@@ -81,7 +81,7 @@ const tools = computed(() => [
diff --git a/src/tools/index.ts b/src/tools/index.ts
index c9003fe8..388cfaf4 100644
--- a/src/tools/index.ts
+++ b/src/tools/index.ts
@@ -9,6 +9,8 @@ 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 regexTester } from './regex-tester';
+import { tool as regexMemo } from './regex-memo';
import { tool as markdownToHtml } from './markdown-to-html';
import { tool as pdfSignatureChecker } from './pdf-signature-checker';
import { tool as numeronymGenerator } from './numeronym-generator';
@@ -156,6 +158,8 @@ export const toolsByCategory: ToolCategory[] = [
xmlFormatter,
yamlViewer,
emailNormalizer,
+ regexTester,
+ regexMemo,
],
},
{
diff --git a/src/tools/regex-memo/index.ts b/src/tools/regex-memo/index.ts
new file mode 100644
index 00000000..f1f56489
--- /dev/null
+++ b/src/tools/regex-memo/index.ts
@@ -0,0 +1,12 @@
+import { BrandJavascript } from '@vicons/tabler';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+ name: 'Regex cheatsheet',
+ path: '/regex-memo',
+ description: 'Javascript Regex/Regular Expression cheatsheet',
+ keywords: ['regex', 'regular', 'expression', 'javascript', 'memo', 'cheatsheet'],
+ component: () => import('./regex-memo.vue'),
+ icon: BrandJavascript,
+ createdAt: new Date('2024-09-20'),
+});
diff --git a/src/tools/regex-memo/regex-memo.content.md b/src/tools/regex-memo/regex-memo.content.md
new file mode 100644
index 00000000..0f779401
--- /dev/null
+++ b/src/tools/regex-memo/regex-memo.content.md
@@ -0,0 +1,121 @@
+### Normal characters
+
+Expression | Description
+:--|:--
+`.` or `[^\n\r]` | any character *excluding* a newline or carriage return
+`[A-Za-z]` | alphabet
+`[a-z]` | lowercase alphabet
+`[A-Z]` | uppercase alphabet
+`\d` or `[0-9]` | digit
+`\D` or `[^0-9]` | non-digit
+`_` | underscore
+`\w` or `[A-Za-z0-9_]` | alphabet, digit or underscore
+`\W` or `[^A-Za-z0-9_]` | inverse of `\w`
+`\S` | inverse of `\s`
+
+### Whitespace characters
+
+Expression | Description
+:--|:--
+` ` | space
+`\t` | tab
+`\n` | newline
+`\r` | carriage return
+`\s` | space, tab, newline or carriage return
+
+### Character set
+
+Expression | Description
+:--|:--
+`[xyz]` | either `x`, `y` or `z`
+`[^xyz]` | neither `x`, `y` nor `z`
+`[1-3]` | either `1`, `2` or `3`
+`[^1-3]` | neither `1`, `2` nor `3`
+
+- Think of a character set as an `OR` operation on the single characters that are enclosed between the square brackets.
+- Use `^` after the opening `[` to “negate” the character set.
+- Within a character set, `.` means a literal period.
+
+### Characters that require escaping
+
+#### Outside a character set
+
+Expression | Description
+:--|:--
+`\.` | period
+`\^` | caret
+`\$` | dollar sign
+`\|` | pipe
+`\\` | back slash
+`\/` | forward slash
+`\(` | opening bracket
+`\)` | closing bracket
+`\[` | opening square bracket
+`\]` | closing square bracket
+`\{` | opening curly bracket
+`\}` | closing curly bracket
+
+#### Inside a character set
+
+Expression | Description
+:--|:--
+`\\` | back slash
+`\]` | closing square bracket
+
+- A `^` must be escaped only if it occurs immediately after the opening `[` of the character set.
+- A `-` must be escaped only if it occurs between two alphabets or two digits.
+
+### Quantifiers
+
+Expression | Description
+:--|:--
+`{2}` | exactly 2
+`{2,}` | at least 2
+`{2,7}` | at least 2 but no more than 7
+`*` | 0 or more
+`+` | 1 or more
+`?` | exactly 0 or 1
+
+- The quantifier goes *after* the expression to be quantified.
+
+### Boundaries
+
+Expression | Description
+:--|:--
+`^` | start of string
+`$` | end of string
+`\b` | word boundary
+
+- How word boundary matching works:
+ - At the beginning of the string if the first character is `\w`.
+ - Between two adjacent characters within the string, if the first character is `\w` and the second character is `\W`.
+ - At the end of the string if the last character is `\w`.
+
+### Matching
+
+Expression | Description
+:--|:--
+`foo\|bar` | match either `foo` or `bar`
+`foo(?=bar)` | match `foo` if it’s before `bar`
+`foo(?!bar)` | match `foo` if it’s *not* before `bar`
+`(?<=bar)foo` | match `foo` if it’s after `bar`
+`(?
+import { useThemeVars } from 'naive-ui';
+import Memo from './regex-memo.content.md';
+
+const themeVars = useThemeVars();
+
+
+
+
+