@dialpad/dialtone-vue 2.189.4 → 2.189.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("../../common/utils/index.cjs"),s=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),i=require("../popover/popover.cjs"),r=require("../tooltip/tooltip-constants.cjs"),o=require("../popover/popover-constants.cjs"),u={name:"DtHovercard",components:{DtPopover:i.default},props:{open:{type:Boolean,default:null},transition:{type:Boolean,default:!1},fallbackPlacements:{type:Array,default:()=>["auto"]},placement:{type:String,default:"top-start",validator(t){return r.TOOLTIP_DIRECTIONS.includes(t)}},padding:{type:String,default:"large",validator:t=>Object.keys(o.POPOVER_PADDING_CLASSES).some(e=>e===t)},offset:{type:Array,default:()=>[0,16]},id:{type:String,default(){return l.getUniqueString()}},headerClass:{type:[String,Array,Object],default:""},footerClass:{type:[String,Array,Object],default:""},dialogClass:{type:[String,Array,Object],default:""},contentClass:{type:[String,Array,Object],default:""},appendTo:{type:[HTMLElement,String],default:"body",validator:t=>o.POPOVER_APPEND_TO_VALUES.includes(t)||t instanceof HTMLElement},enterDelay:{type:Number,default:r.TOOLTIP_DELAY_MS},leaveDelay:{type:Number,default:r.TOOLTIP_DELAY_MS}},emits:["opened"],data(){return{hovercardOpen:this.open,inTimer:null,outTimer:null}},watch:{open:{handler:function(t){this.hovercardOpen=t},immediate:!0}},methods:{setInTimer(){this.inTimer=setTimeout(()=>{this.hovercardOpen=!0},this.enterDelay)},setOutTimer(){this.outTimer=setTimeout(()=>{this.hovercardOpen=!1},this.leaveDelay)},onMouseEnter(){this.open===null&&(clearTimeout(this.outTimer),this.setInTimer())},onMouseLeave(){this.open===null&&(clearTimeout(this.inTimer),this.setOutTimer())}}};var p=function(){var e=this,a=e._self._c;return a("dt-popover",{attrs:{id:e.id,open:e.hovercardOpen,placement:e.placement,"content-class":e.contentClass,"dialog-class":e.dialogClass,"fallback-placements":e.fallbackPlacements,padding:e.padding,transition:e.transition?"fade":null,offset:e.offset,modal:!1,"initial-focus-element":"none","header-class":e.headerClass,"footer-class":e.footerClass,"append-to":e.appendTo,"data-qa":"dt-hovercard","enter-delay":e.enterDelay,"leave-delay":e.leaveDelay},on:{opened:n=>e.$emit("opened",n),"mouseenter-popover":e.onMouseEnter,"mouseleave-popover":e.onMouseLeave,"mouseenter-popover-anchor":e.onMouseEnter,"mouseleave-popover-anchor":e.onMouseLeave},scopedSlots:e._u([{key:"anchor",fn:function({attrs:n}){return[e._t("anchor",null,null,n)]}},{key:"content",fn:function(){return[e._t("content")]},proxy:!0},{key:"headerContent",fn:function(){return[e._t("headerContent")]},proxy:!0},{key:"footerContent",fn:function(){return[e._t("footerContent")]},proxy:!0}],null,!0)})},d=[],c=s.n(u,p,d);const f=c.exports;exports.default=f;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../../common/utils/index.cjs"),i=require("../../_plugin-vue2_normalizer-e_CkxkSV.cjs"),l=require("../popover/popover.cjs"),o=require("../tooltip/tooltip-constants.cjs"),a=require("../popover/popover-constants.cjs"),u={name:"DtHovercard",components:{DtPopover:l.default},props:{open:{type:Boolean,default:null},transition:{type:Boolean,default:!1},fallbackPlacements:{type:Array,default:()=>["auto"]},placement:{type:String,default:"top-start",validator(t){return o.TOOLTIP_DIRECTIONS.includes(t)}},padding:{type:String,default:"large",validator:t=>Object.keys(a.POPOVER_PADDING_CLASSES).some(e=>e===t)},offset:{type:Array,default:()=>[0,16]},id:{type:String,default(){return s.getUniqueString()}},headerClass:{type:[String,Array,Object],default:""},footerClass:{type:[String,Array,Object],default:""},dialogClass:{type:[String,Array,Object],default:""},contentClass:{type:[String,Array,Object],default:""},appendTo:{type:[HTMLElement,String],default:"body",validator:t=>a.POPOVER_APPEND_TO_VALUES.includes(t)||t instanceof HTMLElement},enterDelay:{type:Number,default:o.TOOLTIP_DELAY_MS},leaveDelay:{type:Number,default:o.TOOLTIP_DELAY_MS}},emits:["opened"],data(){return{hovercardOpen:this.open,anchorEl:null,observer:null,inTimer:null,outTimer:null}},watch:{open:{handler:function(t){this.hovercardOpen=t},immediate:!0}},mounted(){this.$nextTick(()=>{var t,e,r;this.anchorEl=(r=(e=(t=this.$refs.popover)==null?void 0:t.$refs)==null?void 0:e.anchor)==null?void 0:r.firstElementChild,this.observer=new MutationObserver(()=>{this.anchorEl&&!this.anchorEl.isConnected&&(this.hovercardOpen=!1)}),this.observer.observe(document.body,{childList:!0,subtree:!0})})},beforeDestroy(){this.observer&&this.observer.disconnect(),clearTimeout(this.inTimer),clearTimeout(this.outTimer)},methods:{setInTimer(){this.inTimer=setTimeout(()=>{this.hovercardOpen=!0},this.enterDelay)},setOutTimer(){this.outTimer=setTimeout(()=>{this.hovercardOpen=!1},this.leaveDelay)},onMouseEnter(){this.open===null&&(clearTimeout(this.outTimer),this.setInTimer())},onMouseLeave(){this.open===null&&(clearTimeout(this.inTimer),this.setOutTimer())}}};var c=function(){var e=this,r=e._self._c;return r("dt-popover",{ref:"popover",attrs:{id:e.id,open:e.hovercardOpen,placement:e.placement,"content-class":e.contentClass,"dialog-class":e.dialogClass,"fallback-placements":e.fallbackPlacements,padding:e.padding,transition:e.transition?"fade":null,offset:e.offset,modal:!1,"initial-focus-element":"none","header-class":e.headerClass,"footer-class":e.footerClass,"append-to":e.appendTo,"data-qa":"dt-hovercard","enter-delay":e.enterDelay,"leave-delay":e.leaveDelay},on:{opened:n=>e.$emit("opened",n),"mouseenter-popover":e.onMouseEnter,"mouseleave-popover":e.onMouseLeave,"mouseenter-popover-anchor":e.onMouseEnter,"mouseleave-popover-anchor":e.onMouseLeave},scopedSlots:e._u([{key:"anchor",fn:function({attrs:n}){return[e._t("anchor",null,null,n)]}},{key:"content",fn:function(){return[e._t("content")]},proxy:!0},{key:"headerContent",fn:function(){return[e._t("headerContent")]},proxy:!0},{key:"footerContent",fn:function(){return[e._t("footerContent")]},proxy:!0}],null,!0)})},d=[],p=i.n(u,c,d);const f=p.exports;exports.default=f;
2
2
  //# sourceMappingURL=hovercard.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"hovercard.cjs","sources":["../../../components/hovercard/hovercard.vue"],"sourcesContent":["<template>\n <dt-popover\n :id=\"id\"\n :open=\"hovercardOpen\"\n :placement=\"placement\"\n :content-class=\"contentClass\"\n :dialog-class=\"dialogClass\"\n :fallback-placements=\"fallbackPlacements\"\n :padding=\"padding\"\n :transition=\"transition ? 'fade' : null\"\n :offset=\"offset\"\n :modal=\"false\"\n initial-focus-element=\"none\"\n :header-class=\"headerClass\"\n :footer-class=\"footerClass\"\n :append-to=\"appendTo\"\n data-qa=\"dt-hovercard\"\n :enter-delay=\"enterDelay\"\n :leave-delay=\"leaveDelay\"\n @opened=\"(e) => ($emit('opened', e))\"\n @mouseenter-popover=\"onMouseEnter\"\n @mouseleave-popover=\"onMouseLeave\"\n @mouseenter-popover-anchor=\"onMouseEnter\"\n @mouseleave-popover-anchor=\"onMouseLeave\"\n >\n <template #anchor=\"{ attrs }\">\n <slot\n name=\"anchor\"\n v-bind=\"attrs\"\n />\n </template>\n <template #content>\n <slot name=\"content\" />\n </template>\n <template #headerContent>\n <slot name=\"headerContent\" />\n </template>\n\n <template #footerContent>\n <slot name=\"footerContent\" />\n </template>\n </dt-popover>\n</template>\n\n<script>\nimport { POPOVER_APPEND_TO_VALUES, POPOVER_PADDING_CLASSES, DtPopover } from '@/components/popover/index.js';\nimport { TOOLTIP_DIRECTIONS, TOOLTIP_DELAY_MS } from '@/components/tooltip/index.js';\nimport { getUniqueString } from '@/common/utils';\n\nexport default {\n name: 'DtHovercard',\n\n components: {\n DtPopover,\n },\n\n props: {\n /**\n * Controls whether the hovercard is shown. Leaving this null will have the hovercard trigger on hover 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 .sync modifier\n * @values null, true, false\n */\n open: {\n type: Boolean,\n default: null,\n },\n\n /**\n * Fade transition when the content display is toggled.\n * @type boolean\n * @values true, false\n */\n transition: {\n type: Boolean,\n default: false,\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 * @see https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n */\n fallbackPlacements: {\n type: Array,\n default: () => {\n return ['auto'];\n },\n },\n\n /**\n * The direction the popover displays relative to the anchor.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\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-start',\n validator (placement) {\n return TOOLTIP_DIRECTIONS.includes(placement);\n },\n },\n\n /**\n * Padding size class for the popover content.\n * @values none, small, medium, large\n */\n padding: {\n type: String,\n default: 'large',\n validator: (padding) => {\n return Object.keys(POPOVER_PADDING_CLASSES).some((item) => item === padding);\n },\n },\n\n /**\n * Displaces the content box from its anchor element\n * by the specified number of pixels.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n */\n offset: {\n type: Array,\n default: () => [0, 16],\n },\n\n /**\n * The id of the tooltip\n */\n id: {\n type: String,\n default () { return getUniqueString(); },\n },\n\n /**\n * Additional class name for the header content wrapper element.\n */\n headerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the footer content wrapper element.\n */\n footerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the dialog element.\n */\n dialogClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the content wrapper element.\n */\n contentClass: {\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 * The enter delay in milliseconds before the hovercard is shown.\n * @type number\n */\n enterDelay: {\n type: Number,\n default: TOOLTIP_DELAY_MS,\n },\n\n /**\n * The leave delay in milliseconds before the hovercard is hidden.\n * @type number\n */\n leaveDelay: {\n type: Number,\n default: TOOLTIP_DELAY_MS,\n },\n },\n\n emits: [\n /**\n * Emitted when popover is shown or hidden\n *\n * @event opened\n * @type {Boolean | Array}\n */\n 'opened',\n ],\n\n data () {\n return {\n hovercardOpen: this.open,\n inTimer: null,\n outTimer: null,\n };\n },\n\n watch: {\n open: {\n handler: function (open) {\n this.hovercardOpen = open;\n },\n\n immediate: true,\n },\n },\n\n methods: {\n setInTimer () {\n this.inTimer = setTimeout(() => {\n this.hovercardOpen = true;\n }, this.enterDelay);\n },\n\n setOutTimer () {\n this.outTimer = setTimeout(() => {\n this.hovercardOpen = false;\n }, this.leaveDelay);\n },\n\n onMouseEnter () {\n if (this.open === null) {\n clearTimeout(this.outTimer);\n this.setInTimer();\n }\n },\n\n onMouseLeave () {\n if (this.open === null) {\n clearTimeout(this.inTimer);\n this.setOutTimer();\n }\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtPopover","placement","TOOLTIP_DIRECTIONS","padding","POPOVER_PADDING_CLASSES","item","getUniqueString","appendTo","POPOVER_APPEND_TO_VALUES","TOOLTIP_DELAY_MS","open"],"mappings":"oVAiDAA,EAAA,CACA,KAAA,cAEA,WAAA,CACA,UAAAC,EAAA,OACA,EAEA,MAAA,CAOA,KAAA,CACA,KAAA,QACA,QAAA,IACA,EAOA,WAAA,CACA,KAAA,QACA,QAAA,EACA,EAOA,mBAAA,CACA,KAAA,MACA,QAAA,IACA,CAAA,MAAA,CAEA,EAWA,UAAA,CACA,KAAA,OACA,QAAA,YACA,UAAAC,EAAA,CACA,OAAAC,EAAA,mBAAA,SAAAD,CAAA,CACA,CACA,EAMA,QAAA,CACA,KAAA,OACA,QAAA,QACA,UAAAE,GACA,OAAA,KAAAC,yBAAA,EAAA,KAAAC,GAAAA,IAAAF,CAAA,CAEA,EAOA,OAAA,CACA,KAAA,MACA,QAAA,IAAA,CAAA,EAAA,EAAA,CACA,EAKA,GAAA,CACA,KAAA,OACA,SAAA,CAAA,OAAAG,EAAA,gBAAA,CAAA,CACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAOA,SAAA,CACA,KAAA,CAAA,YAAA,MAAA,EACA,QAAA,OACA,UAAAC,GACAC,EAAA,yBAAA,SAAAD,CAAA,GACAA,aAAA,WAEA,EAMA,WAAA,CACA,KAAA,OACA,QAAAE,EAAA,gBACA,EAMA,WAAA,CACA,KAAA,OACA,QAAAA,EAAA,gBACA,CACA,EAEA,MAAA,CAOA,QACA,EAEA,MAAA,CACA,MAAA,CACA,cAAA,KAAA,KACA,QAAA,KACA,SAAA,IACA,CACA,EAEA,MAAA,CACA,KAAA,CACA,QAAA,SAAAC,EAAA,CACA,KAAA,cAAAA,CACA,EAEA,UAAA,EACA,CACA,EAEA,QAAA,CACA,YAAA,CACA,KAAA,QAAA,WAAA,IAAA,CACA,KAAA,cAAA,EACA,EAAA,KAAA,UAAA,CACA,EAEA,aAAA,CACA,KAAA,SAAA,WAAA,IAAA,CACA,KAAA,cAAA,EACA,EAAA,KAAA,UAAA,CACA,EAEA,cAAA,CACA,KAAA,OAAA,OACA,aAAA,KAAA,QAAA,EACA,KAAA,WAAA,EAEA,EAEA,cAAA,CACA,KAAA,OAAA,OACA,aAAA,KAAA,OAAA,EACA,KAAA,YAAA,EAEA,CACA,CACA"}
