From 07e53f0e2fb52d9775ac8fae77e3eb8bada59c4e Mon Sep 17 00:00:00 2001 From: ShareVB Date: Sun, 15 Dec 2024 19:33:46 +0100 Subject: [PATCH] fix: paste-html --- components.d.ts | 7 ++----- src/ui/c-input-text/c-input-text.vue | 30 ++++++++++++++++++++++++++-- 2 files changed, 30 insertions(+), 7 deletions(-) diff --git a/components.d.ts b/components.d.ts index e31119b3..0966568d 100644 --- a/components.d.ts +++ b/components.d.ts @@ -84,6 +84,7 @@ declare module '@vue/runtime-core' { HashText: typeof import('./src/tools/hash-text/hash-text.vue')['default'] HmacGenerator: typeof import('./src/tools/hmac-generator/hmac-generator.vue')['default'] 'Home.page': typeof import('./src/pages/Home.page.vue')['default'] + HtmlCleaner: typeof import('./src/tools/html-cleaner/html-cleaner.vue')['default'] HtmlEntities: typeof import('./src/tools/html-entities/html-entities.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'] @@ -133,18 +134,13 @@ declare module '@vue/runtime-core' { NDivider: typeof import('naive-ui')['NDivider'] NEllipsis: typeof import('naive-ui')['NEllipsis'] 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'] 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'] @@ -159,6 +155,7 @@ declare module '@vue/runtime-core' { RouterLink: typeof import('vue-router')['RouterLink'] RouterView: typeof import('vue-router')['RouterView'] RsaKeyPairGenerator: typeof import('./src/tools/rsa-key-pair-generator/rsa-key-pair-generator.vue')['default'] + SafelinkDecoder: typeof import('./src/tools/safelink-decoder/safelink-decoder.vue')['default'] SlugifyString: typeof import('./src/tools/slugify-string/slugify-string.vue')['default'] SpanCopyable: typeof import('./src/components/SpanCopyable.vue')['default'] SqlPrettify: typeof import('./src/tools/sql-prettify/sql-prettify.vue')['default'] diff --git a/src/ui/c-input-text/c-input-text.vue b/src/ui/c-input-text/c-input-text.vue index b5f423d2..cef739ed 100644 --- a/src/ui/c-input-text/c-input-text.vue +++ b/src/ui/c-input-text/c-input-text.vue @@ -31,6 +31,7 @@ const props = withDefaults( autosize?: boolean autofocus?: boolean monospace?: boolean + pasteHtml?: boolean }>(), { value: '', @@ -58,13 +59,14 @@ const props = withDefaults( autosize: false, autofocus: false, monospace: false, + pasteHtml: false, }, ); const emit = defineEmits(['update:value']); const value = useVModel(props, 'value', emit); const showPassword = ref(false); -const { id, placeholder, label, validationRules, labelPosition, labelWidth, labelAlign, autosize, readonly, disabled, clearable, type, multiline, rows, rawText, autofocus, monospace } = toRefs(props); +const { id, placeholder, label, validationRules, labelPosition, labelWidth, labelAlign, autosize, readonly, disabled, clearable, type, multiline, rows, rawText, autofocus, monospace, pasteHtml } = toRefs(props); const validation = props.validation @@ -81,6 +83,28 @@ const textareaRef = ref(); const inputRef = ref(); const inputWrapperRef = ref(); +interface HTMLElementWithValue { + value?: string +} + +function onPasteInputHtml(evt: ClipboardEvent) { + if (!pasteHtml.value) { + return false; + } + + const target = (evt.target as HTMLElementWithValue); + if (!target) { + return false; + } + const textHtmlData = evt.clipboardData?.getData('text/html'); + if (textHtmlData && textHtmlData !== '') { + evt.preventDefault(); + value.value = textHtmlData; + return true; + } + return false; +} + watch( [value, autosize, multiline, inputWrapperRef, textareaRef], () => nextTick(() => { @@ -171,6 +195,7 @@ defineExpose({ :autocorrect="autocorrect ?? (rawText ? 'off' : undefined)" :spellcheck="spellcheck ?? (rawText ? false : undefined)" :rows="rows" + @paste="onPasteInputHtml" /> @@ -338,4 +364,4 @@ defineExpose({ } } } - + \ No newline at end of file