@dialpad/dialtone 9.110.1 → 9.111.0

package/dist/vue3/lib/dropdown/dropdown.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.cjs","sources":["../../../components/dropdown/dropdown.vue"],"sourcesContent":["<!-- eslint-disable max-lines -->\n<template>\n  <dt-popover\n    ref=\"popover\"\n    :content-width=\"contentWidth\"\n    :open=\"open\"\n    :placement=\"placement\"\n    :initial-focus-element=\"openedWithKeyboard ? 'first' : 'dialog'\"\n    :fallback-placements=\"fallbackPlacements\"\n    padding=\"none\"\n    role=\"menu\"\n    :append-to=\"appendTo\"\n    :modal=\"modal\"\n    :max-height=\"maxHeight\"\n    :max-width=\"maxWidth\"\n    :open-with-arrow-keys=\"shouldOpenWithArrowKeys\"\n    :open-on-context=\"openOnContext\"\n    v-bind=\"$attrs\"\n    :tether=\"tether\"\n    :transition=\"transition\"\n    v-on=\"dropdownListeners\"\n  >\n    <template #anchor=\"{ attrs }\">\n      <!-- @slot Anchor element that activates the dropdown -->\n      <slot\n        ref=\"anchor\"\n        name=\"anchor\"\n        v-bind=\"attrs\"\n      />\n    </template>\n    <template #content=\"{ close }\">\n      <!-- eslint-disable-next-line max-len -->\n      <!-- eslint-disable-next-line vuejs-accessibility/mouse-events-have-key-events vuejs-accessibility/no-static-element-interactions -->\n      <ul\n        :id=\"listId\"\n        ref=\"listWrapper\"\n        :class=\"listClasses\"\n        data-qa=\"dt-dropdown-list-wrapper\"\n        @mouseleave=\"clearHighlightIndex\"\n        @mousemove.capture=\"onMouseHighlight\"\n      >\n        <!-- @slot Slot for the list component -->\n        <slot\n          name=\"list\"\n          :close=\"close\"\n        />\n        <sr-only-close-button\n          v-if=\"showVisuallyHiddenClose\"\n          :visually-hidden-close-label=\"visuallyHiddenCloseLabel\"\n          :tabindex=\"isArrowKeyNav ? -1 : 0\"\n          @close=\"close\"\n        />\n      </ul>\n    </template>\n    <template #footerContent=\"{ close }\">\n      <!-- @slot Slot for the footer content -->\n      <slot\n        name=\"footer\"\n        :close=\"close\"\n      />\n    </template>\n  </dt-popover>\n</template>\n\n<script>\nimport KeyboardNavigation from '@/common/mixins/keyboard_list_navigation';\nimport { DtPopover, POPOVER_APPEND_TO_VALUES } from '@/components/popover';\nimport { LIST_ITEM_NAVIGATION_TYPES } from '@/components/list_item';\nimport { DROPDOWN_PADDING_CLASSES } from './dropdown_constants';\nimport { getUniqueString } from '@/common/utils';\nimport { EVENT_KEYNAMES } from '@/common/constants';\nimport SrOnlyCloseButtonMixin from '@/common/mixins/sr_only_close_button';\nimport SrOnlyCloseButton from '@/common/sr_only_close_button.vue';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtDropdown',\n\n  components: {\n    DtPopover,\n    SrOnlyCloseButton,\n  },\n\n  mixins: [\n    KeyboardNavigation({\n      indexKey: 'highlightIndex',\n      idKey: 'highlightId',\n      listElementKey: 'getListElement',\n      listItemRole: 'menuitem',\n      afterHighlightMethod: 'afterHighlight',\n      beginningOfListMethod: 'beginningOfListMethod',\n      endOfListMethod: 'endOfListMethod',\n      activeItemKey: 'activeItemEl',\n      focusOnKeyboardNavigation: true,\n    }),\n    SrOnlyCloseButtonMixin,\n  ],\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Controls whether the dropdown is shown. Leaving this null will have the dropdown trigger on click by default.\n     * If you set this value, the default trigger behavior will be disabled and you can control it as you need.\n     * Supports v-model\n     */\n    open: {\n      type: Boolean,\n      default: null,\n    },\n\n    /**\n     * Opens the dropdown on right click (context menu). If you set this value to `true`,\n     * the default trigger behavior will be disabled.\n     */\n    openOnContext: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Vertical padding size around the list element.\n     * @values none, small, large\n     */\n    padding: {\n      type: String,\n      default: 'small',\n      validator: (padding) => {\n        return Object.keys(DROPDOWN_PADDING_CLASSES).some((item) => item === padding);\n      },\n    },\n\n    /**\n     * Determines modal state, dropdown has a modal overlay preventing interaction with elements\n     * below it, but it is invisible.\n     */\n    modal: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Width configuration for the popover content. When its value is 'anchor',\n     * the popover content will have the same width as the anchor.\n     * @values null, anchor\n     */\n    contentWidth: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Determines maximum height for the popover before overflow.\n     * Possible units rem|px|em\n     */\n    maxHeight: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Determines maximum width for the popover before overflow.\n     * Possible units rem|px|%|em\n     */\n    maxWidth: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Sets an ID on the list element of the component. Used by several aria attributes\n     * as well as when deriving the IDs for each item.\n     */\n    listId: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * The type of navigation that this component should support.\n     * - \"arrow-keys\" for items that are navigated with UP/DOWN keys.\n     * - \"tab\" for items that are navigated using the TAB key.\n     * - \"none\" for static items that are not interactive.\n     * @values arrow-keys, tab, none\n     */\n    navigationType: {\n      type: String,\n      default: LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS,\n      validator: (t) => Object.values(LIST_ITEM_NAVIGATION_TYPES).includes(t),\n    },\n\n    /**\n     * If the dropdown does not fit in the direction described by \"placement\",\n     * it will attempt to change it's direction to the \"fallbackPlacements\".\n     *\n     * @values top, top-start, top-end,\n     * right, right-start, right-end,\n     * left, left-start, left-end,\n     * bottom, bottom-start, bottom-end,\n     * auto, auto-start, auto-end\n     * */\n    fallbackPlacements: {\n      type: Array,\n      default: () => {\n        return ['auto'];\n      },\n    },\n\n    /**\n     * The direction the dropdown displays relative to the anchor.\n     */\n    placement: {\n      type: String,\n      default: 'bottom',\n    },\n\n    /**\n     * A method that will be called when the selection goes past the beginning of the list.\n     */\n    onBeginningOfList: {\n      type: Function,\n      default: null,\n    },\n\n    /**\n     * A method that will be called when the selection goes past the end of the list.\n     */\n    onEndOfList: {\n      type: Function,\n      default: null,\n    },\n\n    /**\n     * Additional class for the wrapper list element.\n     */\n    listClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Sets the element to which the popover is going to append to.\n     * 'body' will append to the nearest body (supports shadow DOM).\n     * @values 'body', 'parent', HTMLElement,\n     */\n    appendTo: {\n      type: [HTMLElement, String],\n      default: 'body',\n      validator: appendTo => {\n        return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n            (appendTo instanceof HTMLElement);\n      },\n    },\n\n    /**\n     * If set to false the dialog will display over top of the anchor when there is insufficient space.\n     * If set to true it will never move from its position relative to the anchor and will clip instead.\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://popper.js.org/docs/v2/modifiers/prevent-overflow/#tether\"\n     *   target=\"_blank\"\n     * >\n     *   Popper.js docs\n     * </a>\n     * @values true, false\n     */\n    tether: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Named transition when the content display is toggled.\n     * @see DtLazyShow\n     */\n    transition: {\n      type: String,\n      default: 'fade',\n    },\n  },\n\n  emits: [\n    /**\n     * Native keydown event\n     *\n     * @event keydown\n     * @type {KeyboardEvent}\n     */\n    'keydown',\n\n    /**\n     * Event fired when the highlight changes\n     *\n     * @event highlight\n     * @type {Number}\n     */\n    'highlight',\n\n    /**\n     * Event fired to sync the open prop with the parent component\n     * @event update:open\n     */\n    'update:open',\n\n    /**\n     * Event fired when dropdown is shown or hidden\n     *\n     * @event opened\n     * @type {Boolean | Array}\n     */\n    'opened',\n\n    /**\n     * Event fired to sync the open prop with the parent component\n     * @event update:open\n     */\n    'update:open',\n  ],\n\n  data () {\n    return {\n      LIST_ITEM_NAVIGATION_TYPES,\n      DROPDOWN_PADDING_CLASSES,\n      EVENT_KEYNAMES,\n      openedWithKeyboard: false,\n      isOpen: null,\n    };\n  },\n\n  computed: {\n    dropdownListeners () {\n      return {\n        opened: isPopoverOpen => {\n          this.updateInitialHighlightIndex(isPopoverOpen);\n        },\n\n        keydown: event => {\n          const eventCode = event.code;\n\n          switch (eventCode) {\n            case EVENT_KEYNAMES.up:\n            case EVENT_KEYNAMES.arrowup:\n              this.onUpKeyPress(event);\n              event.stopPropagation();\n              event.preventDefault();\n              break;\n            case EVENT_KEYNAMES.down:\n            case EVENT_KEYNAMES.arrowdown:\n              this.onDownKeyPress(event);\n              event.stopPropagation();\n              event.preventDefault();\n              break;\n            case EVENT_KEYNAMES.space:\n            case EVENT_KEYNAMES.spacebar:\n              this.onSpaceKey();\n              break;\n            case EVENT_KEYNAMES.enter:\n              this.onEnterKey();\n              break;\n            case EVENT_KEYNAMES.home:\n              this.onHomeKeyPress(event);\n              event.stopPropagation();\n              event.preventDefault();\n              break;\n            case EVENT_KEYNAMES.end:\n              this.onEndKeyPress(event);\n              event.stopPropagation();\n              event.preventDefault();\n              break;\n            default:\n              this.onKeyPress(event);\n              break;\n          }\n\n          this.$emit('keydown', event);\n        },\n      };\n    },\n\n    beginningOfListMethod () {\n      return this.onBeginningOfList || this.jumpToEnd;\n    },\n\n    endOfListMethod () {\n      return this.onEndOfList || this.jumpToBeginning;\n    },\n\n    activeItemEl () {\n      return this.getListElement().querySelector('#' + this.highlightId);\n    },\n\n    isArrowKeyNav () {\n      return this.navigationType === this.LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS;\n    },\n\n    listClasses () {\n      return [\n        'd-dropdown-list',\n        DROPDOWN_PADDING_CLASSES[this.padding],\n        this.listClass,\n        { 'd-context-menu-list': this.openOnContext },\n      ];\n    },\n\n    shouldOpenWithArrowKeys () {\n      return !this.openOnContext;\n    },\n  },\n\n  methods: {\n    onMouseHighlight (e) {\n      const liElement = e.target.closest('li');\n\n      if (liElement && liElement.role && this.highlightId !== liElement.id) {\n        this.setHighlightId(liElement.id);\n        liElement.focus();\n      }\n    },\n\n    getListElement () {\n      return this.$refs.listWrapper;\n    },\n\n    clearHighlightIndex () {\n      this.setHighlightIndex(-1);\n    },\n\n    afterHighlight () {\n      if (this.visuallyHiddenClose && this.highlightIndex === this._itemsLength() - 1) {\n        return;\n      }\n\n      this.$emit('highlight', this.highlightIndex);\n    },\n\n    updateInitialHighlightIndex (isPopoverOpen) {\n      this.isOpen = isPopoverOpen;\n\n      if (isPopoverOpen) {\n        if (this.openedWithKeyboard && this.isArrowKeyNav) {\n          this.setHighlightIndex(0);\n        }\n        this.$emit('opened', true);\n      } else {\n        this.clearHighlightIndex();\n        this.openedWithKeyboard = false;\n        this.$emit('opened', false);\n      }\n    },\n\n    onSpaceKey () {\n      if (!this.open) {\n        this.openedWithKeyboard = true;\n      }\n    },\n\n    onEnterKey () {\n      if (!this.open) {\n        this.openedWithKeyboard = true;\n      }\n    },\n\n    onUpKeyPress () {\n      if (!this.isOpen) {\n        this.openedWithKeyboard = true;\n        return;\n      }\n      if (this.isArrowKeyNav) {\n        return this.onUpKey();\n      }\n    },\n\n    onDownKeyPress () {\n      if (!this.isOpen) {\n        this.openedWithKeyboard = true;\n        return;\n      }\n      if (this.isArrowKeyNav) {\n        return this.onDownKey();\n      }\n    },\n\n    onHomeKeyPress () {\n      if (!this.isOpen || !this.isArrowKeyNav) {\n        return;\n      }\n\n      return this.onHomeKey();\n    },\n\n    onEndKeyPress () {\n      if (!this.isOpen || !this.isArrowKeyNav) {\n        return;\n      }\n\n      return this.onEndKey();\n    },\n\n    onKeyPress (e) {\n      if (!this.isOpen || !this.isArrowKeyNav || !this.isValidLetter(e.key)) {\n        return;\n      }\n\n      e.stopPropagation();\n      e.preventDefault();\n\n      return this.onNavigationKey(e.key);\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtPopover","SrOnlyCloseButton","KeyboardNavigation","SrOnlyCloseButtonMixin","padding","DROPDOWN_PADDING_CLASSES","item","getUniqueString","LIST_ITEM_NAVIGATION_TYPES","t","appendTo","POPOVER_APPEND_TO_VALUES","EVENT_KEYNAMES","isPopoverOpen","event","liElement","_hoisted_1","_openBlock","_createBlock","_component_dt_popover","_mergeProps","$props","$data","$options","_ctx","_toHandlers","_withCtx","attrs","_renderSlot","close","_createElementVNode","_normalizeClass","args","_cache","_component_sr_only_close_button","_createCommentVNode"],"mappings":"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"}

