@dialpad/dialtone-vue 2.129.0 → 2.130.2

package/dist/lib/tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.js","sources":["../../components/tooltip/tooltip.vue"],"sourcesContent":["<template>\n  <div data-qa=\"dt-tooltip-container\">\n    <!-- disabling as the below events are for capturing events from interactive\n         elements within the span rather than on the span itself -->\n    <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->\n    <span\n      v-if=\"!externalAnchor\"\n      ref=\"anchor\"\n      data-qa=\"dt-tooltip-anchor\"\n      @focusin=\"onEnterAnchor\"\n      @focusout=\"onLeaveAnchor\"\n      @mouseenter=\"onEnterAnchor\"\n      @mouseleave=\"onLeaveAnchor\"\n      @keydown.esc=\"onLeaveAnchor\"\n      @touchstart=\"onTouchStart\"\n    >\n      <!-- @slot Slot for the anchor element -->\n      <slot\n        name=\"anchor\"\n      />\n    </span>\n    <dt-lazy-show\n      :id=\"id\"\n      ref=\"content\"\n      :show=\"isVisible\"\n      role=\"tooltip\"\n      aria-hidden=\"false\"\n      data-qa=\"dt-tooltip\"\n      appear\n      :transition=\"transition\"\n      :class=\"[\n        'd-tooltip',\n        `d-tooltip__arrow-tippy--${currentPlacement}`,\n        {\n          [ TOOLTIP_KIND_MODIFIERS.inverted ]: inverted,\n        },\n        contentClass,\n      ]\"\n      v-on=\"tooltipListeners\"\n    >\n      <!-- In case when transitionend event doesn't work correct (for ex. tooltip component with custom trigger) -->\n      <!-- after-leave event can be used instead of transitionend -->\n      <!-- @slot Slot for the content, defaults to message prop -->\n      <slot>\n        {{ message }}\n      </slot>\n    </dt-lazy-show>\n  </div>\n</template>\n\n<script>\nimport {\n  TOOLTIP_KIND_MODIFIERS,\n  TOOLTIP_DIRECTIONS,\n  TOOLTIP_STICKY_VALUES,\n  TOOLTIP_DELAY_MS,\n} from './tooltip_constants.js';\nimport {\n  POPOVER_APPEND_TO_VALUES,\n} from '../popover/popover_constants';\nimport { getUniqueString } from '@/common/utils';\nimport { DtLazyShow } from '@/components/lazy_show';\nimport {\n  createTippy,\n  getAnchor,\n  getPopperOptions,\n} from '@/components/popover/tippy_utils';\n\n/**\n * A tooltip is a floating label that briefly explains an action, function, or an element.\n * Its content is exclusively text and shouldn't be vital information for users.\n * If richer media is desired, consider using a popover instead.\n * @see https://dialtone.dialpad.com/components/tooltip.html\n */\nexport default {\n  name: 'DtTooltip',\n  components: {\n    DtLazyShow,\n  },\n\n  props: {\n    /**\n     * The id of the tooltip\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * If the popover does not fit in the direction described by \"placement\",\n     * it will attempt to change its direction to the \"fallbackPlacements\"\n     * if defined, otherwise it will automatically position to a new location\n     * as it sees best fit. See\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n     *   target=\"_blank\"\n     * >\n     *   Popper.js docs\n     * </a>\n     * */\n    fallbackPlacements: {\n      type: Array,\n      default: () => ['auto'],\n    },\n\n    /**\n     * If true, applies inverted styles to the tooltip\n     * @values true, false\n     */\n    inverted: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     *  Displaces the tooltip from its reference element\n     *  by the specified number of pixels. See\n     *  <a\n     *    class=\"d-link\"\n     *    href=\"https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n     *    target=\"_blank\"\n     *  >\n     *    Tippy.js docs\n     *  </a>\n     */\n    offset: {\n      type: Array,\n      default: () => [0, -4],\n    },\n\n    /**\n     * The direction the popover displays relative to the anchor. See\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\n     *   target=\"_blank\"\n     * >\n     *   Tippy.js docs\n     * </a>\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    placement: {\n      type: String,\n      default: 'top',\n      validator (placement) {\n        return TOOLTIP_DIRECTIONS.includes(placement);\n      },\n    },\n\n    /**\n     * If the tooltip sticks to the anchor. This is usually not needed, but can be needed\n     * if the reference element's position is animating, or to automatically update the popover\n     * position in those cases the DOM layout changes the reference element's position.\n     * `true` enables it, `reference` only checks the \"reference\" rect for changes and `popper` only\n     * checks the \"popper\" rect for changes. See\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://atomiks.github.io/tippyjs/v6/all-props/#sticky\"\n     *   target=\"_blank\"\n     * >\n     *   Tippy.js docs\n     * </a>\n     * @values true, false, reference, popper\n     */\n    sticky: {\n      type: [Boolean, String],\n      default: false,\n      validator: (sticky) => {\n        return TOOLTIP_STICKY_VALUES.includes(sticky);\n      },\n    },\n\n    /**\n     * Sets the element to which the tooltip is going to append to.\n     * 'body' will append to the nearest body (supports shadow DOM).\n     * This prop is not reactive, must be set on initial render.\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     * Additional css classes for the tooltip content element.\n     * Can accept all of String, Object, and Array, i.e. has the\n     * same api as Vue's built-in handling of the class attribute.\n     */\n    contentClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n\n    /**\n     * A provided message for the tooltip content\n     */\n    message: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Controls whether hover/focus causes the tooltip to appear.\n     * Cannot be combined with the show prop. show value will be ignored.\n     * by default this is true, if you override with false, the tooltip will never show up.\n     */\n    enabled: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Controls whether the tooltip is shown. Leaving this null will have the tooltip trigger on mouseover by default.\n     * If you set this value, the default mouseover behavior will be disabled and you can control it as you need.\n     * Supports .sync modifier\n     * @values null, true, false\n     */\n    show: {\n      type: Boolean,\n      default: null,\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     * Whether the tooltip will have a delay when being focused or moused over.\n     * @values true, false\n     */\n    delay: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * External anchor id to use in those cases the anchor can't be provided via the slot.\n     * For instance, using the combobox's input as the anchor for the popover.\n     */\n    externalAnchor: {\n      type: String,\n      default: null,\n    },\n  },\n\n  emits: [\n    /**\n     * Emitted when tooltip is shown or hidden\n     *\n     * @event shown\n     * @type {Boolean}\n     */\n    'shown',\n\n    /**\n     * Sync show value\n     *\n     * @event update:show\n     */\n    'update:show',\n  ],\n\n  data () {\n    return {\n      TOOLTIP_KIND_MODIFIERS,\n      tip: null,\n\n      inTimer: null,\n\n      // Internal state for whether the tooltip is shown. Changing the prop\n      // will update this.\n      isShown: false,\n\n      // this is where the placement currently is, this can be different than\n      // the placement prop when there is not enough available room for the tip\n      // to display and it uses a fallback placement.\n      currentPlacement: this.placement,\n\n      // flag check touch based device\n      isTouchDevice: false,\n    };\n  },\n\n  computed: {\n    // whether the tooltip is visible or not.\n    isVisible () {\n      const hasMessage = !!this.message?.trim();\n      const hasDefaultSlot = !!this.$slots?.default;\n      const isDeviceCompatible = !this.isTouchDevice;\n\n      const shouldBeVisible = this.isShown && this.enabled && (hasMessage || hasDefaultSlot);\n\n      return shouldBeVisible && isDeviceCompatible;\n    },\n\n    tooltipListeners () {\n      return {\n        ...this.$listeners,\n\n        'after-leave': () => {\n          this.onLeaveTransitionComplete();\n        },\n\n        'after-enter': () => {\n          this.onEnterTransitionComplete();\n        },\n      };\n    },\n\n    tippyProps () {\n      return {\n        offset: this.offset,\n        interactive: false,\n        trigger: 'manual',\n        placement: this.placement,\n        sticky: this.sticky,\n        popperOptions: getPopperOptions({\n          fallbackPlacements: this.fallbackPlacements,\n          hasHideModifierEnabled: true,\n          onChangePlacement: this.onChangePlacement,\n        }),\n      };\n    },\n\n    anchor () {\n      return this.externalAnchor ? document.body.querySelector(this.externalAnchor) : getAnchor(this.$refs.anchor);\n    },\n  },\n\n  watch: {\n\n    tippyProps: {\n      handler: 'setProps',\n      deep: true,\n    },\n\n    show: {\n      handler: function (show) {\n        if (show !== null) {\n          this.isShown = show;\n        }\n      },\n\n      immediate: true,\n    },\n\n    isShown (isShown) {\n      if (isShown) {\n        this.setProps();\n        this.tip.show();\n      } else {\n        this.tip.hide();\n      }\n    },\n\n    sticky (sticky) {\n      this.tip.setProps({\n        sticky,\n      });\n    },\n  },\n\n  mounted () {\n    if (!this.enabled && this.show != null) {\n      console.warn('Tooltip: You cannot use both the enabled and show props at the same time.');\n      console.warn('The show prop will be ignored.');\n    }\n    this.externalAnchor && this.addExternalAnchorEventListeners();\n    this.tip = createTippy(this.anchor, this.initOptions());\n\n    // immediate watcher fires before mounted, so have this here in case\n    // show prop was initially set to true.\n    if (this.isShown) {\n      this.tip.show();\n    }\n  },\n\n  beforeDestroy () {\n    this.externalAnchor && this.removeExternalAnchorEventListeners();\n\n    if (this.tip) {\n      this.tip?.destroy();\n    }\n  },\n\n  methods: {\n    calculateAnchorZindex () {\n      // if a modal is currently active render at modal-element z-index, otherwise at tooltip z-index\n      if (this.$el.getRootNode()\n        .querySelector('.d-modal[aria-hidden=\"false\"], .d-modal--transparent[aria-hidden=\"false\"]') ||\n        // Special case because we don't have any dialtone drawer component yet. Render at 651 when\n        // anchor of popover is within a drawer.\n        this.$el.closest('.d-zi-drawer')) {\n        return 651;\n      } else {\n        return 400;\n      }\n    },\n\n    hasVisibleFocus () {\n      return this.anchor.matches(':focus-visible');\n    },\n\n    onEnterAnchor (e) {\n      // Note: This is to stop the call of mouseenter event when touchstart event is triggered,\n      //       as when triggered by click or touch, the relatedTarget property of MouseEvent is null\n      if (this.isTouchDevice && !e.relatedTarget) return;\n\n      if (this.delay) {\n        this.inTimer = setTimeout(function (event) {\n          this.triggerShow(event);\n        }.bind(this, e), TOOLTIP_DELAY_MS);\n      } else {\n        this.triggerShow(e);\n      }\n\n      // since this method will be trigger by mouse event, updating the flag is non-touch device\n      this.isTouchDevice = false;\n    },\n\n    triggerShow (e) {\n      if (e.type === 'focusin') {\n        // only show tooltips on visible focus when triggered via focus.\n        // when the user is using the mouse they only want tooltips to display\n        // on mouseover.\n        //\n        // Example: anchor of a popover is a button with tooltip.\n        // closing it with the mouse would trigger the tooltip to display as\n        // the anchor is focused on close. Not what we want.\n        if (this.show === null && this.hasVisibleFocus()) {\n          this.isShown = true;\n        }\n      } else {\n        if (this.show === null) this.isShown = true;\n      }\n    },\n\n    onLeaveAnchor (e) {\n      if (e.type === 'keydown' && e.code !== 'Escape') return;\n\n      clearTimeout(this.inTimer);\n      this.triggerHide();\n    },\n\n    triggerHide () {\n      if (this.show === null) this.isShown = false;\n    },\n\n    onChangePlacement (placement) {\n      this.currentPlacement = placement;\n    },\n\n    onLeaveTransitionComplete () {\n      this.tip?.unmount();\n      this.$emit('shown', false);\n      if (this.show !== null) {\n        this.$emit('update:show', false);\n      }\n    },\n\n    onEnterTransitionComplete () {\n      this.$emit('shown', true);\n      if (this.show !== null) {\n        this.$emit('update:show', true);\n      }\n    },\n\n    setProps () {\n      if (this.tip && this.tip.setProps) {\n        this.tip.setProps({\n          ...this.tippyProps,\n          zIndex: this.calculateAnchorZindex(),\n          appendTo: this.appendTo === 'body' ? this.anchor?.getRootNode()?.querySelector('body') : this.appendTo,\n        });\n      }\n    },\n\n    onMount () {\n      this.setProps();\n    },\n\n    initOptions () {\n      return {\n        contentElement: this.$refs.content.$el,\n        allowHTML: true,\n        zIndex: this.calculateAnchorZindex(),\n        onMount: this.onMount,\n        ...this.tippyProps,\n      };\n    },\n\n    addExternalAnchorEventListeners () {\n      ['focusin', 'mouseenter'].forEach(listener => {\n        this.anchor.addEventListener(listener, (event) => this.onEnterAnchor(event));\n      });\n      ['focusout', 'mouseleave', 'keydown'].forEach(listener => {\n        this.anchor.addEventListener(listener, (event) => this.onLeaveAnchor(event));\n      });\n    },\n\n    removeExternalAnchorEventListeners () {\n      ['focusin', 'mouseenter'].forEach(listener => {\n        this.anchor.removeEventListener(listener, (event) => this.onEnterAnchor(event));\n      });\n      ['focusout', 'mouseleave', 'keydown'].forEach(listener => {\n        this.anchor.removeEventListener(listener, (event) => this.onLeaveAnchor(event));\n      });\n    },\n\n    onTouchStart () {\n      this.isTouchDevice = true;\n    },\n  },\n};\n</script>\n\n<style lang=\"less\">\n.tippy-box[data-popper-reference-hidden] {\n  .d-tooltip {\n    visibility: hidden;\n    pointer-events: none;\n  }\n}\n</style>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"tooltip.js","sources":["../../components/tooltip/tooltip.vue"],"sourcesContent":["<template>\n  <div data-qa=\"dt-tooltip-container\">\n    <!-- disabling as the below events are for capturing events from interactive\n         elements within the span rather than on the span itself -->\n    <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->\n    <span\n      v-if=\"!externalAnchor\"\n      ref=\"anchor\"\n      data-qa=\"dt-tooltip-anchor\"\n      @focusin=\"onEnterAnchor\"\n      @focusout=\"onLeaveAnchor\"\n      @mouseenter=\"onEnterAnchor\"\n      @mouseleave=\"onLeaveAnchor\"\n      @keydown.esc=\"onLeaveAnchor\"\n      @touchstart=\"onTouchStart\"\n    >\n      <!-- @slot Slot for the anchor element -->\n      <slot\n        name=\"anchor\"\n      />\n    </span>\n    <dt-lazy-show\n      :id=\"id\"\n      ref=\"content\"\n      :show=\"isVisible\"\n      role=\"tooltip\"\n      aria-hidden=\"false\"\n      data-qa=\"dt-tooltip\"\n      appear\n      :transition=\"transition\"\n      :class=\"[\n        'd-tooltip',\n        `d-tooltip__arrow-tippy--${currentPlacement}`,\n        {\n          [ TOOLTIP_KIND_MODIFIERS.inverted ]: inverted,\n        },\n        contentClass,\n      ]\"\n      v-on=\"tooltipListeners\"\n    >\n      <!-- In case when transitionend event doesn't work correct (for ex. tooltip component with custom trigger) -->\n      <!-- after-leave event can be used instead of transitionend -->\n      <!-- @slot Slot for the content, defaults to message prop -->\n      <slot>\n        {{ message }}\n      </slot>\n    </dt-lazy-show>\n  </div>\n</template>\n\n<script>\nimport {\n  TOOLTIP_KIND_MODIFIERS,\n  TOOLTIP_DIRECTIONS,\n  TOOLTIP_STICKY_VALUES,\n  TOOLTIP_DELAY_MS,\n} from './tooltip_constants.js';\nimport {\n  POPOVER_APPEND_TO_VALUES,\n} from '../popover/popover_constants';\nimport { getUniqueString } from '@/common/utils';\nimport { DtLazyShow } from '@/components/lazy_show';\nimport {\n  createTippy,\n  getAnchor,\n  getPopperOptions,\n} from '@/components/popover/tippy_utils';\n\n/**\n * A tooltip is a floating label that briefly explains an action, function, or an element.\n * Its content is exclusively text and shouldn't be vital information for users.\n * If richer media is desired, consider using a popover instead.\n * @see https://dialtone.dialpad.com/components/tooltip.html\n */\nexport default {\n  name: 'DtTooltip',\n  components: {\n    DtLazyShow,\n  },\n\n  props: {\n    /**\n     * The id of the tooltip\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * If the popover does not fit in the direction described by \"placement\",\n     * it will attempt to change its direction to the \"fallbackPlacements\"\n     * if defined, otherwise it will automatically position to a new location\n     * as it sees best fit. See\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n     *   target=\"_blank\"\n     * >\n     *   Popper.js docs\n     * </a>\n     * */\n    fallbackPlacements: {\n      type: Array,\n      default: () => ['auto'],\n    },\n\n    /**\n     * If true, applies inverted styles to the tooltip\n     * @values true, false\n     */\n    inverted: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     *  Displaces the tooltip from its reference element\n     *  by the specified number of pixels. See\n     *  <a\n     *    class=\"d-link\"\n     *    href=\"https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n     *    target=\"_blank\"\n     *  >\n     *    Tippy.js docs\n     *  </a>\n     */\n    offset: {\n      type: Array,\n      default: () => [0, -4],\n    },\n\n    /**\n     * The direction the popover displays relative to the anchor. See\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\n     *   target=\"_blank\"\n     * >\n     *   Tippy.js docs\n     * </a>\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    placement: {\n      type: String,\n      default: 'top',\n      validator (placement) {\n        return TOOLTIP_DIRECTIONS.includes(placement);\n      },\n    },\n\n    /**\n     * If the tooltip sticks to the anchor. This is usually not needed, but can be needed\n     * if the reference element's position is animating, or to automatically update the popover\n     * position in those cases the DOM layout changes the reference element's position.\n     * `true` enables it, `reference` only checks the \"reference\" rect for changes and `popper` only\n     * checks the \"popper\" rect for changes. See\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://atomiks.github.io/tippyjs/v6/all-props/#sticky\"\n     *   target=\"_blank\"\n     * >\n     *   Tippy.js docs\n     * </a>\n     * @values true, false, reference, popper\n     */\n    sticky: {\n      type: [Boolean, String],\n      default: false,\n      validator: (sticky) => {\n        return TOOLTIP_STICKY_VALUES.includes(sticky);\n      },\n    },\n\n    /**\n     * Sets the element to which the tooltip is going to append to.\n     * 'body' will append to the nearest body (supports shadow DOM).\n     * This prop is not reactive, must be set on initial render.\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     * Additional css classes for the tooltip content element.\n     * Can accept all of String, Object, and Array, i.e. has the\n     * same api as Vue's built-in handling of the class attribute.\n     */\n    contentClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n\n    /**\n     * A provided message for the tooltip content\n     */\n    message: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Controls whether hover/focus causes the tooltip to appear.\n     * Cannot be combined with the show prop. show value will be ignored.\n     * by default this is true, if you override with false, the tooltip will never show up.\n     */\n    enabled: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Controls whether the tooltip is shown. Leaving this null will have the tooltip trigger on mouseover by default.\n     * If you set this value, the default mouseover behavior will be disabled and you can control it as you need.\n     * Supports .sync modifier\n     * @values null, true, false\n     */\n    show: {\n      type: Boolean,\n      default: null,\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     * Whether the tooltip will have a delay when being focused or moused over.\n     * @values true, false\n     */\n    delay: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * External anchor id to use in those cases the anchor can't be provided via the slot.\n     * For instance, using the combobox's input as the anchor for the popover.\n     */\n    externalAnchor: {\n      type: String,\n      default: null,\n    },\n  },\n\n  emits: [\n    /**\n     * Emitted when tooltip is shown or hidden\n     *\n     * @event shown\n     * @type {Boolean}\n     */\n    'shown',\n\n    /**\n     * Sync show value\n     *\n     * @event update:show\n     */\n    'update:show',\n  ],\n\n  data () {\n    return {\n      TOOLTIP_KIND_MODIFIERS,\n      tip: null,\n\n      inTimer: null,\n\n      // Internal state for whether the tooltip is shown. Changing the prop\n      // will update this.\n      isShown: false,\n\n      // this is where the placement currently is, this can be different than\n      // the placement prop when there is not enough available room for the tip\n      // to display and it uses a fallback placement.\n      currentPlacement: this.placement,\n\n      // flag check touch based device\n      isTouchDevice: false,\n    };\n  },\n\n  computed: {\n    // whether the tooltip is visible or not.\n    isVisible () {\n      const hasMessage = !!this.message?.trim();\n      const hasDefaultSlot = !!this.$slots?.default;\n      const isDeviceCompatible = !this.isTouchDevice;\n\n      const shouldBeVisible = this.isShown && this.enabled && (hasMessage || hasDefaultSlot);\n\n      return shouldBeVisible && isDeviceCompatible;\n    },\n\n    tooltipListeners () {\n      return {\n        ...this.$listeners,\n\n        'after-leave': () => {\n          this.onLeaveTransitionComplete();\n        },\n\n        'after-enter': () => {\n          this.onEnterTransitionComplete();\n        },\n      };\n    },\n\n    tippyProps () {\n      return {\n        offset: this.offset,\n        interactive: false,\n        trigger: 'manual',\n        placement: this.placement,\n        sticky: this.sticky,\n        popperOptions: getPopperOptions({\n          fallbackPlacements: this.fallbackPlacements,\n          hasHideModifierEnabled: true,\n          onChangePlacement: this.onChangePlacement,\n        }),\n      };\n    },\n\n    anchor () {\n      return this.externalAnchor ? document.body.querySelector(this.externalAnchor) : getAnchor(this.$refs.anchor);\n    },\n  },\n\n  watch: {\n\n    tippyProps: {\n      handler: 'setProps',\n      deep: true,\n    },\n\n    show: {\n      handler: function (show) {\n        if (show !== null) {\n          this.isShown = show;\n        }\n      },\n\n      immediate: true,\n    },\n\n    isShown (isShown) {\n      if (isShown) {\n        this.setProps();\n        this.tip.show();\n      } else {\n        this.tip.hide();\n      }\n    },\n\n    sticky (sticky) {\n      this.tip.setProps({\n        sticky,\n      });\n    },\n  },\n\n  mounted () {\n    if (!this.enabled && this.show != null) {\n      console.warn('Tooltip: You cannot use both the enabled and show props at the same time.');\n      console.warn('The show prop will be ignored.');\n    }\n    this.externalAnchor && this.addExternalAnchorEventListeners();\n    this.tip = createTippy(this.anchor, this.initOptions());\n\n    // immediate watcher fires before mounted, so have this here in case\n    // show prop was initially set to true.\n    if (this.isShown) {\n      this.tip.show();\n    }\n  },\n\n  beforeDestroy () {\n    this.externalAnchor && this.removeExternalAnchorEventListeners();\n\n    if (this.tip) {\n      this.tip?.destroy();\n    }\n  },\n\n  methods: {\n    calculateAnchorZindex () {\n      // if a modal is currently active render at modal-element z-index, otherwise at tooltip z-index\n      if (this.$el.getRootNode()\n        .querySelector('.d-modal[aria-hidden=\"false\"], .d-modal--transparent[aria-hidden=\"false\"]') ||\n        // Special case because we don't have any dialtone drawer component yet. Render at 651 when\n        // anchor of popover is within a drawer.\n        this.$el.closest('.d-zi-drawer')) {\n        return 651;\n      } else {\n        return 400;\n      }\n    },\n\n    hasVisibleFocus () {\n      return this.anchor.matches(':focus-visible');\n    },\n\n    onEnterAnchor (e) {\n      // Note: This is to stop the call of mouseenter event when touchstart event is triggered,\n      //       as when triggered by click or touch, the relatedTarget property of MouseEvent is null\n      if (this.isTouchDevice && !e.relatedTarget) return;\n\n      if (this.delay && this.inTimer === null) {\n        this.inTimer = setTimeout(() => {\n          this.triggerShow(e);\n        }, TOOLTIP_DELAY_MS);\n      } else {\n        this.triggerShow(e);\n      }\n\n      // since this method will be trigger by mouse event, updating the flag is non-touch device\n      this.isTouchDevice = false;\n    },\n\n    triggerShow (e) {\n      if (e.type === 'focusin') {\n        // only show tooltips on visible focus when triggered via focus.\n        // when the user is using the mouse they only want tooltips to display\n        // on mouseover.\n        //\n        // Example: anchor of a popover is a button with tooltip.\n        // closing it with the mouse would trigger the tooltip to display as\n        // the anchor is focused on close. Not what we want.\n        if (this.show === null && this.hasVisibleFocus()) {\n          this.isShown = true;\n        }\n      } else {\n        if (this.show === null) this.isShown = true;\n      }\n    },\n\n    onLeaveAnchor (e) {\n      if (e.type === 'keydown' && e.code !== 'Escape') return;\n\n      clearTimeout(this.inTimer);\n      this.inTimer = null;\n      this.triggerHide();\n    },\n\n    triggerHide () {\n      if (this.show === null) this.isShown = false;\n    },\n\n    onChangePlacement (placement) {\n      this.currentPlacement = placement;\n    },\n\n    onLeaveTransitionComplete () {\n      this.tip?.unmount();\n      this.$emit('shown', false);\n      if (this.show !== null) {\n        this.$emit('update:show', false);\n      }\n    },\n\n    onEnterTransitionComplete () {\n      this.$emit('shown', true);\n      if (this.show !== null) {\n        this.$emit('update:show', true);\n      }\n    },\n\n    setProps () {\n      if (this.tip && this.tip.setProps) {\n        this.tip.setProps({\n          ...this.tippyProps,\n          zIndex: this.calculateAnchorZindex(),\n          appendTo: this.appendTo === 'body' ? this.anchor?.getRootNode()?.querySelector('body') : this.appendTo,\n        });\n      }\n    },\n\n    onMount () {\n      this.setProps();\n    },\n\n    initOptions () {\n      return {\n        contentElement: this.$refs.content.$el,\n        allowHTML: true,\n        zIndex: this.calculateAnchorZindex(),\n        onMount: this.onMount,\n        ...this.tippyProps,\n      };\n    },\n\n    addExternalAnchorEventListeners () {\n      ['focusin', 'mouseenter'].forEach(listener => {\n        this.anchor.addEventListener(listener, (event) => this.onEnterAnchor(event));\n      });\n      ['focusout', 'mouseleave', 'keydown'].forEach(listener => {\n        this.anchor.addEventListener(listener, (event) => this.onLeaveAnchor(event));\n      });\n    },\n\n    removeExternalAnchorEventListeners () {\n      ['focusin', 'mouseenter'].forEach(listener => {\n        this.anchor.removeEventListener(listener, (event) => this.onEnterAnchor(event));\n      });\n      ['focusout', 'mouseleave', 'keydown'].forEach(listener => {\n        this.anchor.removeEventListener(listener, (event) => this.onLeaveAnchor(event));\n      });\n    },\n\n    onTouchStart () {\n      this.isTouchDevice = true;\n    },\n  },\n};\n</script>\n\n<style lang=\"less\">\n.tippy-box[data-popper-reference-hidden] {\n  .d-tooltip {\n    visibility: hidden;\n    pointer-events: none;\n  }\n}\n</style>\n"],"names":[],"mappings":"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"}