1
+ {"version":3,"file":"hovercard.cjs","sources":["../../../components/hovercard/hovercard.vue"],"sourcesContent":["<template>\n <dt-popover\n :id=\"id\"\n ref=\"popover\"\n :open=\"hovercardOpen\"\n :placement=\"placement\"\n :content-class=\"contentClass\"\n :dialog-class=\"dialogClass\"\n :fallback-placements=\"fallbackPlacements\"\n :padding=\"padding\"\n :transition=\"transition ? 'fade' : null\"\n :offset=\"offset\"\n :modal=\"false\"\n initial-focus-element=\"none\"\n :header-class=\"headerClass\"\n :footer-class=\"footerClass\"\n :append-to=\"appendTo\"\n data-qa=\"dt-hovercard\"\n :enter-delay=\"enterDelay\"\n :leave-delay=\"leaveDelay\"\n @opened=\"(e) => ($emit('opened', e))\"\n @mouseenter-popover=\"onMouseEnter\"\n @mouseleave-popover=\"onMouseLeave\"\n @mouseenter-popover-anchor=\"onMouseEnter\"\n @mouseleave-popover-anchor=\"onMouseLeave\"\n >\n <template #anchor=\"{ attrs }\">\n <slot\n name=\"anchor\"\n v-bind=\"attrs\"\n />\n </template>\n <template #content>\n <slot name=\"content\" />\n </template>\n <template #headerContent>\n <slot name=\"headerContent\" />\n </template>\n\n <template #footerContent>\n <slot name=\"footerContent\" />\n </template>\n </dt-popover>\n</template>\n\n<script>\nimport { POPOVER_APPEND_TO_VALUES, POPOVER_PADDING_CLASSES, DtPopover } from '@/components/popover/index.js';\nimport { TOOLTIP_DIRECTIONS, TOOLTIP_DELAY_MS } from '@/components/tooltip/index.js';\nimport { getUniqueString } from '@/common/utils';\n\nexport default {\n name: 'DtHovercard',\n\n components: {\n DtPopover,\n },\n\n props: {\n /**\n * Controls whether the hovercard is shown. Leaving this null will have the hovercard trigger on hover 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 .sync modifier\n * @values null, true, false\n */\n open: {\n type: Boolean,\n default: null,\n },\n\n /**\n * Fade transition when the content display is toggled.\n * @type boolean\n * @values true, false\n */\n transition: {\n type: Boolean,\n default: false,\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 * @see https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n */\n fallbackPlacements: {\n type: Array,\n default: () => {\n return ['auto'];\n },\n },\n\n /**\n * The direction the popover displays relative to the anchor.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\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-start',\n validator (placement) {\n return TOOLTIP_DIRECTIONS.includes(placement);\n },\n },\n\n /**\n * Padding size class for the popover content.\n * @values none, small, medium, large\n */\n padding: {\n type: String,\n default: 'large',\n validator: (padding) => {\n return Object.keys(POPOVER_PADDING_CLASSES).some((item) => item === padding);\n },\n },\n\n /**\n * Displaces the content box from its anchor element\n * by the specified number of pixels.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n */\n offset: {\n type: Array,\n default: () => [0, 16],\n },\n\n /**\n * The id of the tooltip\n */\n id: {\n type: String,\n default () { return getUniqueString(); },\n },\n\n /**\n * Additional class name for the header content wrapper element.\n */\n headerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the footer content wrapper element.\n */\n footerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the dialog element.\n */\n dialogClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the content wrapper element.\n */\n contentClass: {\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 * The enter delay in milliseconds before the hovercard is shown.\n * @type number\n */\n enterDelay: {\n type: Number,\n default: TOOLTIP_DELAY_MS,\n },\n\n /**\n * The leave delay in milliseconds before the hovercard is hidden.\n * @type number\n */\n leaveDelay: {\n type: Number,\n default: TOOLTIP_DELAY_MS,\n },\n },\n\n emits: [\n /**\n * Emitted when popover is shown or hidden\n *\n * @event opened\n * @type {Boolean | Array}\n */\n 'opened',\n ],\n\n data () {\n return {\n hovercardOpen: this.open,\n anchorEl: null,\n observer: null,\n inTimer: null,\n outTimer: null,\n };\n },\n\n watch: {\n open: {\n handler: function (open) {\n this.hovercardOpen = open;\n },\n\n immediate: true,\n },\n },\n\n mounted () {\n this.$nextTick(() => {\n this.anchorEl = this.$refs.popover?.$refs?.anchor?.firstElementChild;\n\n this.observer = new MutationObserver(() => {\n if (this.anchorEl && !this.anchorEl.isConnected) {\n // If the anchor element is removed from the DOM, close the hovercard\n this.hovercardOpen = false;\n }\n });\n\n this.observer.observe(document.body, {\n childList: true,\n subtree: true,\n });\n });\n },\n\n beforeDestroy () {\n if (this.observer) {\n this.observer.disconnect();\n }\n\n clearTimeout(this.inTimer);\n clearTimeout(this.outTimer);\n },\n\n methods: {\n setInTimer () {\n this.inTimer = setTimeout(() => {\n this.hovercardOpen = true;\n }, this.enterDelay);\n },\n\n setOutTimer () {\n this.outTimer = setTimeout(() => {\n this.hovercardOpen = false;\n }, this.leaveDelay);\n },\n\n onMouseEnter () {\n if (this.open === null) {\n clearTimeout(this.outTimer);\n this.setInTimer();\n }\n },\n\n onMouseLeave () {\n if (this.open === null) {\n clearTimeout(this.inTimer);\n this.setOutTimer();\n }\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtPopover","placement","TOOLTIP_DIRECTIONS","padding","POPOVER_PADDING_CLASSES","item","getUniqueString","appendTo","POPOVER_APPEND_TO_VALUES","TOOLTIP_DELAY_MS","open","_c","_b","_a"],"mappings":"oVAkDAA,EAAA,CACA,KAAA,cAEA,WAAA,CACA,UAAAC,EAAA,OACA,EAEA,MAAA,CAOA,KAAA,CACA,KAAA,QACA,QAAA,IACA,EAOA,WAAA,CACA,KAAA,QACA,QAAA,EACA,EAOA,mBAAA,CACA,KAAA,MACA,QAAA,IACA,CAAA,MAAA,CAEA,EAWA,UAAA,CACA,KAAA,OACA,QAAA,YACA,UAAAC,EAAA,CACA,OAAAC,EAAA,mBAAA,SAAAD,CAAA,CACA,CACA,EAMA,QAAA,CACA,KAAA,OACA,QAAA,QACA,UAAAE,GACA,OAAA,KAAAC,yBAAA,EAAA,KAAAC,GAAAA,IAAAF,CAAA,CAEA,EAOA,OAAA,CACA,KAAA,MACA,QAAA,IAAA,CAAA,EAAA,EAAA,CACA,EAKA,GAAA,CACA,KAAA,OACA,SAAA,CAAA,OAAAG,EAAA,gBAAA,CAAA,CACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,YAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAKA,aAAA,CACA,KAAA,CAAA,OAAA,MAAA,MAAA,EACA,QAAA,EACA,EAOA,SAAA,CACA,KAAA,CAAA,YAAA,MAAA,EACA,QAAA,OACA,UAAAC,GACAC,EAAA,yBAAA,SAAAD,CAAA,GACAA,aAAA,WAEA,EAMA,WAAA,CACA,KAAA,OACA,QAAAE,EAAA,gBACA,EAMA,WAAA,CACA,KAAA,OACA,QAAAA,EAAA,gBACA,CACA,EAEA,MAAA,CAOA,QACA,EAEA,MAAA,CACA,MAAA,CACA,cAAA,KAAA,KACA,SAAA,KACA,SAAA,KACA,QAAA,KACA,SAAA,IACA,CACA,EAEA,MAAA,CACA,KAAA,CACA,QAAA,SAAAC,EAAA,CACA,KAAA,cAAAA,CACA,EAEA,UAAA,EACA,CACA,EAEA,SAAA,CACA,KAAA,UAAA,IAAA,WACA,KAAA,UAAAC,GAAAC,GAAAC,EAAA,KAAA,MAAA,UAAA,YAAAA,EAAA,QAAA,YAAAD,EAAA,SAAA,YAAAD,EAAA,kBAEA,KAAA,SAAA,IAAA,iBAAA,IAAA,CACA,KAAA,UAAA,CAAA,KAAA,SAAA,cAEA,KAAA,cAAA,GAEA,CAAA,EAEA,KAAA,SAAA,QAAA,SAAA,KAAA,CACA,UAAA,GACA,QAAA,EACA,CAAA,CACA,CAAA,CACA,EAEA,eAAA,CACA,KAAA,UACA,KAAA,SAAA,aAGA,aAAA,KAAA,OAAA,EACA,aAAA,KAAA,QAAA,CACA,EAEA,QAAA,CACA,YAAA,CACA,KAAA,QAAA,WAAA,IAAA,CACA,KAAA,cAAA,EACA,EAAA,KAAA,UAAA,CACA,EAEA,aAAA,CACA,KAAA,SAAA,WAAA,IAAA,CACA,KAAA,cAAA,EACA,EAAA,KAAA,UAAA,CACA,EAEA,cAAA,CACA,KAAA,OAAA,OACA,aAAA,KAAA,QAAA,EACA,KAAA,WAAA,EAEA,EAEA,cAAA,CACA,KAAA,OAAA,OACA,aAAA,KAAA,OAAA,EACA,KAAA,YAAA,EAEA,CACA,CACA"}
@@ -1,12 +1,12 @@
1
1
  import { getUniqueString as a } from "../../common/utils/index.js";