package/dist/vue3/lib/dropdown/dropdown.js

@@ -0,0 +1,401 @@
+import K from "../../common/mixins/keyboard-list-navigation.js";
+import { DROPDOWN_PADDING_CLASSES as a } from "./dropdown-constants.js";
+import { getUniqueString as w } from "../../common/utils/index.js";
+import { EVENT_KEYNAMES as n } from "../../common/constants/index.js";
+import O from "../../common/mixins/sr-only-close-button.js";
+import b from "../../shared/sr_only_close_button.js";
+import { resolveComponent as p, openBlock as u, createBlock as g, mergeProps as m, toHandlers as E, withCtx as l, renderSlot as d, createElementVNode as I, normalizeClass as x, createCommentVNode as S } from "vue";
+import { _ as H } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
+import P from "../popover/popover.js";
+import { LIST_ITEM_NAVIGATION_TYPES as h } from "../list-item/list-item-constants.js";
+import { POPOVER_APPEND_TO_VALUES as C } from "../popover/popover-constants.js";
+const _ = {
+  compatConfig: { MODE: 3 },
+  name: "DtDropdown",
+  components: {
+    DtPopover: P,
+    SrOnlyCloseButton: b
+  },
+  mixins: [
+    K({
+      indexKey: "highlightIndex",
+      idKey: "highlightId",
+      listElementKey: "getListElement",
+      listItemRole: "menuitem",
+      afterHighlightMethod: "afterHighlight",
+      beginningOfListMethod: "beginningOfListMethod",
+      endOfListMethod: "endOfListMethod",
+      activeItemKey: "activeItemEl",
+      focusOnKeyboardNavigation: !0
+    }),
+    O
+  ],
+  inheritAttrs: !1,
+  props: {
+    /**
+     * Controls whether the dropdown is shown. Leaving this null will have the dropdown trigger on click by default.
+     * If you set this value, the default trigger behavior will be disabled and you can control it as you need.
+     * Supports v-model
+     */
+    open: {
+      type: Boolean,
+      default: null
+    },
+    /**
+     * Opens the dropdown on right click (context menu). If you set this value to `true`,
+     * the default trigger behavior will be disabled.
+     */
+    openOnContext: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Vertical padding size around the list element.
+     * @values none, small, large
+     */
+    padding: {
+      type: String,
+      default: "small",
+      validator: (e) => Object.keys(a).some((t) => t === e)
+    },
+    /**
+     * Determines modal state, dropdown has a modal overlay preventing interaction with elements
+     * below it, but it is invisible.
+     */
+    modal: {
+      type: Boolean,
+      default: !0
+    },
+    /**
+     * Width configuration for the popover content. When its value is 'anchor',
+     * the popover content will have the same width as the anchor.
+     * @values null, anchor
+     */
+    contentWidth: {
+      type: String,
+      default: null
+    },
+    /**
+     * Determines maximum height for the popover before overflow.
+     * Possible units rem|px|em
+     */
+    maxHeight: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Determines maximum width for the popover before overflow.
+     * Possible units rem|px|%|em
+     */
+    maxWidth: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Sets an ID on the list element of the component. Used by several aria attributes
+     * as well as when deriving the IDs for each item.
+     */
+    listId: {
+      type: String,
+      default() {
+        return w();
+      }
+    },
+    /**
+     * The type of navigation that this component should support.
+     * - "arrow-keys" for items that are navigated with UP/DOWN keys.
+     * - "tab" for items that are navigated using the TAB key.
+     * - "none" for static items that are not interactive.
+     * @values arrow-keys, tab, none
+     */
+    navigationType: {
+      type: String,
+      default: h.ARROW_KEYS,
+      validator: (e) => Object.values(h).includes(e)
+    },
+    /**
+     * If the dropdown does not fit in the direction described by "placement",
+     * it will attempt to change it's direction to the "fallbackPlacements".
+     *
+     * @values top, top-start, top-end,
+     * right, right-start, right-end,
+     * left, left-start, left-end,
+     * bottom, bottom-start, bottom-end,
+     * auto, auto-start, auto-end
+     * */
+    fallbackPlacements: {
+      type: Array,
+      default: () => ["auto"]
+    },
+    /**
+     * The direction the dropdown displays relative to the anchor.
+     */
+    placement: {
+      type: String,
+      default: "bottom"
+    },
+    /**
+     * A method that will be called when the selection goes past the beginning of the list.
+     */
+    onBeginningOfList: {
+      type: Function,
+      default: null
+    },
+    /**
+     * A method that will be called when the selection goes past the end of the list.
+     */
+    onEndOfList: {
+      type: Function,
+      default: null
+    },
+    /**
+     * Additional class for the wrapper list element.
+     */
+    listClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    /**
+     * Sets the element to which the popover is going to append to.
+     * 'body' will append to the nearest body (supports shadow DOM).
+     * @values 'body', 'parent', HTMLElement,
+     */
+    appendTo: {
+      type: [HTMLElement, String],
+      default: "body",
+      validator: (e) => C.includes(e) || e instanceof HTMLElement
+    },
+    /**
+     * If set to false the dialog will display over top of the anchor when there is insufficient space.
+     * If set to true it will never move from its position relative to the anchor and will clip instead.
+     * <a
+     *   class="d-link"
+     *   href="https://popper.js.org/docs/v2/modifiers/prevent-overflow/#tether"
+     *   target="_blank"
+     * >
+     *   Popper.js docs
+     * </a>
+     * @values true, false
+     */
+    tether: {
+      type: Boolean,
+      default: !0
+    },
+    /**
+     * Named transition when the content display is toggled.
+     * @see DtLazyShow
+     */
+    transition: {
+      type: String,
+      default: "fade"
+    }
+  },
+  emits: [
+    /**
+     * Native keydown event
+     *
+     * @event keydown
+     * @type {KeyboardEvent}
+     */
+    "keydown",
+    /**
+     * Event fired when the highlight changes
+     *
+     * @event highlight
+     * @type {Number}
+     */
+    "highlight",
+    /**
+     * Event fired to sync the open prop with the parent component
+     * @event update:open
+     */
+    "update:open",
+    /**
+     * Event fired when dropdown is shown or hidden
+     *
+     * @event opened
+     * @type {Boolean | Array}
+     */
+    "opened",
+    /**
+     * Event fired to sync the open prop with the parent component
+     * @event update:open
+     */
+    "update:open"
+  ],
+  data() {
+    return {
+      LIST_ITEM_NAVIGATION_TYPES: h,
+      DROPDOWN_PADDING_CLASSES: a,
+      EVENT_KEYNAMES: n,
+      openedWithKeyboard: !1,
+      isOpen: null
+    };
+  },
+  computed: {
+    dropdownListeners() {
+      return {
+        opened: (e) => {
+          this.updateInitialHighlightIndex(e);
+        },
+        keydown: (e) => {
+          switch (e.code) {
+            case n.up:
+            case n.arrowup:
+              this.onUpKeyPress(e), e.stopPropagation(), e.preventDefault();
+              break;
+            case n.down:
+            case n.arrowdown:
+              this.onDownKeyPress(e), e.stopPropagation(), e.preventDefault();
+              break;
+            case n.space:
+            case n.spacebar:
+              this.onSpaceKey();
+              break;
+            case n.enter:
+              this.onEnterKey();
+              break;
+            case n.home:
+              this.onHomeKeyPress(e), e.stopPropagation(), e.preventDefault();
+              break;
+            case n.end:
+              this.onEndKeyPress(e), e.stopPropagation(), e.preventDefault();
+              break;
+            default:
+              this.onKeyPress(e);
+              break;
+          }
+          this.$emit("keydown", e);
+        }
+      };
+    },
+    beginningOfListMethod() {
+      return this.onBeginningOfList || this.jumpToEnd;
+    },
+    endOfListMethod() {
+      return this.onEndOfList || this.jumpToBeginning;
+    },
+    activeItemEl() {
+      return this.getListElement().querySelector("#" + this.highlightId);
+    },
+    isArrowKeyNav() {
+      return this.navigationType === this.LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS;
+    },
+    listClasses() {
+      return [
+        "d-dropdown-list",
+        a[this.padding],
+        this.listClass,
+        { "d-context-menu-list": this.openOnContext }
+      ];
+    },
+    shouldOpenWithArrowKeys() {
+      return !this.openOnContext;
+    }
+  },
+  methods: {
+    onMouseHighlight(e) {
+      const t = e.target.closest("li");
+      t && t.role && this.highlightId !== t.id && (this.setHighlightId(t.id), t.focus());
+    },
+    getListElement() {
+      return this.$refs.listWrapper;
+    },
+    clearHighlightIndex() {
+      this.setHighlightIndex(-1);
+    },
+    afterHighlight() {
+      this.visuallyHiddenClose && this.highlightIndex === this._itemsLength() - 1 || this.$emit("highlight", this.highlightIndex);
+    },
+    updateInitialHighlightIndex(e) {
+      this.isOpen = e, e ? (this.openedWithKeyboard && this.isArrowKeyNav && this.setHighlightIndex(0), this.$emit("opened", !0)) : (this.clearHighlightIndex(), this.openedWithKeyboard = !1, this.$emit("opened", !1));
+    },
+    onSpaceKey() {
+      this.open || (this.openedWithKeyboard = !0);
+    },
+    onEnterKey() {
+      this.open || (this.openedWithKeyboard = !0);
+    },
+    onUpKeyPress() {
+      if (!this.isOpen) {
+        this.openedWithKeyboard = !0;
+        return;
+      }
+      if (this.isArrowKeyNav)
+        return this.onUpKey();
+    },
+    onDownKeyPress() {
+      if (!this.isOpen) {
+        this.openedWithKeyboard = !0;
+        return;
+      }
+      if (this.isArrowKeyNav)
+        return this.onDownKey();
+    },
+    onHomeKeyPress() {
+      if (!(!this.isOpen || !this.isArrowKeyNav))
+        return this.onHomeKey();
+    },
+    onEndKeyPress() {
+      if (!(!this.isOpen || !this.isArrowKeyNav))
+        return this.onEndKey();
+    },
+    onKeyPress(e) {
+      if (!(!this.isOpen || !this.isArrowKeyNav || !this.isValidLetter(e.key)))
+        return e.stopPropagation(), e.preventDefault(), this.onNavigationKey(e.key);
+    }
+  }
+}, A = ["id"];
+function L(e, t, i, v, f, o) {
+  const y = p("sr-only-close-button"), c = p("dt-popover");
+  return u(), g(c, m({
+    ref: "popover",
+    "content-width": i.contentWidth,
+    open: i.open,
+    placement: i.placement,
+    "initial-focus-element": f.openedWithKeyboard ? "first" : "dialog",
+    "fallback-placements": i.fallbackPlacements,
+    padding: "none",
+    role: "menu",
+    "append-to": i.appendTo,
+    modal: i.modal,
+    "max-height": i.maxHeight,
+    "max-width": i.maxWidth,
+    "open-with-arrow-keys": o.shouldOpenWithArrowKeys,
+    "open-on-context": i.openOnContext
+  }, e.$attrs, {
+    tether: i.tether,
+    transition: i.transition
+  }, E(o.dropdownListeners)), {
+    anchor: l(({ attrs: s }) => [
+      d(e.$slots, "anchor", m({ ref: "anchor" }, s))
+    ]),
+    content: l(({ close: s }) => [
+      I("ul", {
+        id: i.listId,
+        ref: "listWrapper",
+        class: x(o.listClasses),
+        "data-qa": "dt-dropdown-list-wrapper",
+        onMouseleave: t[0] || (t[0] = (...r) => o.clearHighlightIndex && o.clearHighlightIndex(...r)),
+        onMousemoveCapture: t[1] || (t[1] = (...r) => o.onMouseHighlight && o.onMouseHighlight(...r))
+      }, [
+        d(e.$slots, "list", { close: s }),
+        e.showVisuallyHiddenClose ? (u(), g(y, {
+          key: 0,
+          "visually-hidden-close-label": e.visuallyHiddenCloseLabel,
+          tabindex: o.isArrowKeyNav ? -1 : 0,
+          onClose: s
+        }, null, 8, ["visually-hidden-close-label", "tabindex", "onClose"])) : S("", !0)
+      ], 42, A)
+    ]),
+    footerContent: l(({ close: s }) => [
+      d(e.$slots, "footer", { close: s })
+    ]),
+    _: 3
+  }, 16, ["content-width", "open", "placement", "initial-focus-element", "fallback-placements", "append-to", "modal", "max-height", "max-width", "open-with-arrow-keys", "open-on-context", "tether", "transition"]);
+}
+const Y = /* @__PURE__ */ H(_, [["render", L]]);
+export {
+  Y as default
+};
+//# sourceMappingURL=dropdown.js.map