package/dist/types/common/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../common/utils/index.js"],"names":[],"mappings":"AAqBA,yDAEC;AAED;;;;;;GAMG;AACH,mDAJW,MAAM,OAWhB;AAED;;;;;;;;;;;;;;GAcG;AACH,kCAHW,MAAM,GACL,MAAM,CASjB;AAED;;;;GAIG;AACH,kCAHW,MAAM,GACJ,MAAM,CAIlB;AAED,mDAeC;AAED,qEAQC;AAOD,0EAgBC;AAED,yFAMC;AAED,0DAEC;AAsDD,4DAGC;AAED;;;;;GAKG;AAEH,yCAJY,WAAW,GACX,MAAM,CAejB;AAoED;;;;;GAKG;AACH,gDAJW,MAAM,cACN,MAAM,GACJ,MAAM,CAmBlB;AAeD;;;;GAIG;AACH,qCAHW,MAAM,GAAC,MAAM,GACX,OAAO,CAMnB;AAED;;;;GAIG;AACH,6BAHW,MAAM,GACJ,OAAO,CAMnB;AAED;;;;GAIG;AACH,sCAHW,MAAM,GACJ,OAAO,CAKnB;AAED;;;;;GAKG;AACH,2DAEC;AAED;;;;;GAKG;AACH,2CAJW,MAAM,WACN,MAAM,UAKhB;;;;;IAhOC,uCAOC;;AAGI,8CAIN;AAOM,oDAFM,MAAM,CAOlB;AAOM,oDAFM,MAAM,CAMlB;AA+HD,+BAQE"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../common/utils/index.js"],"names":[],"mappings":"AAqBA,yDAEC;AAED;;;;;;GAMG;AACH,mDAJW,MAAM,OAWhB;AAED;;;;;;;;;;;;;;GAcG;AACH,kCAHW,MAAM,GACL,MAAM,CASjB;AAED;;;;GAIG;AACH,kCAHW,MAAM,GACJ,MAAM,CAIlB;AAED,mDAeC;AAED,qEAQC;AAOD,0EAgBC;AAED,yFAMC;AAED,0DAEC;AAsDD,4DAGC;AAED;;;;;GAKG;AAEH,yCAJY,WAAW,GACX,MAAM,CAejB;AAoED;;;;;GAKG;AACH,gDAJW,MAAM,cACN,MAAM,GACJ,MAAM,CAuBlB;AAeD;;;;GAIG;AACH,qCAHW,MAAM,GAAC,MAAM,GACX,OAAO,CAMnB;AAED;;;;GAIG;AACH,6BAHW,MAAM,GACJ,OAAO,CAMnB;AAED;;;;GAIG;AACH,sCAHW,MAAM,GACJ,OAAO,CAKnB;AAED;;;;;GAKG;AACH,2DAEC;AAED;;;;;GAKG;AACH,2CAJW,MAAM,WACN,MAAM,UAKhB;;;;;IApOC,uCAOC;;AAGI,8CAIN;AAOM,oDAFM,MAAM,CAOlB;AAOM,oDAFM,MAAM,CAMlB;AAmID,+BAQE"}

