diff --git a/.eslintrc-auto-import.json b/.eslintrc-auto-import.json index 4084d922..086a67de 100644 --- a/.eslintrc-auto-import.json +++ b/.eslintrc-auto-import.json @@ -286,6 +286,7 @@ "watchTriggerable": true, "watchWithFilter": true, "whenever": true, - "toValue": true + "toValue": true, + "WritableComputedRef": true } } diff --git a/auto-imports.d.ts b/auto-imports.d.ts index 186963f1..62c4dc6f 100644 --- a/auto-imports.d.ts +++ b/auto-imports.d.ts @@ -1,6 +1,7 @@ /* eslint-disable */ /* prettier-ignore */ // @ts-nocheck +// noinspection JSUnusedGlobalSymbols // Generated by unplugin-auto-import export {} declare global { @@ -288,7 +289,7 @@ declare global { // for type re-export declare global { // @ts-ignore - export type { Component, ComponentPublicInstance, ComputedRef, InjectionKey, PropType, Ref, VNode } from 'vue' + export type { Component, ComponentPublicInstance, ComputedRef, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue' } // for vue template auto import import { UnwrapRef } from 'vue' diff --git a/components.d.ts b/components.d.ts index 1a5ce1a9..7ce4afed 100644 --- a/components.d.ts +++ b/components.d.ts @@ -3,11 +3,9 @@ // @ts-nocheck // Generated by unplugin-vue-components // Read more: https://github.com/vuejs/core/pull/3399 -import '@vue/runtime-core' - export {} -declare module '@vue/runtime-core' { +declare module 'vue' { export interface GlobalComponents { '404.page': typeof import('./src/pages/404.page.vue')['default'] About: typeof import('./src/pages/About.vue')['default'] @@ -74,6 +72,7 @@ declare module '@vue/runtime-core' { HmacGenerator: typeof import('./src/tools/hmac-generator/hmac-generator.vue')['default'] 'Home.page': typeof import('./src/pages/Home.page.vue')['default'] HtmlEntities: typeof import('./src/tools/html-entities/html-entities.vue')['default'] + HtmlMdConverter: typeof import('./src/tools/html-md-converter/html-md-converter.vue')['default'] HtmlWysiwygEditor: typeof import('./src/tools/html-wysiwyg-editor/html-wysiwyg-editor.vue')['default'] HttpStatusCodes: typeof import('./src/tools/http-status-codes/http-status-codes.vue')['default'] IbanValidatorAndParser: typeof import('./src/tools/iban-validator-and-parser/iban-validator-and-parser.vue')['default'] diff --git a/package.json b/package.json index d3ec93bf..b49f67de 100644 --- a/package.json +++ b/package.json @@ -76,6 +76,7 @@ "qrcode": "^1.5.1", "randombytes": "^2.1.0", "sql-formatter": "^13.0.0", + "turndown": "^7.1.2", "ua-parser-js": "^1.0.35", "ulid": "^2.3.0", "unicode-emoji-json": "^0.4.0", @@ -105,6 +106,7 @@ "@types/node-forge": "^1.3.2", "@types/qrcode": "^1.5.0", "@types/randombytes": "^2.0.0", + "@types/turndown": "^5.0.2", "@types/ua-parser-js": "^0.7.36", "@types/uuid": "^9.0.0", "@unocss/eslint-config": "^0.55.0", diff --git a/src/tools/html-md-converter/html-md-converter-service.ts b/src/tools/html-md-converter/html-md-converter-service.ts new file mode 100644 index 00000000..3f0b2d41 --- /dev/null +++ b/src/tools/html-md-converter/html-md-converter-service.ts @@ -0,0 +1,13 @@ +import TurnDownService from 'turndown'; + +const turnDownService = new TurnDownService(); + +/** + * Converts the given HTML string to Markdown format. + * + * @param html - The HTML string to convert. + * @returns The converted Markdown string. + */ +export const convertHtmlToMarkdown = (html: string): string => { + return turnDownService.turndown(html); +}; diff --git a/src/tools/html-md-converter/html-md-converter.vue b/src/tools/html-md-converter/html-md-converter.vue new file mode 100644 index 00000000..8faf1252 --- /dev/null +++ b/src/tools/html-md-converter/html-md-converter.vue @@ -0,0 +1,27 @@ + + + + diff --git a/src/tools/html-md-converter/index.ts b/src/tools/html-md-converter/index.ts new file mode 100644 index 00000000..41272b97 --- /dev/null +++ b/src/tools/html-md-converter/index.ts @@ -0,0 +1,11 @@ +import {BrandHtml5} from '@vicons/tabler'; +import { defineTool } from '../tool'; + +export const tool = defineTool({ + name: 'HTML-MD converter', + path: '/html-md-converter', + description: 'Convert an html div with all contained data to Markdown using turndown', + keywords: ['html', 'md', 'converter'], + component: () => import('./html-md-converter.vue'), + icon: BrandHtml5, +}); \ No newline at end of file diff --git a/src/tools/index.ts b/src/tools/index.ts index cc5f42ee..de31f011 100644 --- a/src/tools/index.ts +++ b/src/tools/index.ts @@ -71,6 +71,7 @@ import { tool as urlParser } from './url-parser'; import { tool as uuidGenerator } from './uuid-generator'; import { tool as macAddressLookup } from './mac-address-lookup'; import { tool as xmlFormatter } from './xml-formatter'; +import { tool as htmlMdConverter } from './html-md-converter'; export const toolsByCategory: ToolCategory[] = [ { @@ -95,6 +96,7 @@ export const toolsByCategory: ToolCategory[] = [ listConverter, tomlToJson, tomlToYaml, + htmlMdConverter, ], }, {