UNPKG

@dialpad/dialtone

Version:

Dialpad's Dialtone design system monorepo

1 lines 9.07 kB
{"version":3,"file":"message_input_link.vue.cjs","sources":["../../../../recipes/conversation_view/message_input/message_input_link.vue"],"sourcesContent":["<template>\n <dt-popover\n :open=\"isOpen\"\n placement=\"bottom-start\"\n content-class=\"d-recipe-message-input__link-popover\"\n :visually-hidden-close=\"true\"\n :visually-hidden-close-label=\"linkButtonOptions.visuallyHiddenCloseText\"\n data-qa=\"dt-message-input-link-popover\"\n :show-close-button=\"false\"\n @opened=\"$emit('opened', $event)\"\n >\n <template #anchor>\n <dt-recipe-message-input-button\n :aria-label=\"linkButtonOptions.ariaLabel\"\n :tooltip-text=\"linkButtonOptions.tooltipText\"\n :keyboard-shortcut-text=\"linkButtonOptions.keyboardShortcutText\"\n data-qa=\"message-input-link-btn\"\n :is-active=\"isSelectionActive('link')\"\n @click=\"isOpen = true\"\n >\n <template #icon>\n <dt-icon-link2\n class=\"d-recipe-message-input__button-stack-icon\"\n size=\"200\"\n />\n </template>\n </dt-recipe-message-input-button>\n </template>\n\n <template #content>\n <dt-stack gap=\"500\">\n <div\n v-if=\"linkButtonOptions.dialogTitle.length > 0\"\n class=\"d-recipe-message-input__link-dialog-title\"\n >\n {{ linkButtonOptions.dialogTitle }}\n </div>\n <dt-input\n v-model=\"linkText\"\n :input-aria-label=\"linkButtonOptions.textLabel\"\n size=\"xs\"\n data-qa=\"dt-message-input-link-text-input\"\n :label=\"linkButtonOptions.textLabel\"\n input-wrapper-class=\"d-recipe-message-input__link-input\"\n @click.stop\n @focus.stop\n @keydown.enter=\"$emit('set-link', linkText, linkInput)\"\n />\n <dt-input\n v-model=\"linkInput\"\n :input-aria-label=\"linkButtonOptions.linkLabel\"\n size=\"xs\"\n data-qa=\"dt-message-input-link-input\"\n :placeholder=\"linkButtonOptions.linkPlaceholder\"\n :label=\"linkButtonOptions.linkLabel\"\n input-wrapper-class=\"d-recipe-message-input__link-input\"\n @click.stop\n @focus.stop\n @keydown.enter=\"$emit('set-link', linkText, linkInput)\"\n />\n <dt-stack\n direction=\"row\"\n class=\"d-recipe-message-input__link-dialog-buttons\"\n >\n <dt-button\n :aria-label=\"linkButtonOptions.removeLabel\"\n importance=\"clear\"\n kind=\"danger\"\n size=\"md\"\n data-qa=\"dt-message-input-link-remove-btn\"\n @click=\"$emit('remove-link', linkText, linkInput)\"\n >\n {{ linkButtonOptions.removeLabel }}\n </dt-button>\n <dt-stack\n direction=\"row\"\n gap=\"400\"\n >\n <dt-button\n :aria-label=\"linkButtonOptions.cancelLabel\"\n importance=\"clear\"\n kind=\"muted\"\n size=\"md\"\n data-qa=\"dt-message-input-link-cancel-btn\"\n @click=\"isOpen = false\"\n >\n {{ linkButtonOptions.cancelLabel }}\n </dt-button>\n <dt-button\n size=\"md\"\n :aria-label=\"linkButtonOptions.confirmLabel\"\n data-qa=\"dt-message-input-link-confirm-btn\"\n @click=\"$emit('set-link', linkText, linkInput)\"\n >\n {{ linkButtonOptions.confirmLabel }}\n </dt-button>\n </dt-stack>\n </dt-stack>\n </dt-stack>\n </template>\n </dt-popover>\n</template>\n\n<script>\nimport { DtPopover } from '@/components/popover';\nimport { DtInput } from '@/components/input';\nimport { DtButton } from '@/components/button';\nimport { DtStack } from '@/components/stack';\nimport { DtIconLink2 } from '@dialpad/dialtone-icons/vue3';\nimport DtRecipeMessageInputButton from './message_input_button.vue';\nexport default {\n compatConfig: { MODE: 3 },\n name: 'MessageInputLink',\n\n components: {\n DtPopover,\n DtInput,\n DtButton,\n DtStack,\n DtIconLink2,\n DtRecipeMessageInputButton,\n },\n\n props: {\n open: {\n type: Boolean,\n default: false,\n },\n\n linkButtonOptions: {\n type: Object,\n required: true,\n },\n\n isSelectionActive: {\n type: Function,\n default: () => {},\n },\n },\n\n emits: ['set-link', 'remove-link', 'opened'],\n\n data () {\n return {\n linkText: '',\n linkInput: '',\n isOpen: false,\n };\n },\n\n watch: {\n open: {\n immediate: true,\n handler (value) {\n this.isOpen = value;\n },\n },\n },\n\n methods: {\n setInitialValues (linkText, linkInput) {\n this.linkText = linkText;\n this.linkInput = linkInput;\n },\n },\n};\n</script>\n"],"names":["DtPopover","DtInput","DtButton","DtStack","DtIconLink2","DtRecipeMessageInputButton","_createBlock","_createVNode","_withCtx","_openBlock","_createElementBlock","_toDisplayString","_createCommentVNode","_withModifiers","_withKeys","_createTextVNode"],"mappings":"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"}