package/dist/vue3/lib/dropdown/dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.js","sources":["../../../components/dropdown/dropdown.vue"],"sourcesContent":["<!-- eslint-disable max-lines -->\n<template>\n  <dt-popover\n    ref=\"popover\"\n    :content-width=\"contentWidth\"\n    :open=\"open\"\n    :placement=\"placement\"\n    :initial-focus-element=\"openedWithKeyboard ? 'first' : 'dialog'\"\n    :fallback-placements=\"fallbackPlacements\"\n    padding=\"none\"\n    role=\"menu\"\n    :append-to=\"appendTo\"\n    :modal=\"modal\"\n    :max-height=\"maxHeight\"\n    :max-width=\"maxWidth\"\n    :open-with-arrow-keys=\"shouldOpenWithArrowKeys\"\n    :open-on-context=\"openOnContext\"\n    v-bind=\"$attrs\"\n    :tether=\"tether\"\n    :transition=\"transition\"\n    v-on=\"dropdownListeners\"\n  >\n    <template #anchor=\"{ attrs }\">\n      <!-- @slot Anchor element that activates the dropdown -->\n      <slot\n        ref=\"anchor\"\n        name=\"anchor\"\n        v-bind=\"attrs\"\n      />\n    </template>\n    <template #content=\"{ close }\">\n      <!-- eslint-disable-next-line max-len -->\n      <!-- eslint-disable-next-line vuejs-accessibility/mouse-events-have-key-events vuejs-accessibility/no-static-element-interactions -->\n      <ul\n        :id=\"listId\"\n        ref=\"listWrapper\"\n        :class=\"listClasses\"\n        data-qa=\"dt-dropdown-list-wrapper\"\n        @mouseleave=\"clearHighlightIndex\"\n        @mousemove.capture=\"onMouseHighlight\"\n      >\n        <!-- @slot Slot for the list component -->\n        <slot\n          name=\"list\"\n          :close=\"close\"\n        />\n        <sr-only-close-button\n          v-if=\"showVisuallyHiddenClose\"\n          :visually-hidden-close-label=\"visuallyHiddenCloseLabel\"\n          :tabindex=\"isArrowKeyNav ? -1 : 0\"\n          @close=\"close\"\n        />\n      </ul>\n    </template>\n    <template #footerContent=\"{ close }\">\n      <!-- @slot Slot for the footer content -->\n      <slot\n        name=\"footer\"\n        :close=\"close\"\n      />\n    </template>\n  </dt-popover>\n</template>\n\n<script>\nimport KeyboardNavigation from '@/common/mixins/keyboard_list_navigation';\nimport { DtPopover, POPOVER_APPEND_TO_VALUES } from '@/components/popover';\nimport { LIST_ITEM_NAVIGATION_TYPES } from '@/components/list_item';\nimport { DROPDOWN_PADDING_CLASSES } from './dropdown_constants';\nimport { getUniqueString } from '@/common/utils';\nimport { EVENT_KEYNAMES } from '@/common/constants';\nimport SrOnlyCloseButtonMixin from '@/common/mixins/sr_only_close_button';\nimport SrOnlyCloseButton from '@/common/sr_only_close_button.vue';\n\nexport default {\n  compatConfig: { MODE: 3 },\n  name: 'DtDropdown',\n\n  components: {\n    DtPopover,\n    SrOnlyCloseButton,\n  },\n\n  mixins: [\n    KeyboardNavigation({\n      indexKey: 'highlightIndex',\n      idKey: 'highlightId',\n      listElementKey: 'getListElement',\n      listItemRole: 'menuitem',\n      afterHighlightMethod: 'afterHighlight',\n      beginningOfListMethod: 'beginningOfListMethod',\n      endOfListMethod: 'endOfListMethod',\n      activeItemKey: 'activeItemEl',\n      focusOnKeyboardNavigation: true,\n    }),\n    SrOnlyCloseButtonMixin,\n  ],\n\n  inheritAttrs: false,\n\n  props: {\n    /**\n     * Controls whether the dropdown is shown. Leaving this null will have the dropdown trigger on click by default.\n     * If you set this value, the default trigger behavior will be disabled and you can control it as you need.\n     * Supports v-model\n     */\n    open: {\n      type: Boolean,\n      default: null,\n    },\n\n    /**\n     * Opens the dropdown on right click (context menu). If you set this value to `true`,\n     * the default trigger behavior will be disabled.\n     */\n    openOnContext: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Vertical padding size around the list element.\n     * @values none, small, large\n     */\n    padding: {\n      type: String,\n      default: 'small',\n      validator: (padding) => {\n        return Object.keys(DROPDOWN_PADDING_CLASSES).some((item) => item === padding);\n      },\n    },\n\n    /**\n     * Determines modal state, dropdown has a modal overlay preventing interaction with elements\n     * below it, but it is invisible.\n     */\n    modal: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Width configuration for the popover content. When its value is 'anchor',\n     * the popover content will have the same width as the anchor.\n     * @values null, anchor\n     */\n    contentWidth: {\n      type: String,\n      default: null,\n    },\n\n    /**\n     * Determines maximum height for the popover before overflow.\n     * Possible units rem|px|em\n     */\n    maxHeight: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Determines maximum width for the popover before overflow.\n     * Possible units rem|px|%|em\n     */\n    maxWidth: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Sets an ID on the list element of the component. Used by several aria attributes\n     * as well as when deriving the IDs for each item.\n     */\n    listId: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * The type of navigation that this component should support.\n     * - \"arrow-keys\" for items that are navigated with UP/DOWN keys.\n     * - \"tab\" for items that are navigated using the TAB key.\n     * - \"none\" for static items that are not interactive.\n     * @values arrow-keys, tab, none\n     */\n    navigationType: {\n      type: String,\n      default: LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS,\n      validator: (t) => Object.values(LIST_ITEM_NAVIGATION_TYPES).includes(t),\n    },\n\n    /**\n     * If the dropdown does not fit in the direction described by \"placement\",\n     * it will attempt to change it's direction to the \"fallbackPlacements\".\n     *\n     * @values top, top-start, top-end,\n     * right, right-start, right-end,\n     * left, left-start, left-end,\n     * bottom, bottom-start, bottom-end,\n     * auto, auto-start, auto-end\n     * */\n    fallbackPlacements: {\n      type: Array,\n      default: () => {\n        return ['auto'];\n      },\n    },\n\n    /**\n     * The direction the dropdown displays relative to the anchor.\n     */\n    placement: {\n      type: String,\n      default: 'bottom',\n    },\n\n    /**\n     * A method that will be called when the selection goes past the beginning of the list.\n     */\n    onBeginningOfList: {\n      type: Function,\n      default: null,\n    },\n\n    /**\n     * A method that will be called when the selection goes past the end of the list.\n     */\n    onEndOfList: {\n      type: Function,\n      default: null,\n    },\n\n    /**\n     * Additional class for the wrapper list element.\n     */\n    listClass: {\n      type: [String, Array, Object],\n      default: '',\n    },\n\n    /**\n     * Sets the element to which the popover is going to append to.\n     * 'body' will append to the nearest body (supports shadow DOM).\n     * @values 'body', 'parent', HTMLElement,\n     */\n    appendTo: {\n      type: [HTMLElement, String],\n      default: 'body',\n      validator: appendTo => {\n        return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n            (appendTo instanceof HTMLElement);\n      },\n    },\n\n    /**\n     * If set to false the dialog will display over top of the anchor when there is insufficient space.\n     * If set to true it will never move from its position relative to the anchor and will clip instead.\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://popper.js.org/docs/v2/modifiers/prevent-overflow/#tether\"\n     *   target=\"_blank\"\n     * >\n     *   Popper.js docs\n     * </a>\n     * @values true, false\n     */\n    tether: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Named transition when the content display is toggled.\n     * @see DtLazyShow\n     */\n    transition: {\n      type: String,\n      default: 'fade',\n    },\n  },\n\n  emits: [\n    /**\n     * Native keydown event\n     *\n     * @event keydown\n     * @type {KeyboardEvent}\n     */\n    'keydown',\n\n    /**\n     * Event fired when the highlight changes\n     *\n     * @event highlight\n     * @type {Number}\n     */\n    'highlight',\n\n    /**\n     * Event fired to sync the open prop with the parent component\n     * @event update:open\n     */\n    'update:open',\n\n    /**\n     * Event fired when dropdown is shown or hidden\n     *\n     * @event opened\n     * @type {Boolean | Array}\n     */\n    'opened',\n\n    /**\n     * Event fired to sync the open prop with the parent component\n     * @event update:open\n     */\n    'update:open',\n  ],\n\n  data () {\n    return {\n      LIST_ITEM_NAVIGATION_TYPES,\n      DROPDOWN_PADDING_CLASSES,\n      EVENT_KEYNAMES,\n      openedWithKeyboard: false,\n      isOpen: null,\n    };\n  },\n\n  computed: {\n    dropdownListeners () {\n      return {\n        opened: isPopoverOpen => {\n          this.updateInitialHighlightIndex(isPopoverOpen);\n        },\n\n        keydown: event => {\n          const eventCode = event.code;\n\n          switch (eventCode) {\n            case EVENT_KEYNAMES.up:\n            case EVENT_KEYNAMES.arrowup:\n              this.onUpKeyPress(event);\n              event.stopPropagation();\n              event.preventDefault();\n              break;\n            case EVENT_KEYNAMES.down:\n            case EVENT_KEYNAMES.arrowdown:\n              this.onDownKeyPress(event);\n              event.stopPropagation();\n              event.preventDefault();\n              break;\n            case EVENT_KEYNAMES.space:\n            case EVENT_KEYNAMES.spacebar:\n              this.onSpaceKey();\n              break;\n            case EVENT_KEYNAMES.enter:\n              this.onEnterKey();\n              break;\n            case EVENT_KEYNAMES.home:\n              this.onHomeKeyPress(event);\n              event.stopPropagation();\n              event.preventDefault();\n              break;\n            case EVENT_KEYNAMES.end:\n              this.onEndKeyPress(event);\n              event.stopPropagation();\n              event.preventDefault();\n              break;\n            default:\n              this.onKeyPress(event);\n              break;\n          }\n\n          this.$emit('keydown', event);\n        },\n      };\n    },\n\n    beginningOfListMethod () {\n      return this.onBeginningOfList || this.jumpToEnd;\n    },\n\n    endOfListMethod () {\n      return this.onEndOfList || this.jumpToBeginning;\n    },\n\n    activeItemEl () {\n      return this.getListElement().querySelector('#' + this.highlightId);\n    },\n\n    isArrowKeyNav () {\n      return this.navigationType === this.LIST_ITEM_NAVIGATION_TYPES.ARROW_KEYS;\n    },\n\n    listClasses () {\n      return [\n        'd-dropdown-list',\n        DROPDOWN_PADDING_CLASSES[this.padding],\n        this.listClass,\n        { 'd-context-menu-list': this.openOnContext },\n      ];\n    },\n\n    shouldOpenWithArrowKeys () {\n      return !this.openOnContext;\n    },\n  },\n\n  methods: {\n    onMouseHighlight (e) {\n      const liElement = e.target.closest('li');\n\n      if (liElement && liElement.role && this.highlightId !== liElement.id) {\n        this.setHighlightId(liElement.id);\n        liElement.focus();\n      }\n    },\n\n    getListElement () {\n      return this.$refs.listWrapper;\n    },\n\n    clearHighlightIndex () {\n      this.setHighlightIndex(-1);\n    },\n\n    afterHighlight () {\n      if (this.visuallyHiddenClose && this.highlightIndex === this._itemsLength() - 1) {\n        return;\n      }\n\n      this.$emit('highlight', this.highlightIndex);\n    },\n\n    updateInitialHighlightIndex (isPopoverOpen) {\n      this.isOpen = isPopoverOpen;\n\n      if (isPopoverOpen) {\n        if (this.openedWithKeyboard && this.isArrowKeyNav) {\n          this.setHighlightIndex(0);\n        }\n        this.$emit('opened', true);\n      } else {\n        this.clearHighlightIndex();\n        this.openedWithKeyboard = false;\n        this.$emit('opened', false);\n      }\n    },\n\n    onSpaceKey () {\n      if (!this.open) {\n        this.openedWithKeyboard = true;\n      }\n    },\n\n    onEnterKey () {\n      if (!this.open) {\n        this.openedWithKeyboard = true;\n      }\n    },\n\n    onUpKeyPress () {\n      if (!this.isOpen) {\n        this.openedWithKeyboard = true;\n        return;\n      }\n      if (this.isArrowKeyNav) {\n        return this.onUpKey();\n      }\n    },\n\n    onDownKeyPress () {\n      if (!this.isOpen) {\n        this.openedWithKeyboard = true;\n        return;\n      }\n      if (this.isArrowKeyNav) {\n        return this.onDownKey();\n      }\n    },\n\n    onHomeKeyPress () {\n      if (!this.isOpen || !this.isArrowKeyNav) {\n        return;\n      }\n\n      return this.onHomeKey();\n    },\n\n    onEndKeyPress () {\n      if (!this.isOpen || !this.isArrowKeyNav) {\n        return;\n      }\n\n      return this.onEndKey();\n    },\n\n    onKeyPress (e) {\n      if (!this.isOpen || !this.isArrowKeyNav || !this.isValidLetter(e.key)) {\n        return;\n      }\n\n      e.stopPropagation();\n      e.preventDefault();\n\n      return this.onNavigationKey(e.key);\n    },\n  },\n};\n</script>\n"],"names":["_sfc_main","DtPopover","SrOnlyCloseButton","KeyboardNavigation","SrOnlyCloseButtonMixin","padding","DROPDOWN_PADDING_CLASSES","item","getUniqueString","LIST_ITEM_NAVIGATION_TYPES","t","appendTo","POPOVER_APPEND_TO_VALUES","EVENT_KEYNAMES","isPopoverOpen","event","liElement","_hoisted_1","_openBlock","_createBlock","_component_dt_popover","_mergeProps","$props","$data","$options","_ctx","_toHandlers","_withCtx","attrs","_renderSlot","close","_createElementVNode","_normalizeClass","args","_cache","_component_sr_only_close_button","_createCommentVNode"],"mappings":"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"}