package/dist/types/components/rich_text_editor/extensions/channels/channel.d.ts

@@ -1,2 +1,3 @@
-export const ChannelPlugin: import("@tiptap/vue-2").Node<import("@tiptap/extension-mention").MentionOptions, any>;
+export const channelRegex: RegExp;
+export const ChannelPlugin: import("@tiptap/core").Node<import("@tiptap/extension-mention").MentionOptions, any>;
 //# sourceMappingURL=channel.d.ts.map

package/dist/types/components/rich_text_editor/extensions/channels/channel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"channel.d.ts","sourceRoot":"","sources":["../../../../../../components/rich_text_editor/extensions/channels/channel.js"],"names":[],"mappings":"AAQA,kHA0CG"}
+{"version":3,"file":"channel.d.ts","sourceRoot":"","sources":["../../../../../../components/rich_text_editor/extensions/channels/channel.js"],"names":[],"mappings":"AAQA,kCAAgD;AA6BhD,iHAqEG"}

package/dist/types/components/rich_text_editor/extensions/emoji/emoji.d.ts

@@ -1,4 +1,5 @@
 export const EmojiPluginKey: PluginKey<any>;
+export const emojiShortCodeRegex: RegExp;
 export const Emoji: Node<any, any>;
 import { PluginKey } from '@tiptap/pm/state';
 import { Node } from '@tiptap/core';

