diff --git a/src/ui/c-input-text/c-input-text.vue b/src/ui/c-input-text/c-input-text.vue index b5f423d2..9b540b2c 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; + } + evt.preventDefault(); + const textHtmlData = evt.clipboardData?.getData('text/html'); + if (textHtmlData && textHtmlData !== '') { + 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" />