package/dist/vue3/lib/dropdown/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./dropdown.cjs"),r=require("./dropdown-separator.cjs"),d=require("./dropdown-constants.cjs");exports.DtDropdown=o.default;exports.DtDropdownSeparator=r.default;exports.DROPDOWN_PADDING_CLASSES=d.DROPDOWN_PADDING_CLASSES;
+//# sourceMappingURL=index.cjs.map

package/dist/vue3/lib/dropdown/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/vue3/lib/dropdown/index.js

@@ -0,0 +1,9 @@
+import { default as t } from "./dropdown.js";
+import { default as a } from "./dropdown-separator.js";
+import { DROPDOWN_PADDING_CLASSES as p } from "./dropdown-constants.js";
+export {
+  p as DROPDOWN_PADDING_CLASSES,
+  t as DtDropdown,
+  a as DtDropdownSeparator
+};
+//# sourceMappingURL=index.js.map

package/dist/vue3/lib/dropdown/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/vue3/lib/editor/editor-constants.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=[/^https?:\/\//,/^http?:\/\//,/^ftp?:\/\//,/^ftps?:\/\//,/^ftps?:\/\//,/mailto:([^?]*)/],_="https://",e={EDITOR_SUPPORTED_LINK_PROTOCOLS:t,EDITOR_DEFAULT_LINK_PREFIX:_};exports.EDITOR_DEFAULT_LINK_PREFIX=_;exports.EDITOR_SUPPORTED_LINK_PROTOCOLS=t;exports.default=e;
+//# sourceMappingURL=editor-constants.cjs.map

package/dist/vue3/lib/editor/editor-constants.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor-constants.cjs","sources":["../../../recipes/conversation_view/editor/editor_constants.js"],"sourcesContent":["export const EDITOR_SUPPORTED_LINK_PROTOCOLS = [\n  /^https?:\\/\\//,\n  /^http?:\\/\\//,\n  /^ftp?:\\/\\//,\n  /^ftps?:\\/\\//,\n  /^ftps?:\\/\\//,\n  /mailto:([^?]*)/,\n];\n\nexport const EDITOR_DEFAULT_LINK_PREFIX = 'https://';\n\nexport default {\n  EDITOR_SUPPORTED_LINK_PROTOCOLS,\n  EDITOR_DEFAULT_LINK_PREFIX,\n};\n"],"names":["EDITOR_SUPPORTED_LINK_PROTOCOLS","EDITOR_DEFAULT_LINK_PREFIX","editor_constants"],"mappings":"4GAAY,MAACA,EAAkC,CAC7C,eACA,cACA,aACA,cACA,cACA,gBACF,EAEaC,EAA6B,WAE3BC,EAAA,CACb,gCAAAF,EACA,2BAAAC,CACF"}

package/dist/vue3/lib/editor/editor-constants.js

@@ -0,0 +1,17 @@
+const t = [
+  /^https?:\/\//,
+  /^http?:\/\//,
+  /^ftp?:\/\//,
+  /^ftps?:\/\//,
+  /^ftps?:\/\//,
+  /mailto:([^?]*)/
+], s = "https://", o = {
+  EDITOR_SUPPORTED_LINK_PROTOCOLS: t,
+  EDITOR_DEFAULT_LINK_PREFIX: s
+};
+export {
+  s as EDITOR_DEFAULT_LINK_PREFIX,
+  t as EDITOR_SUPPORTED_LINK_PROTOCOLS,
+  o as default
+};
+//# sourceMappingURL=editor-constants.js.map

package/dist/vue3/lib/editor/editor-constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor-constants.js","sources":["../../../recipes/conversation_view/editor/editor_constants.js"],"sourcesContent":["export const EDITOR_SUPPORTED_LINK_PROTOCOLS = [\n  /^https?:\\/\\//,\n  /^http?:\\/\\//,\n  /^ftp?:\\/\\//,\n  /^ftps?:\\/\\//,\n  /^ftps?:\\/\\//,\n  /mailto:([^?]*)/,\n];\n\nexport const EDITOR_DEFAULT_LINK_PREFIX = 'https://';\n\nexport default {\n  EDITOR_SUPPORTED_LINK_PROTOCOLS,\n  EDITOR_DEFAULT_LINK_PREFIX,\n};\n"],"names":["EDITOR_SUPPORTED_LINK_PROTOCOLS","EDITOR_DEFAULT_LINK_PREFIX","editor_constants"],"mappings":"AAAY,MAACA,IAAkC;AAAA,EAC7C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAEaC,IAA6B,YAE3BC,IAAA;AAAA,EACb,iCAAAF;AAAA,EACA,4BAAAC;AACF;"}

package/dist/vue3/lib/editor/editor.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const g=require("./editor-constants.cjs"),B=require("../../common/utils/index.cjs"),o=require("@dialpad/dialtone-icons/vue3"),e=require("vue"),C=require("../../_plugin-vue_export-helper-BRilXfQE.cjs"),L=require("../rich-text-editor/rich-text-editor.cjs"),T=require("../button/button.cjs"),b=require("../popover/popover.cjs"),x=require("../stack/stack.cjs"),A=require("../input/input.cjs"),_=require("../tooltip/tooltip.cjs"),f=require("../rich-text-editor/rich-text-editor-constants.cjs"),y={compatConfig:{MODE:3},name:"DtRecipeEditor",components:{DtRichTextEditor:L.default,DtButton:T.default,DtPopover:b.default,DtStack:x.default,DtInput:A.default,DtTooltip:_.default,DtIconLightningBolt:o.DtIconLightningBolt,DtIconBold:o.DtIconBold,DtIconItalic:o.DtIconItalic,DtIconUnderline:o.DtIconUnderline,DtIconStrikethrough:o.DtIconStrikethrough,DtIconListBullet:o.DtIconListBullet,DtIconListOrdered:o.DtIconListOrdered,DtIconAlignLeft:o.DtIconAlignLeft,DtIconAlignCenter:o.DtIconAlignCenter,DtIconAlignRight:o.DtIconAlignRight,DtIconAlignJustify:o.DtIconAlignJustify,DtIconQuote:o.DtIconQuote,DtIconCodeBlock:o.DtIconCodeBlock,DtIconLink2:o.DtIconLink2,DtIconImage:o.DtIconImage},mixins:[],inheritAttrs:!1,props:{value:{type:[Object,String],default:""},editable:{type:Boolean,default:!0},inputAriaLabel:{type:String,required:!0,default:""},inputClass:{type:String,default:""},autoFocus:{type:[Boolean,String,Number],default:!1,validator(t){return typeof t=="string"?f.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES.includes(t):!0}},placeholder:{type:String,default:""},maxHeight:{type:String,default:"unset"},confirmSetLinkButton:{type:Object,default:()=>({label:"Confirm",ariaLabel:"Confirm set link"})},removeLinkButton:{type:Object,default:()=>({label:"Remove",ariaLabel:"Remove link"})},cancelSetLinkButton:{type:Object,default:()=>({label:"Cancel",ariaLabel:"Cancel set link"})},setLinkPlaceholder:{type:String,default:""},showBoldButton:{type:Boolean,default:!0},showItalicsButton:{type:Boolean,default:!0},showUnderlineButton:{type:Boolean,default:!0},showStrikeButton:{type:Boolean,default:!0},showListItemsButton:{type:Boolean,default:!0},showOrderedListButton:{type:Boolean,default:!0},showAlignLeftButton:{type:Boolean,default:!0},showAlignCenterButton:{type:Boolean,default:!0},showAlignRightButton:{type:Boolean,default:!0},showAlignJustifyButton:{type:Boolean,default:!0},showQuoteButton:{type:Boolean,default:!0},showCodeBlockButton:{type:Boolean,default:!0},showQuickRepliesButton:{type:Boolean,default:!0},showInlineImageButton:{type:Boolean,default:!1},showAddLink:{type:Object,default:()=>({showAddLinkButton:!0,setLinkTitle:"Add a link",setLinkInputAriaLabel:"Input field to add link"})},useDivTags:{type:Boolean,default:!1}},emits:["focus","blur","input","quick-replies-click","inline-image-click","text-input"],data(){return{internalInputValue:this.value,hasFocus:!1,linkOptions:{class:"d-recipe-editor__link"},showLinkInput:!1,linkInput:""}},computed:{inputLength(){return this.internalInputValue.length},htmlOutputFormat(){return f.RICH_TEXT_EDITOR_OUTPUT_FORMATS[2]},showingTextFormatButtons(){return this.showBoldButton||this.showItalicsButton||this.showStrikeButton||this.showUnderlineButton},showingAlignmentButtons(){return this.showAlignLeftButton||this.showAlignCenterButton||this.showAlignRightButton||this.showAlignJustifyButton},showingListButtons(){return this.showListItemsButton||this.showOrderedListButton},buttonGroups(){const t=this.individualButtons.map(i=>({key:i.selector,buttonGroup:[i]}));return[{key:"new",buttonGroup:this.newButtons},{key:"format",buttonGroup:this.textFormatButtons},{key:"alignment",buttonGroup:this.alignmentButtons},{key:"list",buttonGroup:this.listButtons},...t].filter(i=>i.buttonGroup.length>0)},newButtons(){return[{showBtn:this.showQuickRepliesButton,label:"Quick reply",selector:"quickReplies",icon:o.DtIconLightningBolt,dataQA:"dt-recipe-editor-quick-replies-btn",tooltipMessage:"Quick Reply",onClick:this.onQuickRepliesClick}].filter(t=>t.showBtn)},textFormatButtons(){return[{showBtn:this.showBoldButton,selector:"bold",icon:o.DtIconBold,dataQA:"dt-recipe-editor-bold-btn",tooltipMessage:"Bold",onClick:this.onBoldTextToggle},{showBtn:this.showItalicsButton,selector:"italic",icon:o.DtIconItalic,dataQA:"dt-recipe-editor-italics-btn",tooltipMessage:"Italics",onClick:this.onItalicTextToggle},{showBtn:this.showUnderlineButton,selector:"underline",icon:o.DtIconUnderline,dataQA:"dt-recipe-editor-underline-btn",tooltipMessage:"Underline",onClick:this.onUnderlineTextToggle},{showBtn:this.showStrikeButton,selector:"strike",icon:o.DtIconStrikethrough,dataQA:"dt-recipe-editor-strike-btn",tooltipMessage:"Strike",onClick:this.onStrikethroughTextToggle}].filter(t=>t.showBtn)},alignmentButtons(){return[{showBtn:this.showAlignLeftButton,selector:{textAlign:"left"},icon:o.DtIconAlignLeft,dataQA:"dt-recipe-editor-align-left-btn",tooltipMessage:"Align Left",onClick:()=>this.onTextAlign("left")},{showBtn:this.showAlignCenterButton,selector:{textAlign:"center"},icon:o.DtIconAlignCenter,dataQA:"dt-recipe-editor-align-center-btn",tooltipMessage:"Align Center",onClick:()=>this.onTextAlign("center")},{showBtn:this.showAlignRightButton,selector:{textAlign:"right"},icon:o.DtIconAlignRight,dataQA:"dt-recipe-editor-align-right-btn",tooltipMessage:"Align Right",onClick:()=>this.onTextAlign("right")},{showBtn:this.showAlignJustifyButton,selector:{textAlign:"justify"},icon:o.DtIconAlignJustify,dataQA:"dt-recipe-editor-align-justify-btn",tooltipMessage:"Align Justify",onClick:()=>this.onTextAlign("justify")}].filter(t=>t.showBtn)},listButtons(){return[{showBtn:this.showListItemsButton,selector:"bulletList",icon:o.DtIconListBullet,dataQA:"dt-recipe-editor-list-items-btn",tooltipMessage:"Bullet List",onClick:this.onBulletListToggle},{showBtn:this.showOrderedListButton,selector:"orderedList",icon:o.DtIconListOrdered,dataQA:"dt-recipe-editor-ordered-list-items-btn",tooltipMessage:"Ordered List",onClick:this.onOrderedListToggle}].filter(t=>t.showBtn)},individualButtons(){return[{showBtn:this.showQuoteButton,selector:"blockquote",icon:o.DtIconQuote,dataQA:"dt-recipe-editor-blockquote-btn",tooltipMessage:"Quote",onClick:this.onBlockquoteToggle},{showBtn:this.showCodeBlockButton,selector:"codeBlock",icon:o.DtIconCodeBlock,dataQA:"dt-recipe-editor-code-block-btn",tooltipMessage:"Code",onClick:this.onCodeBlockToggle},{showBtn:this.showInlineImageButton,selector:"image",icon:o.DtIconImage,dataQA:"dt-recipe-editor-inline-image-btn",tooltipMessage:"Image",onClick:this.onInsertInlineImageClick}].filter(t=>t.showBtn)},linkButton(){return{showBtn:this.showAddLink.showAddLinkButton,selector:"link",icon:o.DtIconLink2,dataQA:"dt-recipe-editor-add-link-btn",tooltipMessage:"Link",onClick:this.openLinkInput}}},watch:{value(t){this.internalInputValue=t}},methods:{removeClassStyleAttrs:B.removeClassStyleAttrs,addClassStyleAttrs:B.addClassStyleAttrs,onInputFocus(t){t==null||t.stopPropagation()},removeLink(){var t,i,l,s,r;(r=(s=(l=(i=(t=this.$refs.richTextEditor)==null?void 0:t.editor)==null?void 0:i.chain())==null?void 0:l.focus())==null?void 0:s.unsetLink())==null||r.run(),this.closeLinkInput()},setLink(t){var r,n,u;const i=(r=this.$refs.richTextEditor)==null?void 0:r.editor;if(t==null||t.preventDefault(),t==null||t.stopPropagation(),!this.linkInput){this.removeLink();return}g.EDITOR_SUPPORTED_LINK_PROTOCOLS.find(d=>d.test(this.linkInput))||(this.linkInput=`${g.EDITOR_DEFAULT_LINK_PREFIX}${this.linkInput}`);const s=(u=(n=i==null?void 0:i.view)==null?void 0:n.state)==null?void 0:u.selection;s.anchor===s.head?i.chain().focus().insertContentAt(s.anchor,`<a class="${this.linkOptions.class}" href=${this.linkInput}>${this.linkInput}</a>`).run():i.chain().focus().extendMarkRange("link").setLink({href:this.linkInput,class:this.linkOptions.class}).run(),this.closeLinkInput()},openLinkInput(){this.showLinkInput=!0},updateInput(t){var i,l,s;if(!t)return this.closeLinkInput();this.linkInput=(s=(l=(i=this.$refs.richTextEditor)==null?void 0:i.editor)==null?void 0:l.getAttributes("link"))==null?void 0:s.href},closeLinkInput(){var t;this.showLinkInput=!1,this.linkInput="",(t=this.$refs.richTextEditor.editor)==null||t.chain().focus()},onBoldTextToggle(){var t,i;(i=(t=this.$refs.richTextEditor)==null?void 0:t.editor)==null||i.chain().focus().toggleBold().run()},onItalicTextToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleItalic().run()},onUnderlineTextToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleUnderline().run()},onStrikethroughTextToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleStrike().run()},onTextAlign(t){var i,l,s,r;if((l=(i=this.$refs.richTextEditor)==null?void 0:i.editor)!=null&&l.isActive({textAlign:t}))return(s=this.$refs.richTextEditor)==null?void 0:s.editor.chain().focus().unsetTextAlign().run();(r=this.$refs.richTextEditor)==null||r.editor.chain().focus().setTextAlign(t).run()},onBulletListToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleBulletList().run()},onOrderedListToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleOrderedList().run()},onCodeBlockToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleCodeBlock().run()},onQuickRepliesClick(){this.$emit("quick-replies-click")},onInsertInlineImageClick(){this.$emit("inline-image-click")},insertInlineImage(t){var i;(i=this.$refs.richTextEditor)==null||i.editor.chain().focus().setImage({src:t}).run()},insertInMessageBody(t){var i;(i=this.$refs.richTextEditor)==null||i.editor.chain().focus().insertContent(t).run()},setCursorPosition(t=null){var i;(i=this.$refs.richTextEditor)==null||i.editor.chain().focus(t).run()},onBlockquoteToggle(){var t;(t=this.$refs.richTextEditor)==null||t.editor.chain().focus().toggleBlockquote().run()},onTextInput(t){this.$emit("text-input",t)},onFocus(t){this.hasFocus=!0,this.$emit("focus",t)},onBlur(t){this.hasFocus=!1,this.$emit("blur",t)},onInput(t){this.$emit("input",t)}}},D=e.createElementVNode("div",{class:"d-recipe-editor__button-group-divider"},null,-1),v={class:"d-recipe-editor__popover-content"},E={key:0};function S(t,i,l,s,r,n){const u=e.resolveComponent("dt-button"),d=e.resolveComponent("dt-tooltip"),h=e.resolveComponent("dt-stack"),I=e.resolveComponent("dt-input"),m=e.resolveComponent("dt-popover"),w=e.resolveComponent("dt-rich-text-editor");return e.openBlock(),e.createElementBlock("div",e.mergeProps({class:"d-recipe-editor"},n.addClassStyleAttrs(t.$attrs),{"data-qa":"dt-recipe-editor",role:"presentation",onClick:i[4]||(i[4]=a=>t.$refs.richTextEditor.focusEditor())}),[e.createVNode(h,{class:"d-recipe-editor__top-bar",direction:"row",gap:"450"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.buttonGroups,a=>(e.openBlock(),e.createBlock(h,{key:a.key,direction:"row",gap:"300"},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.buttonGroup,c=>(e.openBlock(),e.createBlock(d,{key:`${a.key}-${JSON.stringify(c.selector)}`,message:c.tooltipMessage,placement:"top"},{anchor:e.withCtx(()=>{var p,k;return[e.createVNode(u,{active:(k=(p=t.$refs.richTextEditor)==null?void 0:p.editor)==null?void 0:k.isActive(c.selector),"aria-label":c.tooltipMessage,"data-qa":c.dataQA,importance:"clear",kind:"muted",size:"xs",onClick:q=>c.onClick()},{icon:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(c.icon),{size:"200"}))]),default:e.withCtx(()=>[e.createTextVNode(" "+e.toDisplayString(c==null?void 0:c.label),1)]),_:2},1032,["active","aria-label","data-qa","onClick"])]}),_:2},1032,["message"]))),128)),D]),_:2},1024))),128)),n.linkButton.showBtn?(e.openBlock(),e.createBlock(h,{key:0,direction:"row",gap:"300"},{default:e.withCtx(()=>[e.createVNode(m,{open:r.showLinkInput,"show-close-button":!1,"visually-hidden-close":!0,"visually-hidden-close-label":"Close link input popover","data-qa":"dt-recipe-editor-link-input-popover",padding:"none",placement:"bottom-start",onClick:[n.onInputFocus,e.withModifiers(n.onInputFocus,["stop"])],onOpened:n.updateInput},{anchor:e.withCtx(()=>[(e.openBlock(),e.createBlock(d,{key:n.linkButton.key,message:n.linkButton.tooltipMessage,placement:"top"},{anchor:e.withCtx(()=>{var a,c;return[e.createVNode(u,{active:(c=(a=t.$refs.richTextEditor)==null?void 0:a.editor)==null?void 0:c.isActive(n.linkButton.selector),"aria-label":n.linkButton.tooltipMessage,"data-qa":n.linkButton.dataQA,importance:"clear",kind:"muted",size:"xs",onClick:i[0]||(i[0]=p=>n.linkButton.onClick())},{icon:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(n.linkButton.icon),{size:"200"}))]),_:1},8,["active","aria-label","data-qa"])]}),_:1},8,["message"]))]),content:e.withCtx(()=>[e.createElementVNode("div",v,[l.showAddLink.setLinkTitle.length>0?(e.openBlock(),e.createElementBlock("span",E,e.toDisplayString(l.showAddLink.setLinkTitle),1)):e.createCommentVNode("",!0),e.createVNode(I,{modelValue:r.linkInput,"onUpdate:modelValue":i[1]||(i[1]=a=>r.linkInput=a),"input-aria-label":l.showAddLink.setLinkInputAriaLabel,placeholder:l.setLinkPlaceholder,"data-qa":"dt-recipe-editor-link-input","input-wrapper-class":"d-recipe-editor-link__input-wrapper",onClick:[n.onInputFocus,e.withModifiers(n.onInputFocus,["stop"])],onFocus:n.onInputFocus,onKeydown:e.withKeys(n.setLink,["enter"])},null,8,["modelValue","input-aria-label","placeholder","onClick","onFocus","onKeydown"])])]),footerContent:e.withCtx(()=>[e.createVNode(h,{direction:"row",gap:"300",class:"d-recipe-editor__popover-footer"},{default:e.withCtx(()=>[e.createVNode(u,{"aria-label":l.removeLinkButton.ariaLabel,"data-qa":"dt-recipe-editor-remove-link-btn",importance:"clear",kind:"muted",size:"sm",onClick:n.removeLink},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(l.removeLinkButton.label),1)]),_:1},8,["aria-label","onClick"]),e.createVNode(u,{"aria-label":l.cancelSetLinkButton.ariaLabel,"data-qa":"dt-recipe-editor-set-link-cancel-btn",importance:"clear",kind:"muted",size:"sm",onClick:n.closeLinkInput},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(l.cancelSetLinkButton.label),1)]),_:1},8,["aria-label","onClick"]),e.createVNode(u,{"aria-label":l.confirmSetLinkButton.ariaLabel,"data-qa":"dt-recipe-editor-set-link-confirm-btn",size:"sm",onClick:n.setLink},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(l.confirmSetLinkButton.label),1)]),_:1},8,["aria-label","onClick"])]),_:1})]),_:1},8,["open","onClick","onOpened"])]),_:1})):e.createCommentVNode("",!0)]),_:1}),e.createElementVNode("div",{style:e.normalizeStyle({"max-height":l.maxHeight}),class:"d-recipe-editor__content"},[e.createVNode(w,e.mergeProps({ref:"richTextEditor",modelValue:r.internalInputValue,"onUpdate:modelValue":i[2]||(i[2]=a=>r.internalInputValue=a),"allow-inline-images":!0,"allow-line-breaks":!0,"hide-link-bubble-menu":!0,"auto-focus":l.autoFocus,editable:l.editable,"input-aria-label":l.inputAriaLabel,"input-class":`d-recipe-editor__content-input ${l.inputClass}`,link:!0,"output-format":n.htmlOutputFormat,placeholder:l.placeholder,"use-div-tags":l.useDivTags,"data-qa":"dt-rich-text-editor"},n.removeClassStyleAttrs(t.$attrs),{onTextInput:n.onTextInput,onBlur:n.onBlur,onFocus:n.onFocus,onInput:i[3]||(i[3]=a=>n.onInput(a))}),null,16,["modelValue","auto-focus","editable","input-aria-label","input-class","output-format","placeholder","use-div-tags","onTextInput","onBlur","onFocus"])],4)],16)}const O=C._(y,[["render",S]]);exports.default=O;
+//# sourceMappingURL=editor.cjs.map