package/dist/types/components/rich_text_editor/extensions/emoji/emoji.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"emoji.d.ts","sourceRoot":"","sources":["../../../../../../components/rich_text_editor/extensions/emoji/emoji.js"],"names":[],"mappings":"AASA,4CAAqD;AAkCrD,mCAiHG;0BAxJuB,kBAAkB;qBAJwB,cAAc"}
+{"version":3,"file":"emoji.d.ts","sourceRoot":"","sources":["../../../../../../components/rich_text_editor/extensions/emoji/emoji.js"],"names":[],"mappings":"AASA,4CAAqD;AAGrD,yCAA4C;AA+B5C,mCAiHG;0BAxJuB,kBAAkB;qBAJwB,cAAc"}

package/dist/types/components/rich_text_editor/extensions/mentions/mention.d.ts

@@ -1,2 +1,3 @@
-export const MentionPlugin: import("@tiptap/vue-2").Node<import("@tiptap/extension-mention").MentionOptions, any>;
+export const mentionRegex: RegExp;
+export const MentionPlugin: import("@tiptap/core").Node<import("@tiptap/extension-mention").MentionOptions, any>;
 //# sourceMappingURL=mention.d.ts.map

package/dist/types/components/rich_text_editor/extensions/mentions/mention.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mention.d.ts","sourceRoot":"","sources":["../../../../../../components/rich_text_editor/extensions/mentions/mention.js"],"names":[],"mappings":"AAOA,kHAmCG"}
+{"version":3,"file":"mention.d.ts","sourceRoot":"","sources":["../../../../../../components/rich_text_editor/extensions/mentions/mention.js"],"names":[],"mappings":"AAQA,kCAAkD;AA6BlD,iHAqEG"}