2
- import { n as l } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
3
- import s from "../popover/popover.js";
4
- import { TOOLTIP_DIRECTIONS as i, TOOLTIP_DELAY_MS as r } from "../tooltip/tooltip-constants.js";
5
- import { POPOVER_PADDING_CLASSES as u, POPOVER_APPEND_TO_VALUES as p } from "../popover/popover-constants.js";
6
- const d = {
2
+ import { n as s } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
3
+ import i from "../popover/popover.js";
4
+ import { TOOLTIP_DIRECTIONS as l, TOOLTIP_DELAY_MS as o } from "../tooltip/tooltip-constants.js";
5
+ import { POPOVER_PADDING_CLASSES as u, POPOVER_APPEND_TO_VALUES as d } from "../popover/popover-constants.js";
6
+ const c = {
7
7
  name: "DtHovercard",
8
8
  components: {
9
- DtPopover: s
9
+ DtPopover: i
10
10
  },
11
11
  props: {
12
12
  /**
@@ -50,7 +50,7 @@ const d = {
50
50
  type: String,
51
51
  default: "top-start",
52
52
  validator(t) {
53
- return i.includes(t);
53
+ return l.includes(t);
54
54
  }
55
55
  },
56
56
  /**
@@ -116,7 +116,7 @@ const d = {
116
116
  appendTo: {
117
117
  type: [HTMLElement, String],
118
118
  default: "body",
119
- validator: (t) => p.includes(t) || t instanceof HTMLElement
119
+ validator: (t) => d.includes(t) || t instanceof HTMLElement
120
120
  },
121
121
  /**
122
122
  * The enter delay in milliseconds before the hovercard is shown.
@@ -124,7 +124,7 @@ const d = {
124
124
  */
125
125
  enterDelay: {
126
126
  type: Number,
127
- default: r
127
+ default: o
128
128
  },
129
129
  /**
130
130
  * The leave delay in milliseconds before the hovercard is hidden.
@@ -132,7 +132,7 @@ const d = {
132
132
  */
133
133
  leaveDelay: {
134
134
  type: Number,
135
- default: r
135
+ default: o
136
136
  }
137
137
  },
138
138
  emits: [
@@ -147,6 +147,8 @@ const d = {
147
147
  data() {
148
148
  return {
149
149
  hovercardOpen: this.open,
150
+ anchorEl: null,
151
+ observer: null,
150
152
  inTimer: null,
151
153
  outTimer: null
152
154
  };
@@ -159,6 +161,20 @@ const d = {
159
161
  immediate: !0
160
162
  }
161
163
  },
164
+ mounted() {
165
+ this.$nextTick(() => {
166
+ var t, e, r;
167
+ this.anchorEl = (r = (e = (t = this.$refs.popover) == null ? void 0 : t.$refs) == null ? void 0 : e.anchor) == null ? void 0 : r.firstElementChild, this.observer = new MutationObserver(() => {
168
+ this.anchorEl && !this.anchorEl.isConnected && (this.hovercardOpen = !1);
169
+ }), this.observer.observe(document.body, {
170
+ childList: !0,
171
+ subtree: !0
172
+ });
173
+ });
174
+ },
175
+ beforeDestroy() {
176
+ this.observer && this.observer.disconnect(), clearTimeout(this.inTimer), clearTimeout(this.outTimer);
177
+ },
162
178
  methods: {
163
179
  setInTimer() {
164
180
  this.inTimer = setTimeout(() => {
@@ -178,9 +194,9 @@ const d = {
178
194
  }
179
195
  }
180
196
  };
181
- var c = function() {
182
- var e = this, o = e._self._c;
183
- return o("dt-popover", { attrs: { id: e.id, open: e.hovercardOpen, placement: e.placement, "content-class": e.contentClass, "dialog-class": e.dialogClass, "fallback-placements": e.fallbackPlacements, padding: e.padding, transition: e.transition ? "fade" : null, offset: e.offset, modal: !1, "initial-focus-element": "none", "header-class": e.headerClass, "footer-class": e.footerClass, "append-to": e.appendTo, "data-qa": "dt-hovercard", "enter-delay": e.enterDelay, "leave-delay": e.leaveDelay }, on: { opened: (n) => e.$emit("opened", n), "mouseenter-popover": e.onMouseEnter, "mouseleave-popover": e.onMouseLeave, "mouseenter-popover-anchor": e.onMouseEnter, "mouseleave-popover-anchor": e.onMouseLeave }, scopedSlots: e._u([{ key: "anchor", fn: function({ attrs: n }) {
197
+ var p = function() {
198
+ var e = this, r = e._self._c;
199
+ return r("dt-popover", { ref: "popover", attrs: { id: e.id, open: e.hovercardOpen, placement: e.placement, "content-class": e.contentClass, "dialog-class": e.dialogClass, "fallback-placements": e.fallbackPlacements, padding: e.padding, transition: e.transition ? "fade" : null, offset: e.offset, modal: !1, "initial-focus-element": "none", "header-class": e.headerClass, "footer-class": e.footerClass, "append-to": e.appendTo, "data-qa": "dt-hovercard", "enter-delay": e.enterDelay, "leave-delay": e.leaveDelay }, on: { opened: (n) => e.$emit("opened", n), "mouseenter-popover": e.onMouseEnter, "mouseleave-popover": e.onMouseLeave, "mouseenter-popover-anchor": e.onMouseEnter, "mouseleave-popover-anchor": e.onMouseLeave }, scopedSlots: e._u([{ key: "anchor", fn: function({ attrs: n }) {
184
200
  return [e._t("anchor", null, null, n)];
185
201
  } }, { key: "content", fn: function() {
186
202
  return [e._t("content")];
@@ -189,9 +205,9 @@ var c = function() {
189
205
  }, proxy: !0 }, { key: "footerContent", fn: function() {
190
206
  return [e._t("footerContent")];
191
207
  }, proxy: !0 }], null, !0) });
192
- }, f = [], m = /* @__PURE__ */ l(
193
- d,
208
+ }, f = [], m = /* @__PURE__ */ s(
194
209
  c,
210
+ p,
195
211
  f
196
212
  );
197
213
  const O = m.exports;
@@ -1 +1 @@
1
- {"version":3,"file":"hovercard.js","sources":["../../../components/hovercard/hovercard.vue"],"sourcesContent":["<template>\n <dt-popover\n :id=\"id\"\n :open=\"hovercardOpen\"\n :placement=\"placement\"\n :content-class=\"contentClass\"\n :dialog-class=\"dialogClass\"\n :fallback-placements=\"fallbackPlacements\"\n :padding=\"padding\"\n :transition=\"transition ? 'fade' : null\"\n :offset=\"offset\"\n :modal=\"false\"\n initial-focus-element=\"none\"\n :header-class=\"headerClass\"\n :footer-class=\"footerClass\"\n :append-to=\"appendTo\"\n data-qa=\"dt-hovercard\"\n :enter-delay=\"enterDelay\"\n :leave-delay=\"leaveDelay\"\n @opened=\"(e) => ($emit('opened', e))\"\n @mouseenter-popover=\"onMouseEnter\"\n @mouseleave-popover=\"onMouseLeave\"\n @mouseenter-popover-anchor=\"onMouseEnter\"\n @mouseleave-popover-anchor=\"onMouseLeave\"\n >\n <template #anchor=\"{ attrs }\">\n <slot\n name=\"anchor\"\n v-bind=\"attrs\"\n />\n </template>\n <template #content>\n <slot name=\"content\" />\n </template>\n <template #headerContent>\n <slot name=\"headerContent\" />\n </template>\n\n <template #footerContent>\n <slot name=\"footerContent\" />\n </template>\n </dt-popover>\n</template>\n\n<script>\nimport { POPOVER_APPEND_TO_VALUES, POPOVER_PADDING_CLASSES, DtPopover } from '@/components/popover/index.js';\nimport { TOOLTIP_DIRECTIONS, TOOLTIP_DELAY_MS } from '@/components/tooltip/index.js';\nimport { getUniqueString } from '@/common/utils';\n\nexport default {\n name: 'DtHovercard',\n\n components: {\n DtPopover,\n },\n\n props: {\n /**\n * Controls whether the hovercard is shown. Leaving this null will have the hovercard trigger on hover 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 .sync modifier\n * @values null, true, false\n */\n open: {\n type: Boolean,\n default: null,\n },\n\n /**\n * Fade transition when the content display is toggled.\n * @type boolean\n * @values true, false\n */\n transition: {\n type: Boolean,\n default: false,\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 * @see https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n */\n fallbackPlacements: {\n type: Array,\n default: () => {\n return ['auto'];\n },\n },\n\n /**\n * The direction the popover displays relative to the anchor.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\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-start',\n validator (placement) {\n return TOOLTIP_DIRECTIONS.includes(placement);\n },\n },\n\n /**\n * Padding size class for the popover content.\n * @values none, small, medium, large\n */\n padding: {\n type: String,\n default: 'large',\n validator: (padding) => {\n return Object.keys(POPOVER_PADDING_CLASSES).some((item) => item === padding);\n },\n },\n\n /**\n * Displaces the content box from its anchor element\n * by the specified number of pixels.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n */\n offset: {\n type: Array,\n default: () => [0, 16],\n },\n\n /**\n * The id of the tooltip\n */\n id: {\n type: String,\n default () { return getUniqueString(); },\n },\n\n /**\n * Additional class name for the header content wrapper element.\n */\n headerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the footer content wrapper element.\n */\n footerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the dialog element.\n */\n dialogClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the content wrapper element.\n */\n contentClass: {\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 * The enter delay in milliseconds before the hovercard is shown.\n * @type number\n */\n enterDelay: {\n type: Number,\n default: TOOLTIP_DELAY_MS,\n },\n\n /**\n * The leave delay in milliseconds before the hovercard is hidden.\n * @type number\n */\n leaveDelay: {\n type: Number,\n default: TOOLTIP_DELAY_MS,\n },\n },\n\n emits: [\n /**\n * Emitted when popover is shown or hidden\n *\n * @event opened\n * @type {Boolean | Array}\n */\n 'opened',\n ],\n\n data () {\n return {\n hovercardOpen: this.open,\n inTimer: null,\n outTimer: null,\n };\n },\n\n watch: {\n open: {\n handler: function (open) {\n this.hovercardOpen = open;\n },\n\n immediate: true,\n },\n },\n\n methods: {\n setInTimer () {\n this.inTimer = setTimeout(() => {\n this.hovercardOpen = true;\n }, this.enterDelay);\n },\n\n setOutTimer () {\n this.outTimer = setTimeout(() => {\n this.hovercardOpen = false;\n }, this.leaveDelay);\n },\n\n onMouseEnter () {\n if (this.open === null) {\n clearTimeout(this.outTimer);\n this.setInTimer();\n }\n },\n\n onMouseLeave () {\n if (this.open === null) {\n clearTimeout(this.inTimer);\n this.setOutTimer();\n }\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtPopover","placement","TOOLTIP_DIRECTIONS","padding","POPOVER_PADDING_CLASSES","item","getUniqueString","appendTo","POPOVER_APPEND_TO_VALUES","TOOLTIP_DELAY_MS","open"],"mappings":"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"}
1
+ {"version":3,"file":"hovercard.js","sources":["../../../components/hovercard/hovercard.vue"],"sourcesContent":["<template>\n <dt-popover\n :id=\"id\"\n ref=\"popover\"\n :open=\"hovercardOpen\"\n :placement=\"placement\"\n :content-class=\"contentClass\"\n :dialog-class=\"dialogClass\"\n :fallback-placements=\"fallbackPlacements\"\n :padding=\"padding\"\n :transition=\"transition ? 'fade' : null\"\n :offset=\"offset\"\n :modal=\"false\"\n initial-focus-element=\"none\"\n :header-class=\"headerClass\"\n :footer-class=\"footerClass\"\n :append-to=\"appendTo\"\n data-qa=\"dt-hovercard\"\n :enter-delay=\"enterDelay\"\n :leave-delay=\"leaveDelay\"\n @opened=\"(e) => ($emit('opened', e))\"\n @mouseenter-popover=\"onMouseEnter\"\n @mouseleave-popover=\"onMouseLeave\"\n @mouseenter-popover-anchor=\"onMouseEnter\"\n @mouseleave-popover-anchor=\"onMouseLeave\"\n >\n <template #anchor=\"{ attrs }\">\n <slot\n name=\"anchor\"\n v-bind=\"attrs\"\n />\n </template>\n <template #content>\n <slot name=\"content\" />\n </template>\n <template #headerContent>\n <slot name=\"headerContent\" />\n </template>\n\n <template #footerContent>\n <slot name=\"footerContent\" />\n </template>\n </dt-popover>\n</template>\n\n<script>\nimport { POPOVER_APPEND_TO_VALUES, POPOVER_PADDING_CLASSES, DtPopover } from '@/components/popover/index.js';\nimport { TOOLTIP_DIRECTIONS, TOOLTIP_DELAY_MS } from '@/components/tooltip/index.js';\nimport { getUniqueString } from '@/common/utils';\n\nexport default {\n name: 'DtHovercard',\n\n components: {\n DtPopover,\n },\n\n props: {\n /**\n * Controls whether the hovercard is shown. Leaving this null will have the hovercard trigger on hover 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 .sync modifier\n * @values null, true, false\n */\n open: {\n type: Boolean,\n default: null,\n },\n\n /**\n * Fade transition when the content display is toggled.\n * @type boolean\n * @values true, false\n */\n transition: {\n type: Boolean,\n default: false,\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 * @see https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n */\n fallbackPlacements: {\n type: Array,\n default: () => {\n return ['auto'];\n },\n },\n\n /**\n * The direction the popover displays relative to the anchor.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\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-start',\n validator (placement) {\n return TOOLTIP_DIRECTIONS.includes(placement);\n },\n },\n\n /**\n * Padding size class for the popover content.\n * @values none, small, medium, large\n */\n padding: {\n type: String,\n default: 'large',\n validator: (padding) => {\n return Object.keys(POPOVER_PADDING_CLASSES).some((item) => item === padding);\n },\n },\n\n /**\n * Displaces the content box from its anchor element\n * by the specified number of pixels.\n * @see https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n */\n offset: {\n type: Array,\n default: () => [0, 16],\n },\n\n /**\n * The id of the tooltip\n */\n id: {\n type: String,\n default () { return getUniqueString(); },\n },\n\n /**\n * Additional class name for the header content wrapper element.\n */\n headerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the footer content wrapper element.\n */\n footerClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the dialog element.\n */\n dialogClass: {\n type: [String, Array, Object],\n default: '',\n },\n\n /**\n * Additional class name for the content wrapper element.\n */\n contentClass: {\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 * The enter delay in milliseconds before the hovercard is shown.\n * @type number\n */\n enterDelay: {\n type: Number,\n default: TOOLTIP_DELAY_MS,\n },\n\n /**\n * The leave delay in milliseconds before the hovercard is hidden.\n * @type number\n */\n leaveDelay: {\n type: Number,\n default: TOOLTIP_DELAY_MS,\n },\n },\n\n emits: [\n /**\n * Emitted when popover is shown or hidden\n *\n * @event opened\n * @type {Boolean | Array}\n */\n 'opened',\n ],\n\n data () {\n return {\n hovercardOpen: this.open,\n anchorEl: null,\n observer: null,\n inTimer: null,\n outTimer: null,\n };\n },\n\n watch: {\n open: {\n handler: function (open) {\n this.hovercardOpen = open;\n },\n\n immediate: true,\n },\n },\n\n mounted () {\n this.$nextTick(() => {\n this.anchorEl = this.$refs.popover?.$refs?.anchor?.firstElementChild;\n\n this.observer = new MutationObserver(() => {\n if (this.anchorEl && !this.anchorEl.isConnected) {\n // If the anchor element is removed from the DOM, close the hovercard\n this.hovercardOpen = false;\n }\n });\n\n this.observer.observe(document.body, {\n childList: true,\n subtree: true,\n });\n });\n },\n\n beforeDestroy () {\n if (this.observer) {\n this.observer.disconnect();\n }\n\n clearTimeout(this.inTimer);\n clearTimeout(this.outTimer);\n },\n\n methods: {\n setInTimer () {\n this.inTimer = setTimeout(() => {\n this.hovercardOpen = true;\n }, this.enterDelay);\n },\n\n setOutTimer () {\n this.outTimer = setTimeout(() => {\n this.hovercardOpen = false;\n }, this.leaveDelay);\n },\n\n onMouseEnter () {\n if (this.open === null) {\n clearTimeout(this.outTimer);\n this.setInTimer();\n }\n },\n\n onMouseLeave () {\n if (this.open === null) {\n clearTimeout(this.inTimer);\n this.setOutTimer();\n }\n },\n },\n};\n</script>\n"],"names":["_sfc_main","DtPopover","placement","TOOLTIP_DIRECTIONS","padding","POPOVER_PADDING_CLASSES","item","getUniqueString","appendTo","POPOVER_APPEND_TO_VALUES","TOOLTIP_DELAY_MS","open","_c","_b","_a"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"hovercard.vue.d.ts","sourceRoot":"","sources":["../../../../components/hovercard/hovercard.vue"],"names":[],"mappings":"AA2CA;"}
1
+ {"version":3,"file":"hovercard.vue.d.ts","sourceRoot":"","sources":["../../../../components/hovercard/hovercard.vue"],"names":[],"mappings":"AA4CA;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dialpad/dialtone-vue",
3
- "version": "2.189.4",
3
+ "version": "2.189.5",
4
4
  "description": "Vue component library for Dialpad's design system Dialtone",
5
5
  "files": [
6
6
  "dist"
@@ -44,7 +44,7 @@
44
44
  "regex-combined-emojis": "1.6.0",
45
45
  "tippy.js": "6.3.7",
46
46
  "@dialpad/dialtone-emojis": "1.1.2",
47
- "@dialpad/dialtone-icons": "4.38.1"
47
+ "@dialpad/dialtone-icons": "4.39.0"
48
48
  },
49
49
  "devDependencies": {
50
50
  "@dialpad/i18n-services": "1.2.0-beta.v6",
@@ -58,12 +58,12 @@
58
58
  "react": "17.0.2",
59
59
  "storybook-dark-mode": "^3.0.3",
60
60
  "vue": "^2.7.15",
61
- "@dialpad/dialtone-css": "8.57.1",
61
+ "@dialpad/dialtone-css": "8.57.2",
62
62
  "@dialpad/generator-dialtone": "0.1.0"
63
63
  },
64
64
  "peerDependencies": {
65
65
  "vue": ">=2.6",
66
- "@dialpad/dialtone-css": "^8.57.1"
66
+ "@dialpad/dialtone-css": "^8.57.2"
67
67
  },
68
68
  "bugs": {
69
69
  "email": "dialtone@dialpad.com"