package/dist/types/components/rich_text_editor/extensions/slash_command/SlashCommandComponent.vue.d.ts

@@ -0,0 +1,47 @@
+declare const _default: import("vue").DefineComponent<{
+    editor: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/core").Editor>;
+    node: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import(".pnpm/prosemirror-model@1.20.0/node_modules/prosemirror-model").Node>;
+    decorations: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/vue-2").DecorationWithType[]>;
+    selected: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<boolean>;
+    extension: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/vue-2").Node<any, any>>;
+    getPos: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").PropOptions<() => number> & {
+        required: true;
+    } & {
+        default?: (() => () => number) | undefined;
+    };
+    updateAttributes: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").PropOptions<(attributes: Record<string, any>) => void> & {
+        required: true;
+    } & {
+        default?: (() => (attributes: Record<string, any>) => void) | undefined;
+    };
+    deleteNode: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").PropOptions<() => void> & {
+        required: true;
+    } & {
+        default?: (() => () => void) | undefined;
+    };
+}, {}, {}, {
+    text(): string;
+}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, "selected-command"[], string, Readonly<import("vue").ExtractPropTypes<{
+    editor: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/core").Editor>;
+    node: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import(".pnpm/prosemirror-model@1.20.0/node_modules/prosemirror-model").Node>;
+    decorations: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/vue-2").DecorationWithType[]>;
+    selected: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<boolean>;
+    extension: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").RequiredPropOptions<import("@tiptap/vue-2").Node<any, any>>;
+    getPos: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").PropOptions<() => number> & {
+        required: true;
+    } & {
+        default?: (() => () => number) | undefined;
+    };
+    updateAttributes: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").PropOptions<(attributes: Record<string, any>) => void> & {
+        required: true;
+    } & {
+        default?: (() => (attributes: Record<string, any>) => void) | undefined;
+    };
+    deleteNode: import(".pnpm/vue-ts-types@1.6.1_vue@2.7.15/node_modules/vue-ts-types/dist/types").PropOptions<() => void> & {
+        required: true;
+    } & {
+        default?: (() => () => void) | undefined;
+    };
+}>>, {}>;
+export default _default;
+//# sourceMappingURL=SlashCommandComponent.vue.d.ts.map

package/dist/types/components/rich_text_editor/extensions/slash_command/SlashCommandComponent.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SlashCommandComponent.vue.d.ts","sourceRoot":"","sources":["../../../../../../components/rich_text_editor/extensions/slash_command/SlashCommandComponent.vue.js"],"names":[],"mappings":""}

package/dist/types/components/rich_text_editor/extensions/slash_command/SlashCommandSuggestion.vue.d.ts

@@ -0,0 +1,17 @@
+declare const _default: import("vue").DefineComponent<{
+    item: {
+        type: ObjectConstructor;
+        required: true;
+    };
+}, {}, {}, {
+    command(): any;
+    description(): any;
+    parametersExample(): any;
+}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{
+    item: {
+        type: ObjectConstructor;
+        required: true;
+    };
+}>>, {}>;
+export default _default;
+//# sourceMappingURL=SlashCommandSuggestion.vue.d.ts.map

package/dist/types/components/rich_text_editor/extensions/slash_command/SlashCommandSuggestion.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SlashCommandSuggestion.vue.d.ts","sourceRoot":"","sources":["../../../../../../components/rich_text_editor/extensions/slash_command/SlashCommandSuggestion.vue.js"],"names":[],"mappings":""}

package/dist/types/components/rich_text_editor/extensions/slash_command/slash_command.d.ts

@@ -0,0 +1,2 @@
+export const SlashCommandPlugin: import("@tiptap/vue-2").Node<import("@tiptap/extension-mention").MentionOptions, any>;
+//# sourceMappingURL=slash_command.d.ts.map

package/dist/types/components/rich_text_editor/extensions/slash_command/slash_command.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slash_command.d.ts","sourceRoot":"","sources":["../../../../../../components/rich_text_editor/extensions/slash_command/slash_command.js"],"names":[],"mappings":"AAuBA,uHAuEG"}

package/dist/types/components/rich_text_editor/extensions/slash_command/suggestion.d.ts

@@ -0,0 +1,12 @@
+declare namespace _default {
+    let allowSpaces: boolean;
+    let startOfLine: boolean;
+    function render(): {
+        onStart: (props: any) => void;
+        onUpdate(props: any): void;
+        onKeyDown(props: any): any;
+        onExit(): void;
+    };
+}
+export default _default;
+//# sourceMappingURL=suggestion.d.ts.map

package/dist/types/components/rich_text_editor/extensions/slash_command/suggestion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"suggestion.d.ts","sourceRoot":"","sources":["../../../../../../components/rich_text_editor/extensions/slash_command/suggestion.js"],"names":[],"mappings":";;;IAeU;;;;;MA0DP"}

package/dist/types/components/rich_text_editor/rich_text_editor.vue.d.ts

@@ -108,6 +108,23 @@ declare const _default: import("vue").DefineComponent<{
         type: ObjectConstructor;
         default: null;
     };
+    /**
+     * suggestion object containing the items query function.
+     * The valid keys passed into this object can be found here: https://tiptap.dev/api/utilities/suggestion
+     *
+     * The only required key is the items function which is used to query the slash commands for suggestion.
+     * items({ query }) => { return [SlashCommandObject]; }
+     * SlashCommandObject format:
+     * { command: string, description: string, parametersExample?: string }
+     * The "parametersExample" parameter is optional, and describes an example
+     * of the parameters that command can take.
+     *
+     * When null, it does not add the plugin.
+     */
+    slashCommandSuggestion: {
+        type: ObjectConstructor;
+        default: null;
+    };
     /**
      * Whether the input allows for block quote.
      */
@@ -153,6 +170,7 @@ declare const _default: import("vue").DefineComponent<{
 }, {}, {
     editor: null;
     popoverOpened: boolean;
+    internalValue: any;
 }, {
     extensions(): import("@tiptap/vue-2").Node<any, any>[];
     inputAttrs(): {
@@ -161,7 +179,18 @@ declare const _default: import("vue").DefineComponent<{
         role: string;
     };
 }, {
+    onSelectedCommand(command: any): void;
     createEditor(): void;
+    /**
+     * This function is necessary as tiptap doesn't render the content passed
+     * directly through `editor.commands.setContent` the content passed down to it
+     * should be already parsed. So We're parsing the elements into it's corresponding
+     * HTML version before setting it.
+     */
+    insertContent(): void;
+    parseEmojis(): void;
+    parseChannels(): void;
+    parseMentions(): void;
     destroyEditor(): void;
     /**
      * The Editor exposes event hooks that we have to map our emits into. See
@@ -282,6 +311,23 @@ declare const _default: import("vue").DefineComponent<{
         type: ObjectConstructor;
         default: null;
     };
+    /**
+     * suggestion object containing the items query function.
+     * The valid keys passed into this object can be found here: https://tiptap.dev/api/utilities/suggestion
+     *
+     * The only required key is the items function which is used to query the slash commands for suggestion.
+     * items({ query }) => { return [SlashCommandObject]; }
+     * SlashCommandObject format:
+     * { command: string, description: string, parametersExample?: string }
+     * The "parametersExample" parameter is optional, and describes an example
+     * of the parameters that command can take.
+     *
+     * When null, it does not add the plugin.
+     */
+    slashCommandSuggestion: {
+        type: ObjectConstructor;
+        default: null;
+    };
     /**
      * Whether the input allows for block quote.
      */
@@ -329,12 +375,13 @@ declare const _default: import("vue").DefineComponent<{
     value: string | Record<string, any>;
     inputClass: string;
     placeholder: string;
+    mentionSuggestion: Record<string, any>;
     channelSuggestion: Record<string, any>;
+    slashCommandSuggestion: Record<string, any>;
     editable: boolean;
     allowLineBreaks: boolean;
     autoFocus: string | number | boolean;
     outputFormat: string;
-    mentionSuggestion: Record<string, any>;
     allowBlockquote: boolean;
     allowBold: boolean;
     allowBulletList: boolean;

package/dist/types/components/rich_text_editor/rich_text_editor.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"rich_text_editor.vue.d.ts","sourceRoot":"","sources":["../../../../components/rich_text_editor/rich_text_editor.vue.js"],"names":[],"mappings":";IAyCI;;;OAGG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;;OAIG;;;;;IAMH;;;;;;;;;;OAUG;;;;;;IAYH;;;;;OAKG;;;;;;IASH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;MAEE;;;;;IAMF;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;;;;;;;;;;;;;;IA4NH;;;OAGG;;;;;;;IAxYH;;;OAGG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;;OAIG;;;;;IAMH;;;;;;;;;;OAUG;;;;;;IAYH;;;;;OAKG;;;;;;IASH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;MAEE;;;;;IAMF;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG"}
+{"version":3,"file":"rich_text_editor.vue.d.ts","sourceRoot":"","sources":["../../../../components/rich_text_editor/rich_text_editor.vue.js"],"names":[],"mappings":";IA8CI;;;OAGG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;;OAIG;;;;;IAMH;;;;;;;;;;OAUG;;;;;;IAYH;;;;;OAKG;;;;;;IASH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;;;;;;;;;;;OAYG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;MAEE;;;;;IAMF;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;;;;;;;;;;;;;;;IAoOH;;;;;OAKG;;;;;;IA2DH;;;OAGG;;;;;;;IAleH;;;OAGG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;;OAIG;;;;;IAMH;;;;;;;;;;OAUG;;;;;;IAYH;;;;;OAKG;;;;;;IASH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;;;;;;;;;;;OAYG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;MAEE;;;;;IAMF;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG"}

package/dist/types/components/rich_text_editor/slash_command_suggestion.d.ts

@@ -0,0 +1,15 @@
+declare namespace _default {
+    function items({ query }: {
+        query: any;
+    }): ({
+        command: string;
+        description: string;
+        parametersExample?: undefined;
+    } | {
+        command: string;
+        parametersExample: string;
+        description: string;
+    })[];
+}
+export default _default;
+//# sourceMappingURL=slash_command_suggestion.d.ts.map

package/dist/types/components/rich_text_editor/slash_command_suggestion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slash_command_suggestion.d.ts","sourceRoot":"","sources":["../../../../components/rich_text_editor/slash_command_suggestion.js"],"names":[],"mappings":";IACE;;;;;;;;;;SAwBC"}

package/dist/types/recipes/conversation_view/message_input/message_input.vue.d.ts

@@ -179,6 +179,23 @@ declare const _default: import("vue").DefineComponent<{
         type: ObjectConstructor;
         default: null;
     };
+    /**
+     * suggestion object containing the items query function.
+     * The valid keys passed into this object can be found here: https://tiptap.dev/api/utilities/suggestion
+     *
+     * The only required key is the items function which is used to query the slash commands for suggestion.
+     * items({ query }) => { return [SlashCommandObject]; }
+     * SlashCommandObject format:
+     * { command: string, description: string, parametersExample?: string }
+     * The "parametersExample" parameter is optional, and describes an example
+     * of the parameters that command can take.
+     *
+     * When null, it does not add the plugin.
+     */
+    slashCommandSuggestion: {
+        type: ObjectConstructor;
+        default: null;
+    };
     /**
      * Whether the input allows for block quote.
      */
@@ -243,6 +260,7 @@ declare const _default: import("vue").DefineComponent<{
     onPaste(e: any): void;
     onSkinTone(skinTone: any): void;
     onSelectEmoji(emoji: any): void;
+    onSelectedCommand(command: any): void;
     onSelectImage(): void;
     onImageUpload(): void;
     toggleEmojiPicker(): void;
@@ -251,7 +269,7 @@ declare const _default: import("vue").DefineComponent<{
     onFocus(event: any): void;
     onBlur(event: any): void;
     onInput(event: any): void;
-}, never, import("vue/types/v3-component-options.js").ComponentOptionsMixin, ("input" | "focus" | "submit" | "blur" | "cancel" | "selected-emoji" | "skin-tone" | "select-media" | "add-media" | "paste-media")[], string, Readonly<import("vue").ExtractPropTypes<{
+}, never, import("vue/types/v3-component-options.js").ComponentOptionsMixin, ("input" | "focus" | "submit" | "blur" | "cancel" | "selected-emoji" | "skin-tone" | "selected-command" | "update:value" | "select-media" | "add-media" | "paste-media")[], string, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Value of the input. The object format should match TipTap's JSON
      * document structure: https://tiptap.dev/guide/output#option-1-json
@@ -432,6 +450,23 @@ declare const _default: import("vue").DefineComponent<{
         type: ObjectConstructor;
         default: null;
     };
+    /**
+     * suggestion object containing the items query function.
+     * The valid keys passed into this object can be found here: https://tiptap.dev/api/utilities/suggestion
+     *
+     * The only required key is the items function which is used to query the slash commands for suggestion.
+     * items({ query }) => { return [SlashCommandObject]; }
+     * SlashCommandObject format:
+     * { command: string, description: string, parametersExample?: string }
+     * The "parametersExample" parameter is optional, and describes an example
+     * of the parameters that command can take.
+     *
+     * When null, it does not add the plugin.
+     */
+    slashCommandSuggestion: {
+        type: ObjectConstructor;
+        default: null;
+    };
     /**
      * Whether the input allows for block quote.
      */
@@ -480,12 +515,13 @@ declare const _default: import("vue").DefineComponent<{
     maxHeight: string;
     inputClass: string;
     placeholder: string;
+    mentionSuggestion: Record<string, any>;
     channelSuggestion: Record<string, any>;
+    slashCommandSuggestion: Record<string, any>;
     editable: boolean;
     inputAriaLabel: string;
     autoFocus: string | number | boolean;
     outputFormat: string;
-    mentionSuggestion: Record<string, any>;
     allowBlockquote: boolean;
     allowBold: boolean;
     allowBulletList: boolean;

package/dist/types/recipes/conversation_view/message_input/message_input.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"message_input.vue.d.ts","sourceRoot":"","sources":["../../../../../recipes/conversation_view/message_input/message_input.vue.js"],"names":[],"mappings":";IAiCI;;;OAGG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;;IAOH;;;;OAIG;;;;;IAMH;;;;;;;;;;OAUG;;;;;;IAYH;;;;;OAKG;;;;;;IASH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;OAGG;;;;;;;;;IAYH;;OAEG;;;;;;IAeH;;OAEG;;;;;IAOH;;OAEG;;;;;IAMH;;OAEG;;;;;;;;;;;;;;;;IAWH;;OAEG;;;;;;;IAMH;;OAEG;;;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;MAEE;;;;;IAMF;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAxPH;;;OAGG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;;IAOH;;;;OAIG;;;;;IAMH;;;;;;;;;;OAUG;;;;;;IAYH;;;;;OAKG;;;;;;IASH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;OAGG;;;;;;;;;IAYH;;OAEG;;;;;;IAeH;;OAEG;;;;;IAOH;;OAEG;;;;;IAMH;;OAEG;;;;;;;;;;;;;;;;IAWH;;OAEG;;;;;;;IAMH;;OAEG;;;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;MAEE;;;;;IAMF;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG"}
+{"version":3,"file":"message_input.vue.d.ts","sourceRoot":"","sources":["../../../../../recipes/conversation_view/message_input/message_input.vue.js"],"names":[],"mappings":";IAiCI;;;OAGG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;;IAOH;;;;OAIG;;;;;IAMH;;;;;;;;;;OAUG;;;;;;IAYH;;;;;OAKG;;;;;;IASH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;OAGG;;;;;;;;;IAYH;;OAEG;;;;;;IAeH;;OAEG;;;;;IAOH;;OAEG;;;;;IAMH;;OAEG;;;;;;;;;;;;;;;;IAWH;;OAEG;;;;;;;IAMH;;OAEG;;;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;;;;;;;;;;;OAYG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;MAEE;;;;;IAMF;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA1QH;;;OAGG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;;IAOH;;;;OAIG;;;;;IAMH;;;;;;;;;;OAUG;;;;;;IAYH;;;;;OAKG;;;;;;IASH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;;OAGG;;;;;;;;;IAYH;;OAEG;;;;;;IAeH;;OAEG;;;;;IAOH;;OAEG;;;;;IAMH;;OAEG;;;;;;;;;;;;;;;;IAWH;;OAEG;;;;;;;IAMH;;OAEG;;;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;;;;;;;;;OAUG;;;;;IAMH;;;;;;;;;;;;OAYG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;MAEE;;;;;IAMF;;OAEG;;;;;IAMH;;OAEG;;;;;IAMH;;OAEG"}

package/package.json

@@ -1,39 +1,39 @@
 {
   "name": "@dialpad/dialtone-vue",
-  "version": "2.129.0",
+  "version": "2.130.2",
   "description": "Vue component library for Dialpad's design system Dialtone",
   "files": [
     "dist"
   ],
   "dependencies": {
     "@linusborg/vue-simple-portal": "0.1.5",
-    "@tiptap/core": "2.2.6",
-    "@tiptap/extension-blockquote": "2.2.6",
-    "@tiptap/extension-bold": "2.2.6",
-    "@tiptap/extension-bullet-list": "2.2.6",
-    "@tiptap/extension-code-block": "2.2.6",
-    "@tiptap/extension-document": "2.2.6",
-    "@tiptap/extension-hard-break": "2.2.6",
-    "@tiptap/extension-italic": "2.2.6",
-    "@tiptap/extension-link": "2.2.6",
-    "@tiptap/extension-list-item": "2.2.6",
-    "@tiptap/extension-mention": "2.2.6",
-    "@tiptap/extension-ordered-list": "2.2.6",
-    "@tiptap/extension-paragraph": "2.1.16",
-    "@tiptap/extension-placeholder": "2.2.6",
-    "@tiptap/extension-strike": "2.2.6",
-    "@tiptap/extension-text": "2.2.6",
-    "@tiptap/extension-text-align": "2.2.6",
-    "@tiptap/extension-underline": "2.2.6",
-    "@tiptap/pm": "2.2.6",
-    "@tiptap/suggestion": "2.2.6",
-    "@tiptap/vue-2": "2.2.6",
+    "@tiptap/core": "2.3.0",
+    "@tiptap/extension-blockquote": "2.3.0",
+    "@tiptap/extension-bold": "2.3.0",
+    "@tiptap/extension-bullet-list": "2.3.0",
+    "@tiptap/extension-code-block": "2.3.0",
+    "@tiptap/extension-document": "2.3.0",
+    "@tiptap/extension-hard-break": "2.3.0",
+    "@tiptap/extension-italic": "2.3.0",
+    "@tiptap/extension-link": "2.3.0",
+    "@tiptap/extension-list-item": "2.3.0",
+    "@tiptap/extension-mention": "2.3.0",
+    "@tiptap/extension-ordered-list": "2.3.0",
+    "@tiptap/extension-paragraph": "2.3.0",
+    "@tiptap/extension-placeholder": "2.3.0",
+    "@tiptap/extension-strike": "2.3.0",
+    "@tiptap/extension-text": "2.3.0",
+    "@tiptap/extension-text-align": "2.3.0",
+    "@tiptap/extension-underline": "2.3.0",
+    "@tiptap/pm": "2.3.0",
+    "@tiptap/suggestion": "2.3.0",
+    "@tiptap/vue-2": "2.3.0",
     "date-fns": "2.30.0",
     "emoji-regex": "10.3.0",
     "emoji-toolkit": "8.0.0",
     "tippy.js": "6.3.7",
-    "@dialpad/dialtone-emojis": "1.0.2",
-    "@dialpad/dialtone-icons": "4.14.0"
+    "@dialpad/dialtone-emojis": "1.0.4",
+    "@dialpad/dialtone-icons": "4.15.1-alpha.1"
   },
   "devDependencies": {
     "@percy/cli": "1.28.2",
@@ -81,8 +81,8 @@
     "vue-tsc": "^1.8.25",
     "yo": "^5.0.0",
     "yorkie": "^2.0.0",
-    "@dialpad/dialtone-css": "8.31.0",
-    "@dialpad/generator-dialtone": "0.1.0"
+    "@dialpad/generator-dialtone": "0.1.0",
+    "@dialpad/dialtone-css": "8.31.0"
   },
   "peerDependencies": {
     "vue": ">=2.6",