npm - @dialpad/dialtone-vue - Versions diffs - 3.222.0-next.2 → 3.222.0 - Mend

@dialpad/dialtone-vue 3.222.0-next.2 → 3.222.0

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.

Files changed (2055) hide show

package/dist/lib/presence/presence.js CHANGED Viewed

@@ -1,2 +1,41 @@
-import { t as e } from "../../Presence-CGgyodnC.js";
-export { e as default };
+import { t as e } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
+import { PRESENCE_STATES as t, PRESENCE_STATES_LIST as n } from "./presence-constants.js";
+import { createCommentVNode as r, createElementBlock as i, createElementVNode as a, normalizeClass as o, openBlock as s, toDisplayString as c } from "vue";
+//#region components/presence/presence.vue
+var l = {
+	compatConfig: { MODE: 3 },
+	name: "DtPresence",
+	props: {
+		presence: {
+			type: String,
+			default: t.ACTIVE,
+			validator: (e) => n.includes(e)
+		},
+		srText: {
+			type: String,
+			default: null
+		}
+	}
+}, u = ["aria-live"], d = {
+	key: 0,
+	"data-qa": "dt-presence-sr-text",
+	class: "sr-only"
+};
+function f(e, t, n, l, f, p) {
+	return s(), i("div", {
+		class: "d-presence",
+		"data-qa": "dt-presence",
+		role: "status",
+		"aria-live": e.$attrs.ariaLive || "off"
+	}, [n.srText ? (s(), i("span", d, c(n.srText), 1)) : r("", !0), a("div", { class: o(["d-presence__inner", {
+		"d-presence__inner--active": n.presence === "active",
+		"d-presence__inner--away": n.presence === "away",
+		"d-presence__inner--busy": n.presence === "busy",
+		"d-presence__inner--offline": n.presence === "offline"
+	}]) }, null, 2)], 8, u);
+}
+var p = /* @__PURE__ */ e(l, [["render", f]]);
+//#endregion
+export { p as default };
+//# sourceMappingURL=presence.js.map

package/dist/lib/presence/presence.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"presence.js","names":[],"sources":["../../../components/presence/presence.vue"],"sourcesContent":["<template>\n <div\n class=\"d-presence\"\n data-qa=\"dt-presence\"\n role=\"status\"\n :aria-live=\"$attrs.ariaLive || 'off'\"\n >\n <span\n v-if=\"srText\"\n data-qa=\"dt-presence-sr-text\"\n class=\"sr-only\"\n >{{ srText }} </span>\n <div\n class=\"d-presence__inner\"\n :class=\"{\n 'd-presence__inner--active': presence === 'active',\n 'd-presence__inner--away': presence === 'away',\n 'd-presence__inner--busy': presence === 'busy',\n 'd-presence__inner--offline': presence === 'offline',\n }\"\n />\n </div>\n</template>\n\n<script>\nimport { PRESENCE_STATES, PRESENCE_STATES_LIST } from './presence_constants';\n/**\n * Presence is a user status visual indicator element.\n * @see https://dialtone.dialpad.com/components/presence.html\n */\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtPresence',\n props: {\n\n /**\n * Determines the color of the inner presence circle, indicating status.\n * Accepts one of 4 values: 'busy', 'away', 'active', 'offline'\n * @values busy, away, active, offline\n */\n presence: {\n type: String,\n default: PRESENCE_STATES.ACTIVE,\n validator: (role) => {\n return PRESENCE_STATES_LIST.includes(role);\n },\n },\n\n /**\n * Since Presence is a visual element, we need SRs to read out any state changes\n * that occur.\n * Text entered here will be read by assistive technology. If null this component will be ignored by AT.\n */\n srText: {\n type: String,\n default: null,\n },\n },\n};\n</script>\n"],"mappings":";;;;AA8BA,IAAK,IAAU;CACb,cAAc,EAAE,MAAM,GAAG;CACzB,MAAM;CACN,OAAO;EAOL,UAAU;GACR,MAAM;GACN,SAAS,EAAgB;GACzB,YAAY,MACH,EAAqB,SAAS,EAAK;GAE7C;EAOD,QAAQ;GACN,MAAM;GACN,SAAS;GACV;EACF;CACF;;CAjDK,WAAQ;CACR,OAAM;;;aATV,EAoBM,OAAA;EAnBJ,OAAM;EACN,WAAQ;EACR,MAAK;EACJ,aAAW,EAAA,OAAO,YAAQ;KAGnB,EAAA,UAAA,GAAA,EADR,EAIqB,QAJrB,GAIqB,EAAjB,EAAA,OAAM,EAAA,EAAA,IAAA,EAAA,IAAA,GAAA,EACV,EAQE,OAAA,EAPA,OAAK,EAAA,CAAC,qBAAmB;+BACsB,EAAA,aAAQ;6BAAkD,EAAA,aAAQ;6BAAgD,EAAA,aAAQ;gCAAmD,EAAA,aAAQ"}

package/dist/lib/progress-circle/progress-circle-constants.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"progress-circle-constants.cjs","names":[],"sources":["../../../components/~~ProgressCircle~~/~~ProgressCircleConstants~~.js"],"sourcesContent":["/*\n @values 100, 200, 300, 400, 500, 600, 700, 800\n /\nexport const PROGRESS_CIRCLE_SIZES = {\n 100: 'd-progress-circle--size-100',\n 200: 'd-progress-circle--size-200',\n 300: 'd-progress-circle--size-300',\n 400: 'd-progress-circle--size-400',\n 500: 'd-progress-circle--size-500',\n 600: 'd-progress-circle--size-600',\n 700: 'd-progress-circle--size-700',\n 800: 'd-progress-circle--size-800',\n};\n\nexport const PROGRESS_CIRCLE_SIZE_DEFAULT = '500';\n\n/\n @values default, brand, critical, positive, warning, info, ai\n */\nexport const PROGRESS_CIRCLE_KINDS = {\n default: '',\n brand: 'd-progress-circle--brand',\n critical: 'd-progress-circle--critical',\n positive: 'd-progress-circle--positive',\n warning: 'd-progress-circle--warning',\n info: 'd-progress-circle--info',\n ai: 'd-progress-circle--ai',\n};\n\nexport const PROGRESS_CIRCLE_KIND_DEFAULT = 'default';\n"],"mappings":"mEAGA,IAAa,EAAwB,CACnC,IAAK,8BACL,IAAK,8BACL,IAAK,8BACL,IAAK,8BACL,IAAK,8BACL,IAAK,8BACL,IAAK,8BACL,IAAK,8BACN,CAEY,EAA+B,MAK/B,EAAwB,CACnC,QAAS,GACT,MAAO,2BACP,SAAU,8BACV,SAAU,8BACV,QAAS,6BACT,KAAM,0BACN,GAAI,wBACL,CAEY,EAA+B"}
1	+ {"version":3,"file":"progress-circle-constants.cjs","names":[],"sources":["../../../components/progress_circle/progress_circle_constants.js"],"sourcesContent":["/*\n @values 100, 200, 300, 400, 500, 600, 700, 800\n /\nexport const PROGRESS_CIRCLE_SIZES = {\n 100: 'd-progress-circle--size-100',\n 200: 'd-progress-circle--size-200',\n 300: 'd-progress-circle--size-300',\n 400: 'd-progress-circle--size-400',\n 500: 'd-progress-circle--size-500',\n 600: 'd-progress-circle--size-600',\n 700: 'd-progress-circle--size-700',\n 800: 'd-progress-circle--size-800',\n};\n\nexport const PROGRESS_CIRCLE_SIZE_DEFAULT = '500';\n\n/\n @values default, brand, critical, positive, warning, info, ai\n */\nexport const PROGRESS_CIRCLE_KINDS = {\n default: '',\n brand: 'd-progress-circle--brand',\n critical: 'd-progress-circle--critical',\n positive: 'd-progress-circle--positive',\n warning: 'd-progress-circle--warning',\n info: 'd-progress-circle--info',\n ai: 'd-progress-circle--ai',\n};\n\nexport const PROGRESS_CIRCLE_KIND_DEFAULT = 'default';\n"],"mappings":"mEAGA,IAAa,EAAwB,CACnC,IAAK,8BACL,IAAK,8BACL,IAAK,8BACL,IAAK,8BACL,IAAK,8BACL,IAAK,8BACL,IAAK,8BACL,IAAK,8BACN,CAEY,EAA+B,MAK/B,EAAwB,CACnC,QAAS,GACT,MAAO,2BACP,SAAU,8BACV,SAAU,8BACV,QAAS,6BACT,KAAM,0BACN,GAAI,wBACL,CAEY,EAA+B"}

package/dist/lib/progress-circle/progress-circle-constants.js CHANGED Viewed

@@ -1,4 +1,4 @@
-//#region components/ProgressCircle/ProgressCircleConstants.js
+//#region components/progress_circle/progress_circle_constants.js
 var e = {
 	100: "d-progress-circle--size-100",
 	200: "d-progress-circle--size-200",

package/dist/lib/progress-circle/progress-circle-constants.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"progress-circle-constants.js","names":[],"sources":["../../../components/~~ProgressCircle~~/~~ProgressCircleConstants~~.js"],"sourcesContent":["/*\n @values 100, 200, 300, 400, 500, 600, 700, 800\n /\nexport const PROGRESS_CIRCLE_SIZES = {\n 100: 'd-progress-circle--size-100',\n 200: 'd-progress-circle--size-200',\n 300: 'd-progress-circle--size-300',\n 400: 'd-progress-circle--size-400',\n 500: 'd-progress-circle--size-500',\n 600: 'd-progress-circle--size-600',\n 700: 'd-progress-circle--size-700',\n 800: 'd-progress-circle--size-800',\n};\n\nexport const PROGRESS_CIRCLE_SIZE_DEFAULT = '500';\n\n/\n @values default, brand, critical, positive, warning, info, ai\n */\nexport const PROGRESS_CIRCLE_KINDS = {\n default: '',\n brand: 'd-progress-circle--brand',\n critical: 'd-progress-circle--critical',\n positive: 'd-progress-circle--positive',\n warning: 'd-progress-circle--warning',\n info: 'd-progress-circle--info',\n ai: 'd-progress-circle--ai',\n};\n\nexport const PROGRESS_CIRCLE_KIND_DEFAULT = 'default';\n"],"mappings":";AAGA,IAAa,IAAwB;CACnC,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACN,EAEY,IAA+B,OAK/B,IAAwB;CACnC,SAAS;CACT,OAAO;CACP,UAAU;CACV,UAAU;CACV,SAAS;CACT,MAAM;CACN,IAAI;CACL,EAEY,IAA+B"}
1	+ {"version":3,"file":"progress-circle-constants.js","names":[],"sources":["../../../components/progress_circle/progress_circle_constants.js"],"sourcesContent":["/*\n @values 100, 200, 300, 400, 500, 600, 700, 800\n /\nexport const PROGRESS_CIRCLE_SIZES = {\n 100: 'd-progress-circle--size-100',\n 200: 'd-progress-circle--size-200',\n 300: 'd-progress-circle--size-300',\n 400: 'd-progress-circle--size-400',\n 500: 'd-progress-circle--size-500',\n 600: 'd-progress-circle--size-600',\n 700: 'd-progress-circle--size-700',\n 800: 'd-progress-circle--size-800',\n};\n\nexport const PROGRESS_CIRCLE_SIZE_DEFAULT = '500';\n\n/\n @values default, brand, critical, positive, warning, info, ai\n */\nexport const PROGRESS_CIRCLE_KINDS = {\n default: '',\n brand: 'd-progress-circle--brand',\n critical: 'd-progress-circle--critical',\n positive: 'd-progress-circle--positive',\n warning: 'd-progress-circle--warning',\n info: 'd-progress-circle--info',\n ai: 'd-progress-circle--ai',\n};\n\nexport const PROGRESS_CIRCLE_KIND_DEFAULT = 'default';\n"],"mappings":";AAGA,IAAa,IAAwB;CACnC,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACL,KAAK;CACN,EAEY,IAA+B,OAK/B,IAAwB;CACnC,SAAS;CACT,OAAO;CACP,UAAU;CACV,UAAU;CACV,SAAS;CACT,MAAM;CACN,IAAI;CACL,EAEY,IAA+B"}

package/dist/lib/progress-circle/progress-circle.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`),t=require(`./progress-circle-constants.cjs`);let n=require(`vue`);var r={name:`DtProgressCircle`,props:{ariaLabel:{type:String,required:!0},progress:{type:Number,default:0,validator:e=>e>=0&&e<=100},size:{type:String,default:`500`,validator:e=>Object.keys(t.PROGRESS_CIRCLE_SIZES).includes(e)},kind:{type:String,default:`default`,validator:e=>Object.keys(t.PROGRESS_CIRCLE_KINDS).includes(e)}},data(){return{strokeWidth:3.25,uid:Math.random().toString(36).substring(2,9)}},computed:{isAi(){return this.kind===`ai`},aiGradientId(){return`progress-circle-ai-gradient-${this.uid}`},fillStrokeStyle(){return this.isAi?{stroke:`url(#${this.aiGradientId})`}:{}},sizeClass(){return t.PROGRESS_CIRCLE_SIZES[this.size]},kindClass(){return t.PROGRESS_CIRCLE_KINDS[this.kind]},circleRadius(){return 12-this.strokeWidth/2},circleCircumference(){return 2*Math.PI*this.circleRadius},circlePath(){let e=this.circleRadius,t=12-e;return`M 12 ${t} A ${e} ${e} 0 0 1 12 ${12+e} A ${e} ${e} 0 0 1 12 ${t} Z`},cssVars(){let e=this.circleCircumference,t=e*(this.progress>0&&this.progress<5?5:this.progress)/100,n=this.strokeWidth,r=n/2,i=this.progress>0&&this.progress<100,a=i?n:0;return{"--stroke-dasharray":!i&&this.progress>=100?`none`:e,"--fill-dashoffset":e-Math.max(0,t-a),"--fill-rotate":`${i?r/e*360:0}deg`,"--track-dasharray":!i&&this.progress<=0?`none`:`${Math.max(0,e-t-a)} ${e}`,"--track-dashoffset":-(t+(i?r:0))}}}},i=[`aria-label`,`aria-valuenow`],a={key:0},o=[`id`],s=[`d`,`stroke-width`],c=[`d`,`stroke-width`];function l(e,t,r,l,u,d){return(0,n.openBlock)(),(0,n.createElementBlock)(`div`,{class:(0,n.normalizeClass)([`d-progress-circle`,[d.sizeClass,d.kindClass]]),role:`progressbar`,"aria-label":r.ariaLabel,tabindex:`-1`,"aria-valuenow":r.progress,"aria-valuemin":`0`,"aria-valuemax":`100`,"data-qa":`dt-progress-circle`},[((0,n.openBlock)(),(0,n.createElementBlock)(`svg`,{class:`d-progress-circle__bar`,style:(0,n.normalizeStyle)(d.cssVars),viewBox:`0 0 24 24`},[d.isAi?((0,n.openBlock)(),(0,n.createElementBlock)(`defs`,a,[(0,n.createElementVNode)(`linearGradient`,{id:d.aiGradientId,x1:`0%`,y1:`0%`,x2:`100%`,y2:`100%`},[...t[0]||(t[0]=[(0,n.createElementVNode)(`stop`,{offset:`0%`,"stop-color":`var(--dt-color-brand-gold)`},null,-1),(0,n.createElementVNode)(`stop`,{offset:`33%`,"stop-color":`var(--dt-color-brand-red)`},null,-1),(0,n.createElementVNode)(`stop`,{offset:`66%`,"stop-color":`var(--dt-color-brand-magenta)`},null,-1),(0,n.createElementVNode)(`stop`,{offset:`100%`,"stop-color":`var(--dt-color-brand-purple)`},null,-1)])],8,o)])):(0,n.createCommentVNode)(``,!0),r.progress<=95?((0,n.openBlock)(),(0,n.createElementBlock)(`path`,{key:1,d:d.circlePath,class:`d-progress-circle__shape d-progress-circle__shape--track`,fill:`none`,"stroke-width":u.strokeWidth,"stroke-linecap":`round`},null,8,s)):(0,n.createCommentVNode)(``,!0),r.progress>0?((0,n.openBlock)(),(0,n.createElementBlock)(`path`,{key:2,d:d.circlePath,class:`d-progress-circle__shape d-progress-circle__shape--fill`,fill:`none`,"stroke-width":u.strokeWidth,"stroke-linecap":`round`,style:(0,n.normalizeStyle)(d.fillStrokeStyle)},null,12,c)):(0,n.createCommentVNode)(``,!0)],4))],10,i)}var u=e.t(r,[[`render`,l]]);exports.default=u;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`),t=require(`./progress-circle-constants.cjs`);let n=require(`vue`);var r={compatConfig:{MODE:3},name:`DtProgressCircle`,props:{ariaLabel:{type:String,required:!0},progress:{type:Number,default:0,validator:e=>e>=0&&e<=100},size:{type:String,default:`500`,validator:e=>Object.keys(t.PROGRESS_CIRCLE_SIZES).includes(e)},kind:{type:String,default:`default`,validator:e=>Object.keys(t.PROGRESS_CIRCLE_KINDS).includes(e)}},data(){return{strokeWidth:3.25,uid:Math.random().toString(36).substring(2,9)}},computed:{isAi(){return this.kind===`ai`},aiGradientId(){return`progress-circle-ai-gradient-${this.uid}`},fillStrokeStyle(){return this.isAi?{stroke:`url(#${this.aiGradientId})`}:{}},sizeClass(){return t.PROGRESS_CIRCLE_SIZES[this.size]},kindClass(){return t.PROGRESS_CIRCLE_KINDS[this.kind]},circleRadius(){return 12-this.strokeWidth/2},circleCircumference(){return 2*Math.PI*this.circleRadius},circlePath(){let e=this.circleRadius,t=12-e;return`M 12 ${t} A ${e} ${e} 0 0 1 12 ${12+e} A ${e} ${e} 0 0 1 12 ${t} Z`},cssVars(){let e=this.circleCircumference,t=e*(this.progress>0&&this.progress<5?5:this.progress)/100,n=this.strokeWidth,r=n/2,i=this.progress>0&&this.progress<100,a=i?n:0;return{"--stroke-dasharray":!i&&this.progress>=100?`none`:e,"--fill-dashoffset":e-Math.max(0,t-a),"--fill-rotate":`${i?r/e*360:0}deg`,"--track-dasharray":!i&&this.progress<=0?`none`:`${Math.max(0,e-t-a)} ${e}`,"--track-dashoffset":-(t+(i?r:0))}}}},i=[`aria-label`,`aria-valuenow`],a={key:0},o=[`id`],s=[`d`,`stroke-width`],c=[`d`,`stroke-width`];function l(e,t,r,l,u,d){return(0,n.openBlock)(),(0,n.createElementBlock)(`div`,{class:(0,n.normalizeClass)([`d-progress-circle`,[d.sizeClass,d.kindClass]]),role:`progressbar`,"aria-label":r.ariaLabel,tabindex:`-1`,"aria-valuenow":r.progress,"aria-valuemin":`0`,"aria-valuemax":`100`,"data-qa":`dt-progress-circle`},[((0,n.openBlock)(),(0,n.createElementBlock)(`svg`,{class:`d-progress-circle__bar`,style:(0,n.normalizeStyle)(d.cssVars),viewBox:`0 0 24 24`},[d.isAi?((0,n.openBlock)(),(0,n.createElementBlock)(`defs`,a,[(0,n.createElementVNode)(`linearGradient`,{id:d.aiGradientId,x1:`0%`,y1:`0%`,x2:`100%`,y2:`100%`},[...t[0]||(t[0]=[(0,n.createElementVNode)(`stop`,{offset:`0%`,"stop-color":`var(--dt-color-brand-gold)`},null,-1),(0,n.createElementVNode)(`stop`,{offset:`33%`,"stop-color":`var(--dt-color-brand-red)`},null,-1),(0,n.createElementVNode)(`stop`,{offset:`66%`,"stop-color":`var(--dt-color-brand-magenta)`},null,-1),(0,n.createElementVNode)(`stop`,{offset:`100%`,"stop-color":`var(--dt-color-brand-purple)`},null,-1)])],8,o)])):(0,n.createCommentVNode)(``,!0),r.progress<=95?((0,n.openBlock)(),(0,n.createElementBlock)(`path`,{key:1,d:d.circlePath,class:`d-progress-circle__shape d-progress-circle__shape--track`,fill:`none`,"stroke-width":u.strokeWidth,"stroke-linecap":`round`},null,8,s)):(0,n.createCommentVNode)(``,!0),r.progress>0?((0,n.openBlock)(),(0,n.createElementBlock)(`path`,{key:2,d:d.circlePath,class:`d-progress-circle__shape d-progress-circle__shape--fill`,fill:`none`,"stroke-width":u.strokeWidth,"stroke-linecap":`round`,style:(0,n.normalizeStyle)(d.fillStrokeStyle)},null,12,c)):(0,n.createCommentVNode)(``,!0)],4))],10,i)}var u=e.t(r,[[`render`,l]]);exports.default=u;
 //# sourceMappingURL=progress-circle.cjs.map

package/dist/lib/progress-circle/progress-circle.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"progress-circle.cjs","names":[],"sources":["../../../components/~~ProgressCircle~~/~~ProgressCircle~~.vue"],"sourcesContent":["<script>\n/*\n Circular SVG progress indicator for determinate upload or processing progress.\n * @see https://dialtone.dialpad.com/components/progress-circle.html\n /\nimport { PROGRESS_CIRCLE_SIZES, PROGRESS_CIRCLE_KINDS } from './~~ProgressCircleConstants~~';\n\nexport default {\n name: 'DtProgressCircle',\n props: {\n /* Accessible label read by screen readers. /\n ariaLabel: { type: String, required: true },\n /* Current progress value (0–100). /\n progress: {\n type: Number,\n default: 0,\n validator: (v) => v >= 0 && v <= 100,\n },\n\n /\n The size of the progress indicator, aligning to Dialtone icon sizes.\n * @values 100, 200, 300, 400, 500, 600, 700, 800\n /\n size: {\n type: String,\n default: '500',\n validator: (s) => Object.keys(PROGRESS_CIRCLE_SIZES).includes(s),\n },\n\n /\n The color variant of the progress indicator.\n * @values default, brand, critical, positive, warning, info, ai\n /\n kind: {\n type: String,\n default: 'default',\n validator: (k) => Object.keys(PROGRESS_CIRCLE_KINDS).includes(k),\n },\n },\n\n data () {\n return {\n strokeWidth: 3.25,\n uid: Math.random().toString(36).substring(2, 9),\n };\n },\n\n computed: {\n // SVG stroke doesn't support CSS gradients, so the \"ai\" kind uses an inline\n // SVG <linearGradient> referenced via url(#id) instead of a CSS variable.\n isAi () {\n return this.kind === 'ai';\n },\n\n // Unique per-instance to avoid collisions when multiple progress circles coexist.\n aiGradientId () {\n return `progress-circle-ai-gradient-${this.uid}`;\n },\n\n fillStrokeStyle () {\n return this.isAi ? { stroke: `url(#${this.aiGradientId})` } : {};\n },\n\n sizeClass () {\n return PROGRESS_CIRCLE_SIZES[this.size];\n },\n\n kindClass () {\n return PROGRESS_CIRCLE_KINDS[this.kind];\n },\n\n circleRadius () {\n return 12 - (this.strokeWidth / 2);\n },\n\n circleCircumference () {\n return 2 Math.PI * this.circleRadius;\n },\n\n // Draws a full circle as two arcs so getTotalLength() returns the circumference.\n circlePath () {\n const r = this.circleRadius;\n const top = 12 - r;\n const bottom = 12 + r;\n return `M 12 ${top} A ${r} ${r} 0 0 1 12 ${bottom} A ${r} ${r} 0 0 1 12 ${top} Z`;\n },\n\n // stroke-dasharray/offset control how much of the circle is visually \"filled\".\n cssVars () {\n const C = this.circleCircumference;\n const MIN_VISUAL_PROGRESS = 5;\n const visualProgress = (this.progress > 0 && this.progress < MIN_VISUAL_PROGRESS)\n ? MIN_VISUAL_PROGRESS\n : this.progress;\n const fillLength = C * visualProgress / 100;\n const sw = this.strokeWidth;\n const capArc = sw / 2;\n\n // When both arcs are visible, round linecaps extend capArc past each endpoint.\n // Shorten each arc by capArc at both ends (total sw per arc) so the caps meet\n // exactly at each junction without overlapping. Rotate the fill forward by\n // capArc so its start cap lands at 12 o'clock.\n const both = this.progress > 0 && this.progress < 100;\n const adj = both ? sw : 0;\n\n return {\n // Full-circle arcs use 'none' to avoid round-cap overlap at the path seam.\n '--stroke-dasharray': (!both && this.progress >= 100) ? 'none' : C,\n '--fill-dashoffset': C - Math.max(0, fillLength - adj),\n '--fill-rotate': `${both ? (capArc / C * 360) : 0}deg`,\n '--track-dasharray': (!both && this.progress <= 0) ? 'none' : `${Math.max(0, C - fillLength - adj)} ${C}`,\n '--track-dashoffset': -(fillLength + (both ? capArc : 0)),\n };\n },\n },\n\n};\n</script>\n\n<template>\n <div\n class=\"d-progress-circle\"\n :class=\"[sizeClass, kindClass]\"\n role=\"progressbar\"\n :aria-label=\"ariaLabel\"\n tabindex=\"-1\"\n :aria-valuenow=\"progress\"\n aria-valuemin=\"0\"\n aria-valuemax=\"100\"\n data-qa=\"dt-progress-circle\"\n >\n <svg\n class=\"d-progress-circle__bar\"\n :style=\"cssVars\"\n viewBox=\"0 0 24 24\"\n >\n <defs v-if=\"isAi\">\n <linearGradient\n :id=\"aiGradientId\"\n x1=\"0%\"\n y1=\"0%\"\n x2=\"100%\"\n y2=\"100%\"\n >\n <!-- This emulates the AI gradient, for which each color isn't directly mappable to a CSS variable -->\n <stop\n offset=\"0%\"\n stop-color=\"var(--dt-color-brand-gold)\"\n />\n <stop\n offset=\"33%\"\n stop-color=\"var(--dt-color-brand-red)\"\n />\n <stop\n offset=\"66%\"\n stop-color=\"var(--dt-color-brand-magenta)\"\n />\n <stop\n offset=\"100%\"\n stop-color=\"var(--dt-color-brand-purple)\"\n />\n </linearGradient>\n </defs>\n <path\n v-if=\"progress <= 95\"\n :d=\"circlePath\"\n class=\"d-progress-circle__shape d-progress-circle__shape--track\"\n fill=\"none\"\n :stroke-width=\"strokeWidth\"\n stroke-linecap=\"round\"\n />\n <path\n v-if=\"progress > 0\"\n :d=\"circlePath\"\n class=\"d-progress-circle__shape d-progress-circle__shape--fill\"\n fill=\"none\"\n :stroke-width=\"strokeWidth\"\n stroke-linecap=\"round\"\n :style=\"fillStrokeStyle\"\n />\n </svg>\n </div>\n</template>\n"],"mappings":"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"}
1	+ {"version":3,"file":"progress-circle.cjs","names":[],"sources":["../../../components/progress_circle/progress_circle.vue"],"sourcesContent":["<script>\n/*\n Circular SVG progress indicator for determinate upload or processing progress.\n * @see https://dialtone.dialpad.com/components/progress-circle.html\n /\nimport { PROGRESS_CIRCLE_SIZES, PROGRESS_CIRCLE_KINDS } from './progress_circle_constants';\n\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtProgressCircle',\n props: {\n /* Accessible label read by screen readers. /\n ariaLabel: { type: String, required: true },\n /* Current progress value (0–100). /\n progress: {\n type: Number,\n default: 0,\n validator: (v) => v >= 0 && v <= 100,\n },\n\n /\n The size of the progress indicator, aligning to Dialtone icon sizes.\n * @values 100, 200, 300, 400, 500, 600, 700, 800\n /\n size: {\n type: String,\n default: '500',\n validator: (s) => Object.keys(PROGRESS_CIRCLE_SIZES).includes(s),\n },\n\n /\n The color variant of the progress indicator.\n * @values default, brand, critical, positive, warning, info, ai\n /\n kind: {\n type: String,\n default: 'default',\n validator: (k) => Object.keys(PROGRESS_CIRCLE_KINDS).includes(k),\n },\n },\n\n data () {\n return {\n strokeWidth: 3.25,\n uid: Math.random().toString(36).substring(2, 9),\n };\n },\n\n computed: {\n // SVG stroke doesn't support CSS gradients, so the \"ai\" kind uses an inline\n // SVG <linearGradient> referenced via url(#id) instead of a CSS variable.\n isAi () {\n return this.kind === 'ai';\n },\n\n // Unique per-instance to avoid collisions when multiple progress circles coexist.\n aiGradientId () {\n return `progress-circle-ai-gradient-${this.uid}`;\n },\n\n fillStrokeStyle () {\n return this.isAi ? { stroke: `url(#${this.aiGradientId})` } : {};\n },\n\n sizeClass () {\n return PROGRESS_CIRCLE_SIZES[this.size];\n },\n\n kindClass () {\n return PROGRESS_CIRCLE_KINDS[this.kind];\n },\n\n circleRadius () {\n return 12 - (this.strokeWidth / 2);\n },\n\n circleCircumference () {\n return 2 Math.PI * this.circleRadius;\n },\n\n // Draws a full circle as two arcs so getTotalLength() returns the circumference.\n circlePath () {\n const r = this.circleRadius;\n const top = 12 - r;\n const bottom = 12 + r;\n return `M 12 ${top} A ${r} ${r} 0 0 1 12 ${bottom} A ${r} ${r} 0 0 1 12 ${top} Z`;\n },\n\n // stroke-dasharray/offset control how much of the circle is visually \"filled\".\n cssVars () {\n const C = this.circleCircumference;\n const MIN_VISUAL_PROGRESS = 5;\n const visualProgress = (this.progress > 0 && this.progress < MIN_VISUAL_PROGRESS)\n ? MIN_VISUAL_PROGRESS\n : this.progress;\n const fillLength = C * visualProgress / 100;\n const sw = this.strokeWidth;\n const capArc = sw / 2;\n\n // When both arcs are visible, round linecaps extend capArc past each endpoint.\n // Shorten each arc by capArc at both ends (total sw per arc) so the caps meet\n // exactly at each junction without overlapping. Rotate the fill forward by\n // capArc so its start cap lands at 12 o'clock.\n const both = this.progress > 0 && this.progress < 100;\n const adj = both ? sw : 0;\n\n return {\n // Full-circle arcs use 'none' to avoid round-cap overlap at the path seam.\n '--stroke-dasharray': (!both && this.progress >= 100) ? 'none' : C,\n '--fill-dashoffset': C - Math.max(0, fillLength - adj),\n '--fill-rotate': `${both ? (capArc / C * 360) : 0}deg`,\n '--track-dasharray': (!both && this.progress <= 0) ? 'none' : `${Math.max(0, C - fillLength - adj)} ${C}`,\n '--track-dashoffset': -(fillLength + (both ? capArc : 0)),\n };\n },\n },\n\n};\n</script>\n\n<template>\n <div\n class=\"d-progress-circle\"\n :class=\"[sizeClass, kindClass]\"\n role=\"progressbar\"\n :aria-label=\"ariaLabel\"\n tabindex=\"-1\"\n :aria-valuenow=\"progress\"\n aria-valuemin=\"0\"\n aria-valuemax=\"100\"\n data-qa=\"dt-progress-circle\"\n >\n <svg\n class=\"d-progress-circle__bar\"\n :style=\"cssVars\"\n viewBox=\"0 0 24 24\"\n >\n <defs v-if=\"isAi\">\n <linearGradient\n :id=\"aiGradientId\"\n x1=\"0%\"\n y1=\"0%\"\n x2=\"100%\"\n y2=\"100%\"\n >\n <!-- This emulates the AI gradient, for which each color isn't directly mappable to a CSS variable -->\n <stop\n offset=\"0%\"\n stop-color=\"var(--dt-color-brand-gold)\"\n />\n <stop\n offset=\"33%\"\n stop-color=\"var(--dt-color-brand-red)\"\n />\n <stop\n offset=\"66%\"\n stop-color=\"var(--dt-color-brand-magenta)\"\n />\n <stop\n offset=\"100%\"\n stop-color=\"var(--dt-color-brand-purple)\"\n />\n </linearGradient>\n </defs>\n <path\n v-if=\"progress <= 95\"\n :d=\"circlePath\"\n class=\"d-progress-circle__shape d-progress-circle__shape--track\"\n fill=\"none\"\n :stroke-width=\"strokeWidth\"\n stroke-linecap=\"round\"\n />\n <path\n v-if=\"progress > 0\"\n :d=\"circlePath\"\n class=\"d-progress-circle__shape d-progress-circle__shape--fill\"\n fill=\"none\"\n :stroke-width=\"strokeWidth\"\n stroke-linecap=\"round\"\n :style=\"fillStrokeStyle\"\n />\n </svg>\n </div>\n</template>\n"],"mappings":"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"}

package/dist/lib/progress-circle/progress-circle.js CHANGED Viewed

@@ -1,8 +1,9 @@
 import { t as e } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
 import { PROGRESS_CIRCLE_KINDS as t, PROGRESS_CIRCLE_SIZES as n } from "./progress-circle-constants.js";
 import { createCommentVNode as r, createElementBlock as i, createElementVNode as a, normalizeClass as o, normalizeStyle as s, openBlock as c } from "vue";
-//#region components/ProgressCircle/ProgressCircle.vue
+//#region components/progress_circle/progress_circle.vue
 var l = {
+	compatConfig: { MODE: 3 },
 	name: "DtProgressCircle",
 	props: {
 		ariaLabel: {

package/dist/lib/progress-circle/progress-circle.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"progress-circle.js","names":[],"sources":["../../../components/~~ProgressCircle~~/~~ProgressCircle~~.vue"],"sourcesContent":["<script>\n/*\n Circular SVG progress indicator for determinate upload or processing progress.\n * @see https://dialtone.dialpad.com/components/progress-circle.html\n /\nimport { PROGRESS_CIRCLE_SIZES, PROGRESS_CIRCLE_KINDS } from './~~ProgressCircleConstants~~';\n\nexport default {\n name: 'DtProgressCircle',\n props: {\n /* Accessible label read by screen readers. /\n ariaLabel: { type: String, required: true },\n /* Current progress value (0–100). /\n progress: {\n type: Number,\n default: 0,\n validator: (v) => v >= 0 && v <= 100,\n },\n\n /\n The size of the progress indicator, aligning to Dialtone icon sizes.\n * @values 100, 200, 300, 400, 500, 600, 700, 800\n /\n size: {\n type: String,\n default: '500',\n validator: (s) => Object.keys(PROGRESS_CIRCLE_SIZES).includes(s),\n },\n\n /\n The color variant of the progress indicator.\n * @values default, brand, critical, positive, warning, info, ai\n /\n kind: {\n type: String,\n default: 'default',\n validator: (k) => Object.keys(PROGRESS_CIRCLE_KINDS).includes(k),\n },\n },\n\n data () {\n return {\n strokeWidth: 3.25,\n uid: Math.random().toString(36).substring(2, 9),\n };\n },\n\n computed: {\n // SVG stroke doesn't support CSS gradients, so the \"ai\" kind uses an inline\n // SVG <linearGradient> referenced via url(#id) instead of a CSS variable.\n isAi () {\n return this.kind === 'ai';\n },\n\n // Unique per-instance to avoid collisions when multiple progress circles coexist.\n aiGradientId () {\n return `progress-circle-ai-gradient-${this.uid}`;\n },\n\n fillStrokeStyle () {\n return this.isAi ? { stroke: `url(#${this.aiGradientId})` } : {};\n },\n\n sizeClass () {\n return PROGRESS_CIRCLE_SIZES[this.size];\n },\n\n kindClass () {\n return PROGRESS_CIRCLE_KINDS[this.kind];\n },\n\n circleRadius () {\n return 12 - (this.strokeWidth / 2);\n },\n\n circleCircumference () {\n return 2 Math.PI * this.circleRadius;\n },\n\n // Draws a full circle as two arcs so getTotalLength() returns the circumference.\n circlePath () {\n const r = this.circleRadius;\n const top = 12 - r;\n const bottom = 12 + r;\n return `M 12 ${top} A ${r} ${r} 0 0 1 12 ${bottom} A ${r} ${r} 0 0 1 12 ${top} Z`;\n },\n\n // stroke-dasharray/offset control how much of the circle is visually \"filled\".\n cssVars () {\n const C = this.circleCircumference;\n const MIN_VISUAL_PROGRESS = 5;\n const visualProgress = (this.progress > 0 && this.progress < MIN_VISUAL_PROGRESS)\n ? MIN_VISUAL_PROGRESS\n : this.progress;\n const fillLength = C * visualProgress / 100;\n const sw = this.strokeWidth;\n const capArc = sw / 2;\n\n // When both arcs are visible, round linecaps extend capArc past each endpoint.\n // Shorten each arc by capArc at both ends (total sw per arc) so the caps meet\n // exactly at each junction without overlapping. Rotate the fill forward by\n // capArc so its start cap lands at 12 o'clock.\n const both = this.progress > 0 && this.progress < 100;\n const adj = both ? sw : 0;\n\n return {\n // Full-circle arcs use 'none' to avoid round-cap overlap at the path seam.\n '--stroke-dasharray': (!both && this.progress >= 100) ? 'none' : C,\n '--fill-dashoffset': C - Math.max(0, fillLength - adj),\n '--fill-rotate': `${both ? (capArc / C * 360) : 0}deg`,\n '--track-dasharray': (!both && this.progress <= 0) ? 'none' : `${Math.max(0, C - fillLength - adj)} ${C}`,\n '--track-dashoffset': -(fillLength + (both ? capArc : 0)),\n };\n },\n },\n\n};\n</script>\n\n<template>\n <div\n class=\"d-progress-circle\"\n :class=\"[sizeClass, kindClass]\"\n role=\"progressbar\"\n :aria-label=\"ariaLabel\"\n tabindex=\"-1\"\n :aria-valuenow=\"progress\"\n aria-valuemin=\"0\"\n aria-valuemax=\"100\"\n data-qa=\"dt-progress-circle\"\n >\n <svg\n class=\"d-progress-circle__bar\"\n :style=\"cssVars\"\n viewBox=\"0 0 24 24\"\n >\n <defs v-if=\"isAi\">\n <linearGradient\n :id=\"aiGradientId\"\n x1=\"0%\"\n y1=\"0%\"\n x2=\"100%\"\n y2=\"100%\"\n >\n <!-- This emulates the AI gradient, for which each color isn't directly mappable to a CSS variable -->\n <stop\n offset=\"0%\"\n stop-color=\"var(--dt-color-brand-gold)\"\n />\n <stop\n offset=\"33%\"\n stop-color=\"var(--dt-color-brand-red)\"\n />\n <stop\n offset=\"66%\"\n stop-color=\"var(--dt-color-brand-magenta)\"\n />\n <stop\n offset=\"100%\"\n stop-color=\"var(--dt-color-brand-purple)\"\n />\n </linearGradient>\n </defs>\n <path\n v-if=\"progress <= 95\"\n :d=\"circlePath\"\n class=\"d-progress-circle__shape d-progress-circle__shape--track\"\n fill=\"none\"\n :stroke-width=\"strokeWidth\"\n stroke-linecap=\"round\"\n />\n <path\n v-if=\"progress > 0\"\n :d=\"circlePath\"\n class=\"d-progress-circle__shape d-progress-circle__shape--fill\"\n fill=\"none\"\n :stroke-width=\"strokeWidth\"\n stroke-linecap=\"round\"\n :style=\"fillStrokeStyle\"\n />\n </svg>\n </div>\n</template>\n"],"mappings":";;;;AAOA,IAAK,IAAU;CACb,MAAM;CACN,OAAO;EAEL,WAAW;GAAE,MAAM;GAAQ,UAAU;GAAM;EAE3C,UAAU;GACR,MAAM;GACN,SAAS;GACT,YAAY,MAAM,KAAK,KAAK,KAAK;GAClC;EAMD,MAAM;GACJ,MAAM;GACN,SAAS;GACT,YAAY,MAAM,OAAO,KAAK,EAAsB,CAAC,SAAS,EAAE;GACjE;EAMD,MAAM;GACJ,MAAM;GACN,SAAS;GACT,YAAY,MAAM,OAAO,KAAK,EAAsB,CAAC,SAAS,EAAE;GACjE;EACF;CAED,OAAQ;AACN,SAAO;GACL,aAAa;GACb,KAAK,KAAK,QAAQ,CAAC,SAAS,GAAG,CAAC,UAAU,GAAG,EAAE;GAChD;;CAGH,UAAU;EAGR,OAAQ;AACN,UAAO,KAAK,SAAS;;EAIvB,eAAgB;AACd,UAAO,+BAA+B,KAAK;;EAG7C,kBAAmB;AACjB,UAAO,KAAK,OAAO,EAAE,QAAQ,QAAQ,KAAK,aAAa,IAAG,GAAI,EAAE;;EAGlE,YAAa;AACX,UAAO,EAAsB,KAAK;;EAGpC,YAAa;AACX,UAAO,EAAsB,KAAK;;EAGpC,eAAgB;AACd,UAAO,KAAM,KAAK,cAAc;;EAGlC,sBAAuB;AACrB,UAAO,IAAI,KAAK,KAAK,KAAK;;EAI5B,aAAc;GACZ,IAAM,IAAI,KAAK,cACT,IAAM,KAAK;AAEjB,UAAO,QAAQ,EAAG,KAAM,EAAC,GAAI,EAAC,YADf,KAAK,EAC6B,KAAM,EAAC,GAAI,EAAC,YAAa,EAAG;;EAI/E,UAAW;GACT,IAAM,IAAI,KAAK,qBAKT,IAAa,KAHK,KAAK,WAAW,KAAK,KAAK,WAAW,IACzD,IACA,KAAK,YAC+B,KAClC,IAAK,KAAK,aACV,IAAS,IAAK,GAMd,IAAO,KAAK,WAAW,KAAK,KAAK,WAAW,KAC5C,IAAM,IAAO,IAAK;AAExB,UAAO;IAEL,sBAAuB,CAAC,KAAQ,KAAK,YAAY,MAAO,SAAS;IACjE,qBAAqB,IAAI,KAAK,IAAI,GAAG,IAAa,EAAI;IACtD,iBAAiB,GAAG,IAAQ,IAAS,IAAI,MAAO,EAAE;IAClD,qBAAsB,CAAC,KAAQ,KAAK,YAAY,IAAK,SAAS,GAAG,KAAK,IAAI,GAAG,IAAI,IAAa,EAAI,CAAA,GAAI;IACtG,sBAAsB,EAAE,KAAc,IAAO,IAAS;IACvD;;EAEJ;CAEF;;aAIC,EA6DM,OAAA;EA5DJ,OAAK,EAAA,CAAC,qBAAmB,CAChB,EAAA,WAAW,EAAA,UAAS,CAAA,CAAA;EAC7B,MAAK;EACJ,cAAY,EAAA;EACb,UAAS;EACR,iBAAe,EAAA;EAChB,iBAAc;EACd,iBAAc;EACd,WAAQ;WAER,EAiDM,OAAA;EAhDJ,OAAM;EACL,OAAK,EAAE,EAAA,QAAO;EACf,SAAQ;;EAEI,EAAA,QAAA,GAAA,EAAZ,EA0BO,QAAA,GAAA,CAzBL,EAwBiB,kBAAA;GAvBd,IAAI,EAAA;GACL,IAAG;GACH,IAAG;GACH,IAAG;GACH,IAAG;;GAGH,EAGE,QAAA;IAFA,QAAO;IACP,cAAW;;GAEb,EAGE,QAAA;IAFA,QAAO;IACP,cAAW;;GAEb,EAGE,QAAA;IAFA,QAAO;IACP,cAAW;;GAEb,EAGE,QAAA;IAFA,QAAO;IACP,cAAW;;;EAKT,EAAA,YAAQ,MAAA,GAAA,EADhB,EAOE,QAAA;;GALC,GAAG,EAAA;GACJ,OAAM;GACN,MAAK;GACJ,gBAAc,EAAA;GACf,kBAAe;;EAGT,EAAA,WAAQ,KAAA,GAAA,EADhB,EAQE,QAAA;;GANC,GAAG,EAAA;GACJ,OAAM;GACN,MAAK;GACJ,gBAAc,EAAA;GACf,kBAAe;GACd,OAAK,EAAE,EAAA,gBAAe"}
1	+ {"version":3,"file":"progress-circle.js","names":[],"sources":["../../../components/progress_circle/progress_circle.vue"],"sourcesContent":["<script>\n/*\n Circular SVG progress indicator for determinate upload or processing progress.\n * @see https://dialtone.dialpad.com/components/progress-circle.html\n /\nimport { PROGRESS_CIRCLE_SIZES, PROGRESS_CIRCLE_KINDS } from './progress_circle_constants';\n\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtProgressCircle',\n props: {\n /* Accessible label read by screen readers. /\n ariaLabel: { type: String, required: true },\n /* Current progress value (0–100). /\n progress: {\n type: Number,\n default: 0,\n validator: (v) => v >= 0 && v <= 100,\n },\n\n /\n The size of the progress indicator, aligning to Dialtone icon sizes.\n * @values 100, 200, 300, 400, 500, 600, 700, 800\n /\n size: {\n type: String,\n default: '500',\n validator: (s) => Object.keys(PROGRESS_CIRCLE_SIZES).includes(s),\n },\n\n /\n The color variant of the progress indicator.\n * @values default, brand, critical, positive, warning, info, ai\n /\n kind: {\n type: String,\n default: 'default',\n validator: (k) => Object.keys(PROGRESS_CIRCLE_KINDS).includes(k),\n },\n },\n\n data () {\n return {\n strokeWidth: 3.25,\n uid: Math.random().toString(36).substring(2, 9),\n };\n },\n\n computed: {\n // SVG stroke doesn't support CSS gradients, so the \"ai\" kind uses an inline\n // SVG <linearGradient> referenced via url(#id) instead of a CSS variable.\n isAi () {\n return this.kind === 'ai';\n },\n\n // Unique per-instance to avoid collisions when multiple progress circles coexist.\n aiGradientId () {\n return `progress-circle-ai-gradient-${this.uid}`;\n },\n\n fillStrokeStyle () {\n return this.isAi ? { stroke: `url(#${this.aiGradientId})` } : {};\n },\n\n sizeClass () {\n return PROGRESS_CIRCLE_SIZES[this.size];\n },\n\n kindClass () {\n return PROGRESS_CIRCLE_KINDS[this.kind];\n },\n\n circleRadius () {\n return 12 - (this.strokeWidth / 2);\n },\n\n circleCircumference () {\n return 2 Math.PI * this.circleRadius;\n },\n\n // Draws a full circle as two arcs so getTotalLength() returns the circumference.\n circlePath () {\n const r = this.circleRadius;\n const top = 12 - r;\n const bottom = 12 + r;\n return `M 12 ${top} A ${r} ${r} 0 0 1 12 ${bottom} A ${r} ${r} 0 0 1 12 ${top} Z`;\n },\n\n // stroke-dasharray/offset control how much of the circle is visually \"filled\".\n cssVars () {\n const C = this.circleCircumference;\n const MIN_VISUAL_PROGRESS = 5;\n const visualProgress = (this.progress > 0 && this.progress < MIN_VISUAL_PROGRESS)\n ? MIN_VISUAL_PROGRESS\n : this.progress;\n const fillLength = C * visualProgress / 100;\n const sw = this.strokeWidth;\n const capArc = sw / 2;\n\n // When both arcs are visible, round linecaps extend capArc past each endpoint.\n // Shorten each arc by capArc at both ends (total sw per arc) so the caps meet\n // exactly at each junction without overlapping. Rotate the fill forward by\n // capArc so its start cap lands at 12 o'clock.\n const both = this.progress > 0 && this.progress < 100;\n const adj = both ? sw : 0;\n\n return {\n // Full-circle arcs use 'none' to avoid round-cap overlap at the path seam.\n '--stroke-dasharray': (!both && this.progress >= 100) ? 'none' : C,\n '--fill-dashoffset': C - Math.max(0, fillLength - adj),\n '--fill-rotate': `${both ? (capArc / C * 360) : 0}deg`,\n '--track-dasharray': (!both && this.progress <= 0) ? 'none' : `${Math.max(0, C - fillLength - adj)} ${C}`,\n '--track-dashoffset': -(fillLength + (both ? capArc : 0)),\n };\n },\n },\n\n};\n</script>\n\n<template>\n <div\n class=\"d-progress-circle\"\n :class=\"[sizeClass, kindClass]\"\n role=\"progressbar\"\n :aria-label=\"ariaLabel\"\n tabindex=\"-1\"\n :aria-valuenow=\"progress\"\n aria-valuemin=\"0\"\n aria-valuemax=\"100\"\n data-qa=\"dt-progress-circle\"\n >\n <svg\n class=\"d-progress-circle__bar\"\n :style=\"cssVars\"\n viewBox=\"0 0 24 24\"\n >\n <defs v-if=\"isAi\">\n <linearGradient\n :id=\"aiGradientId\"\n x1=\"0%\"\n y1=\"0%\"\n x2=\"100%\"\n y2=\"100%\"\n >\n <!-- This emulates the AI gradient, for which each color isn't directly mappable to a CSS variable -->\n <stop\n offset=\"0%\"\n stop-color=\"var(--dt-color-brand-gold)\"\n />\n <stop\n offset=\"33%\"\n stop-color=\"var(--dt-color-brand-red)\"\n />\n <stop\n offset=\"66%\"\n stop-color=\"var(--dt-color-brand-magenta)\"\n />\n <stop\n offset=\"100%\"\n stop-color=\"var(--dt-color-brand-purple)\"\n />\n </linearGradient>\n </defs>\n <path\n v-if=\"progress <= 95\"\n :d=\"circlePath\"\n class=\"d-progress-circle__shape d-progress-circle__shape--track\"\n fill=\"none\"\n :stroke-width=\"strokeWidth\"\n stroke-linecap=\"round\"\n />\n <path\n v-if=\"progress > 0\"\n :d=\"circlePath\"\n class=\"d-progress-circle__shape d-progress-circle__shape--fill\"\n fill=\"none\"\n :stroke-width=\"strokeWidth\"\n stroke-linecap=\"round\"\n :style=\"fillStrokeStyle\"\n />\n </svg>\n </div>\n</template>\n"],"mappings":"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"}

package/dist/lib/radio/radio-constants.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e={warning:`d-radio--warning`,critical:`d-radio--critical`,positive:`d-radio--positive`},t={RADIO_INPUT_VALIDATION_CLASSES:e};exports.RADIO_INPUT_VALIDATION_CLASSES=e,exports.default=t;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e={warning:`d-radio--warning`,error:`d-radio--error`,success:`d-radio--success`},t={RADIO_INPUT_VALIDATION_CLASSES:e};exports.RADIO_INPUT_VALIDATION_CLASSES=e,exports.default=t;
 //# sourceMappingURL=radio-constants.cjs.map

package/dist/lib/radio/radio-constants.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"radio-constants.cjs","names":[],"sources":["../../../components/~~Radio~~/~~RadioConstants~~.js"],"sourcesContent":["export const RADIO_INPUT_VALIDATION_CLASSES = {\n warning: 'd-radio--warning',\n ~~critical~~: 'd-radio--~~critical~~',\n ~~positive~~: 'd-radio--~~positive~~',\n};\n\nexport default {\n RADIO_INPUT_VALIDATION_CLASSES,\n};\n"],"mappings":"+FAAA,IAAa,EAAiC,CAC5C,QAAS,mBACT,~~SAAU~~,~~oBACV~~,~~SAAU~~,~~oBACX~~,CAED,EAAe,CACb,iCACD"}
1	+ {"version":3,"file":"radio-constants.cjs","names":[],"sources":["../../../components/radio/radio_constants.js"],"sourcesContent":["export const RADIO_INPUT_VALIDATION_CLASSES = {\n warning: 'd-radio--warning',\n error: 'd-radio--error',\n success: 'd-radio--success',\n};\n\nexport default {\n RADIO_INPUT_VALIDATION_CLASSES,\n};\n"],"mappings":"+FAAA,IAAa,EAAiC,CAC5C,QAAS,mBACT,MAAO,iBACP,QAAS,mBACV,CAED,EAAe,CACb,iCACD"}

package/dist/lib/radio/radio-constants.js CHANGED Viewed

@@ -1,8 +1,8 @@
-//#region components/Radio/RadioConstants.js
+//#region components/radio/radio_constants.js
 var e = {
 	warning: "d-radio--warning",
-	critical: "d-radio--critical",
-	positive: "d-radio--positive"
+	error: "d-radio--error",
+	success: "d-radio--success"
 }, t = { RADIO_INPUT_VALIDATION_CLASSES: e };
 //#endregion
 export { e as RADIO_INPUT_VALIDATION_CLASSES, t as default };

package/dist/lib/radio/radio-constants.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"radio-constants.js","names":[],"sources":["../../../components/~~Radio~~/~~RadioConstants~~.js"],"sourcesContent":["export const RADIO_INPUT_VALIDATION_CLASSES = {\n warning: 'd-radio--warning',\n ~~critical~~: 'd-radio--~~critical~~',\n ~~positive~~: 'd-radio--~~positive~~',\n};\n\nexport default {\n RADIO_INPUT_VALIDATION_CLASSES,\n};\n"],"mappings":";AAAA,IAAa,IAAiC;CAC5C,SAAS;CACT,~~UAAU~~;~~CACV~~,~~UAAU~~;~~CACX~~,EAED,IAAe,EACb,mCACD"}
1	+ {"version":3,"file":"radio-constants.js","names":[],"sources":["../../../components/radio/radio_constants.js"],"sourcesContent":["export const RADIO_INPUT_VALIDATION_CLASSES = {\n warning: 'd-radio--warning',\n error: 'd-radio--error',\n success: 'd-radio--success',\n};\n\nexport default {\n RADIO_INPUT_VALIDATION_CLASSES,\n};\n"],"mappings":";AAAA,IAAa,IAAiC;CAC5C,SAAS;CACT,OAAO;CACP,SAAS;CACV,EAED,IAAe,EACb,mCACD"}

package/dist/lib/radio/radio.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/constants/index.cjs`),t=require(`../../common/utils/index.cjs`),n=require(`../../common/mixins/input.cjs`),r=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`),i=require(`../validation-messages/validation-messages.cjs`),a=require(`../text/text-constants.cjs`),o=require(`../text/text.cjs`),s=require(`./radio-constants.cjs`);let c=require(`vue`);var l={name:`DtRadio`,components:{DtValidationMessages:i.default,DtText:o.default},mixins:[n.InputMixin,n.CheckableMixin,n.GroupableMixin,n.MessagesMixin],inheritAttrs:!1,props:{value:{type:[String,Number],default:``},showLabel:{type:Boolean,default:!0},labelSize:{type:[String,Number],default:null,validator:e=>a.TEXT_SIZE_MODIFIERS.label.includes(String(e))},labelStrength:{type:String,default:null,validator:e=>Object.keys(a.TEXT_STRENGTH_MODIFIERS).includes(e)}},emits:[`update:modelValue`,`focus`,`focusin`,`focusout`],data(){return{hasSlotContent:t.hasSlotContent,messagesId:t.getUniqueString()}},computed:{hasLabelContent(){return!!(this.$slots.default||this.label)},hasLabel(){return this.showLabel&&this.hasLabelContent},resolvedLabelSize(){return this.labelSize??300},inputValidationClass(){return s.RADIO_INPUT_VALIDATION_CLASSES[this.internalValidationState]},radioGroupValue(){return this.groupContext?.selectedValue},inputListeners(){return{input:()=>{},focusin:e=>this.$emit(`focusin`,e),focusout:e=>this.$emit(`focusout`,e),change:e=>this.emitValue(e.target.value)}},hasMessages(){return this.formattedMessages.length&&this.showMessages},ariaInvalid(){return t.getValidationState(this.formattedMessages)===e.VALIDATION_MESSAGE_TYPES.CRITICAL?`true`:void 0},ariaDescribedBy(){return this.showMessages&&this.formattedMessages.length>0?this.messagesId:void 0}},watch:{radioGroupValue:{immediate:!0,handler(e){this.hasGroup&&(this.internalChecked=e===this.value)}}},mounted(){this.runValidations()},methods:{removeClassStyleAttrs:t.removeClassStyleAttrs,runValidations(){!this.hasLabelContent&&!this.$attrs[`aria-label`]&&console.info(`[Dialtone] A label is required for accessibility. Provide a label prop and use show-label="false" to hide it visually.`)},emitValue(e){e!==this.radioGroupValue&&(this.setGroupValue(e),this.$emit(`update:modelValue`,e))}}},u={class:`d-radio__input`},d=[`checked`,`name`,`value`,`disabled`,`aria-label`,`aria-invalid`,`aria-describedby`],f={class:`d-radio__messages`,"data-qa":`radio-description-messages`};function p(e,t,n,r,i,a){let o=(0,c.resolveComponent)(`dt-text`),s=(0,c.resolveComponent)(`dt-validation-messages`);return(0,c.openBlock)(),(0,c.createElementBlock)(`div`,{class:(0,c.normalizeClass)(e.$attrs.class),style:(0,c.normalizeStyle)(e.$attrs.style)},[(0,c.createElementVNode)(`label`,{class:(0,c.normalizeClass)([`d-radio-group`,{"d-radio-group--disabled":e.internalDisabled}])},[(0,c.createElementVNode)(`div`,u,[(0,c.createElementVNode)(`input`,(0,c.mergeProps)({checked:e.internalChecked,name:e.internalName,value:n.value,disabled:e.internalDisabled,type:`radio`,class:[`d-radio`,a.inputValidationClass,e.inputClass],"aria-label":!n.showLabel&&e.label?e.label:void 0,"aria-invalid":a.ariaInvalid,"aria-describedby":a.ariaDescribedBy},a.removeClassStyleAttrs(e.$attrs),(0,c.toHandlers)(a.inputListeners,!0)),null,16,d)]),a.hasLabel?((0,c.openBlock)(),(0,c.createBlock)(o,(0,c.mergeProps)({key:0,as:`div`,kind:`label`,size:a.resolvedLabelSize,strength:n.labelStrength??`normal`,tone:e.internalDisabled?`disabled`:`primary`,class:[e.labelClass,`d-radio__copy d-radio__label`]},e.labelChildProps,{"data-qa":`radio-label`}),{default:(0,c.withCtx)(()=>[(0,c.renderSlot)(e.$slots,`default`,{},()=>[(0,c.createTextVNode)((0,c.toDisplayString)(e.label),1)])]),_:3},16,[`size`,`strength`,`tone`,`class`])):(0,c.createCommentVNode)(``,!0)],2),(0,c.createElementVNode)(`div`,f,[e.$slots.description||e.description?((0,c.openBlock)(),(0,c.createBlock)(o,(0,c.mergeProps)({key:0,kind:`body`,size:200,tone:`tertiary`,as:`div`,class:[`d-description`,e.descriptionClass]},e.descriptionChildProps,{"data-qa":`radio-description`}),{default:(0,c.withCtx)(()=>[(0,c.renderSlot)(e.$slots,`description`,{},()=>[(0,c.createTextVNode)((0,c.toDisplayString)(e.description),1)])]),_:3},16,[`class`])):(0,c.createCommentVNode)(``,!0),(0,c.createVNode)(s,(0,c.mergeProps)(e.messagesChildProps,{id:i.messagesId,"validation-messages":e.formattedMessages,"show-messages":e.showMessages,class:e.messagesClass,"data-qa":`dt-radio-validation-messages`}),null,16,[`id`,`validation-messages`,`show-messages`,`class`])])],6)}var m=r.t(l,[[`render`,p]]);exports.default=m;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/utils/index.cjs`),t=require(`../../common/mixins/input.cjs`),n=require(`../../_plugin-vue_export-helper-D8jCH6HB.cjs`),r=require(`../validation-messages/validation-messages.cjs`),i=require(`./radio-constants.cjs`);let a=require(`vue`);var o={compatConfig:{MODE:3},name:`DtRadio`,components:{DtValidationMessages:r.default},mixins:[t.InputMixin,t.CheckableMixin,t.GroupableMixin,t.MessagesMixin],inheritAttrs:!1,props:{value:{type:[String,Number],default:``}},emits:[`input`,`update:modelValue`,`focus`,`focusin`,`focusout`],data(){return{hasSlotContent:e.hasSlotContent}},computed:{inputValidationClass(){return i.RADIO_INPUT_VALIDATION_CLASSES[this.internalValidationState]},radioGroupValue(){return this.groupContext?.selectedValue},inputListeners(){return{input:()=>{},focusin:e=>this.$emit(`focusin`,e),focusout:e=>this.$emit(`focusout`,e),change:e=>this.emitValue(e.target.value)}},hasMessages(){return this.formattedMessages.length&&this.showMessages}},watch:{radioGroupValue:{immediate:!0,handler(e){this.hasGroup&&(this.internalChecked=e===this.value)}}},methods:{removeClassStyleAttrs:e.removeClassStyleAttrs,addClassStyleAttrs:e.addClassStyleAttrs,emitValue(e){e!==this.radioGroupValue&&(this.setGroupValue(e),this.$emit(`input`,e),this.$emit(`update:modelValue`,e))}}},s={class:`d-radio__input`},c=[`checked`,`name`,`value`,`disabled`],l={key:0,class:`d-radio__messages`,"data-qa":`radio-description-messages`};function u(e,t,n,r,i,o){let u=(0,a.resolveComponent)(`dt-validation-messages`);return(0,a.openBlock)(),(0,a.createElementBlock)(`div`,(0,a.mergeProps)({class:e.rootClass},o.addClassStyleAttrs(e.$attrs)),[(0,a.createElementVNode)(`label`,{class:(0,a.normalizeClass)([`d-radio-group`,{"d-radio-group--disabled":e.internalDisabled}])},[(0,a.createElementVNode)(`div`,s,[(0,a.createElementVNode)(`input`,(0,a.mergeProps)({checked:e.internalChecked,name:e.internalName,value:n.value,disabled:e.internalDisabled,type:`radio`,class:[`d-radio`,o.inputValidationClass,e.inputClass]},o.removeClassStyleAttrs(e.$attrs),(0,a.toHandlers)(o.inputListeners,!0)),null,16,c)]),(0,a.createElementVNode)(`div`,(0,a.mergeProps)({class:[e.labelClass,`d-radio__copy d-radio__label`]},e.labelChildProps,{"data-qa":`radio-label`}),[(0,a.renderSlot)(e.$slots,`default`,{},()=>[(0,a.createTextVNode)((0,a.toDisplayString)(e.label),1)])],16)],2),e.$slots.description||e.description||o.hasMessages?((0,a.openBlock)(),(0,a.createElementBlock)(`div`,l,[e.$slots.description||e.description?((0,a.openBlock)(),(0,a.createElementBlock)(`div`,(0,a.mergeProps)({key:0,class:[`d-description`,e.descriptionClass]},e.descriptionChildProps,{"data-qa":`radio-description`}),[(0,a.renderSlot)(e.$slots,`description`,{},()=>[(0,a.createTextVNode)((0,a.toDisplayString)(e.description),1)])],16)):(0,a.createCommentVNode)(``,!0),(0,a.createVNode)(u,(0,a.mergeProps)({"validation-messages":e.formattedMessages,"show-messages":e.showMessages,class:e.messagesClass},e.messagesChildProps,{"data-qa":`dt-radio-validation-messages`}),null,16,[`validation-messages`,`show-messages`,`class`])])):(0,a.createCommentVNode)(``,!0)],16)}var d=n.t(o,[[`render`,u]]);exports.default=d;
 //# sourceMappingURL=radio.cjs.map

package/dist/lib/radio/radio.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"radio.cjs","names":[],"sources":["../../../components/~~Radio~~/~~Radio~~.vue"],"sourcesContent":["<template>\n <div\n :class=\"~~$attrs.class~~\"\n ~~:style~~=\"$attrs~~.style~~\"\n >\n <label :class=\"['d-radio-group', { 'd-radio-group--disabled': internalDisabled }]\">\n <div class=\"d-radio__input\">\n <input\n :checked=\"internalChecked\"\n :name=\"internalName\"\n :value=\"value\"\n :disabled=\"internalDisabled\"\n type=\"radio\"\n :class=\"['d-radio', inputValidationClass, inputClass]\"\n ~~:aria-label=\"!showLabel && label ? label : undefined\"\n :aria-invalid=\"ariaInvalid\"\n :aria-describedby=\"ariaDescribedBy\"\n~~ v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"inputListeners\"\n >\n </div>\n <~~dt-text\n v-if=\"hasLabel\"\n as=\"~~div\"\n ~~kind=\"label\"\n~~ :~~size=\"resolvedLabelSize\"\n :strength=\"labelStrength ?? 'normal'\"\n :tone=\"internalDisabled ? 'disabled' : 'primary'\"\n :~~class=\"[labelClass, 'd-radio__copy d-radio__label']\"\n v-bind=\"labelChildProps\"\n data-qa=\"radio-label\"\n >\n <!-- @slot slot for Radio Label -->\n <slot>{{ label }}</slot>\n </~~dt-text~~>\n </label>\n <div\n class=\"d-radio__messages\"\n data-qa=\"radio-description-messages\"\n >\n <~~dt-text~~\n v-if=\"$slots.description \|\| description\"\n ~~kind=\"body\"\n~~ :~~size=\"200\"\n tone=\"tertiary\"\n as=\"div\"\n :~~class=\"['d-description', descriptionClass]\"\n v-bind=\"descriptionChildProps\"\n data-qa=\"radio-description\"\n >\n <!-- @slot slot for Radio Description -->\n <slot name=\"description\">\n {{ description }}\n </slot>\n </~~dt-text~~>\n <dt-validation-messages\n ~~v-bind=\"messagesChildProps\"\n~~ :~~id=\"messagesId\"\n :~~validation-messages=\"formattedMessages\"\n :show-messages=\"showMessages\"\n :class=\"messagesClass\"\n data-qa=\"dt-radio-validation-messages\"\n />\n </div>\n </div>\n</template>\n\n<script>\nimport {\n InputMixin,\n CheckableMixin,\n GroupableMixin,\n MessagesMixin,\n} from '@/common/mixins/input';\nimport { RADIO_INPUT_VALIDATION_CLASSES } from './~~RadioConstants~~';\nimport { DtValidationMessages } from '../~~ValidationMessages~~';\nimport { ~~DtText, TEXT_SIZE_MODIFIERS, TEXT_STRENGTH_MODIFIERS } from '@/components/Text';\nimport {~~ hasSlotContent, removeClassStyleAttrs, ~~getUniqueString,~~ ~~getValidationState~~ } from '@/common/utils';\~~nimport { VALIDATION_MESSAGE_TYPES } from '@/common/constants';\~~n\n/*\n Radios are control elements that allow the user to make a single selection.\n * They are typically used in a Radio Group which allows the user to make a selection from a list of options.\n * @see https://dialtone.dialpad.com/components/radio.html\n /\nexport default {\n name: 'DtRadio',\n\n components: { DtValidationMessages, ~~DtText~~ },\n\n mixins: [InputMixin, CheckableMixin, GroupableMixin, MessagesMixin],\n\n inheritAttrs: false,\n\n props: {\n /\n A provided value for the radio\n /\n value: {\n type: [String, Number],\n default: '',\n },\n\n ~~/\n Determines visibility of radio label.\n * @values true, false~~\n /\n showLabel: {\n ~~type: Boolean,\n default: true,\n~~ ~~},\n\n~~ /\n ~~Overrides~~ ~~the~~ ~~label text size.\~~n * @~~values~~ ~~100, 200, 300, 400~~\n /\n labelSize: ~~{\n~~ type: [String, Number~~],\n default: null,\n validator: (s) => TEXT_SIZE_MODIFIERS.label.includes(String(s)),\n~~ }~~,\n~~\n ~~/\n~~ Overrides the label font weight.\n * @values bold, semibold, medium, normal\n /\n ~~labelStrength: {\n type: String~~,\n ~~default: null,\n validator: (s) => Object.keys(TEXT_STRENGTH_MODIFIERS).includes(s),\n~~ ~~},\n },\n\n emits: [\n~~ /\n Event fired to sync the modelValue prop with the parent component\n \n @event ~~update:modelValue~~\n * @type {String \| Number}\n /\n 'update:modelValue',\n\n /\n Native input focus event\n \n @event focus\n * @type {FocusEvent}\n /\n 'focus',\n\n /\n Native input focusin event\n \n @event focusin\n * @property {FocusEvent}\n /\n 'focusin',\n\n /\n Native input focusout event\n \n @event focusout\n * @property {FocusEvent}\n /\n 'focusout',\n ],\n\n data () {\n return {\n hasSlotContent,\n ~~messagesId: getUniqueString(),\n~~ };\n },\n\n computed: {\n hasLabelContent () {\n return !!(this.$slots.default \|\| this.label);\n },\n\n hasLabel () {\n return this.showLabel && this.hasLabelContent;\n },\n\n resolvedLabelSize () {\n return this.labelSize ?? 300;\n },\n\n inputValidationClass () {\n return RADIO_INPUT_VALIDATION_CLASSES[this.internalValidationState];\n },\n\n radioGroupValue () {\n return this.groupContext?.selectedValue;\n },\n\n inputListeners () {\n return {\n /\n * Override input listener to as no-op. Prevents parent input listeners from being passed through onto the input\n * element which will result in the handler being called twice\n * (once on the input element and once by the emitted input event by the change listener).\n */\n input: () => {},\n focusin: event => this.$emit('focusin', event),\n focusout: event => this.$emit('focusout', event),\n change: event => this.emitValue(event.target.value),\n };\n },\n\n hasMessages () {\n return this.formattedMessages.length && this.showMessages;\n },\n\n ariaInvalid () {\n return getValidationState(this.formattedMessages) === VALIDATION_MESSAGE_TYPES.CRITICAL ? 'true' : undefined;\n },\n\n ariaDescribedBy () {\n return this.showMessages && this.formattedMessages.length > 0 ? this.messagesId : undefined;\n },\n },\n\n watch: {\n radioGroupValue: {\n immediate: true,\n handler (newRadioGroupValue) {\n if (this.hasGroup) {\n // update internal value when the radio group value changes\n this.internalChecked = newRadioGroupValue === this.value;\n }\n },\n },\n },\n\n ~~mounted () {\n this.runValidations();\n },\n\n~~ methods: {\n removeClassStyleAttrs,\n\n runValidations () {\n if (!this.hasLabelContent && !this.$attrs['aria-label']) {\n console.info(\n '[Dialtone] A label is required for accessibility. Provide a label prop and use show-label=\"false\" to hide it visually.',\n ~~);\n }\n~~ ~~},\n\n~~ emitValue (value) {\n if (value !== this.radioGroupValue) {\n // update provided value if injected\n this.setGroupValue(value);\n this.$emit('update:modelValue', value);\n }\n },\n },\n};\n</script>\n"],"mappings":"~~ggBAqFA~~,IAAK,EAAU,CACb,KAAM,UAEN,WAAY,CAAE,qBAAA,EAAA,QAAsB,~~OAAA~~,~~EAAA,QAAQ,CAE5C,~~OAAQ,CAAC,EAAA,WAAY,EAAA,eAAgB,EAAA,eAAgB,EAAA,cAAc,CAEnE,aAAc,GAEd,MAAO,CAIL,MAAO,CACL,KAAM,CAAC,OAAQ,OAAO,CACtB,QAAS,GACV,CAMD,UAAW,CACT,KAAM,QACN,QAAS,GACV,CAMD,UAAW,CACT,KAAM,CAAC,OAAQ,OAAO,CACtB,QAAS,KACT,UAAY,GAAM,EAAA,oBAAoB,MAAM,SAAS,OAAO,EAAE,CAAC,CAChE,CAMD,cAAe,CACb,KAAM,OACN,QAAS,KACT,UAAY,GAAM,OAAO,KAAK,EAAA,wBAAwB,CAAC,SAAS,EAAE,CACnE,CACF,CAED,MAAO,CAOL,oBAQA,QAQA,UAQA,WACD,CAED,MAAQ,CACN,MAAO,CACL,eAAA,EAAA,~~eACA~~,~~WAAY,EAAA,iBAAiB,CAC9B,~~EAGH,SAAU,CACR,~~iBAAmB,CACjB,MAAO,CAAC,EAAE,KAAK,OAAO,SAAW,KAAK,QAGxC,UAAY,CACV,OAAO,KAAK,WAAa,KAAK,iBAGhC,mBAAqB,CACnB,OAAO,KAAK,WAAa,KAG3B,~~sBAAwB,CACtB,OAAO,EAAA,+BAA+B,KAAK,0BAG7C,iBAAmB,CACjB,OAAO,KAAK,cAAc,eAG5B,gBAAkB,CAChB,MAAO,CAML,UAAa,GACb,QAAS,GAAS,KAAK,MAAM,UAAW,EAAM,CAC9C,SAAU,GAAS,KAAK,MAAM,WAAY,EAAM,CAChD,OAAQ,GAAS,KAAK,UAAU,EAAM,OAAO,MAAM,CACpD,EAGH,aAAe,CACb,OAAO,KAAK,kBAAkB,QAAU,KAAK,~~cAG/C~~,~~aAAe,CACb,OAAO,EAAA,mBAAmB,KAAK,kBAAiB,GAAM,EAAA,yBAAyB,SAAW,OAAS,IAAA,IAGrG,iBAAmB,CACjB,OAAO,KAAK,cAAgB,KAAK,kBAAkB,OAAS,EAAI,KAAK,WAAa,IAAA,IAErF,~~CAED,MAAO,CACL,gBAAiB,CACf,UAAW,GACX,QAAS,EAAoB,CACvB,KAAK,WAEP,KAAK,gBAAkB,IAAuB,KAAK,QAGxD,CACF,CAED,~~SAAW,CACT,KAAK,gBAAgB,EAGvB,~~QAAS,CACP,sBAAA,EAAA,~~sBAEA~~,~~gBAAkB~~,~~CACZ~~,~~CAAC~~,~~KAAK,iBAAmB,CAAC,KAAK,OAAO,eACxC,QAAQ,KACN,yHACD,EAIL,~~UAAW,EAAO,CACZ,IAAU,KAAK,kBAEjB,KAAK,cAAc,EAAM,CACzB,KAAK,MAAM,oBAAqB,EAAM,GAG3C,CACF,~~IA3PU~~,MAAM,iBAAgB,~~2FA+B3B~~,MAAM,oBACN,UAAQ,~~kMA0BN~~,~~MAAA,CA9DH,~~OAAA,EAAA,EAAA,~~gBAAO~~,~~EAAA~~,~~OAAO~~,~~MAAK~~,~~CACnB~~,~~OAAA~~,EAAA,EAAA,~~gBAAO~~,EAAA,~~OAAO~~,~~MAAK~~,~~4BAgCZ~~,QAAA,~~CA9BA~~,OAAA,EAAA,EAAA,gBAAK,CAAA,gBAAA,CAAA,0BAAiD,EAAA,iBAAgB,CAAA,CAAA,CAAA,CAAA,EAAA,EAAA,EAAA,~~oBAetE~~,~~MAdN~~,~~EAcM~~,EAAA,EAAA,EAAA,oBADH,SAAA,EAAA,EAAA,YAAA,~~CAXE~~,QAAS,EAAA,gBACT,KAAM,EAAA,aACN,MAAO,EAAA,MACP,SAAU,EAAA,iBACX,KAAK,QACJ,MAAK,CAAA,UAAc,EAAA,qBAAsB,EAAA,WAAU,~~CACnD~~,~~aAAU,CAAG,~~EAAA,~~WAAa,EAAA,MAAQ,EAAA,MAAQ,IAAA,GAC1C,eAAc,EAAA,YACd,mBAAkB,EAAA,iBACX,EAAA,~~sBAAsB,EAAA,OAAM,EAAA,EAAA,EAAA,YACf,EAAf,eAAc,GAAA,CAAA,CAAA,KAAA,GAAA,EAAA,CAAA,CAAA,~~CAIhB,~~EAAA,~~WAAA,~~EAAA,EAAA,~~YAAA~~,~~EAAA~~,EAAA,EAAA,~~aAYE,GAAA,EAAA,EAAA,~~YAAA,~~OAXR~~,~~GAAG,MACH,KAAK,QACJ,KAAM,EAAA,kBACN,SAAU,EAAA,eAAa,SACvB,KAAM,EAAA,iBAAgB,WAAA,UACtB,~~MAAK,CAAG,EAAA,WAAU,+BAAA,~~EACX~~,EAAA,gBAAe,CACvB,UAAQ,cAAa,CAAA,CAAA,~~2BAGG,~~EAAA,EAAA,EAAA,~~YAAA~~,EAAA,OAAA,UAAA,EAAA,KAAA,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAAf,EAAA,MAAK,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,~~2GA8BZ~~,~~MA3BN~~,~~EA2BM~~,~~CAtBI~~,EAAA,OAAO,aAAe,EAAA,cAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,~~aAapB~~,~~GAAA~~,EAAA,EAAA,YAAA,~~OAZR~~,~~KAAK~~,~~OACJ~~,~~KAAM~~,~~IACP~~,~~KAAK~~,~~WACL~~,~~GAAG~~,~~MACF~~,MAAK,CAAA,gBAAoB,EAAA,iBAAgB,EAClC,EAAA,sBAAqB,CAC7B,UAAQ,oBAAmB,CAAA,CAAA,~~2BAKpB,~~EAAA,EAAA,EAAA,~~YAAA~~,EAAA,OAAA,cAAA,EAAA,KAAA,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBADF,EAAA,YAAW,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,~~uEAUhB~~,GAAA,EAAA,EAAA,~~YAAA~~,~~EANQ~~,~~mBAAkB~~,~~CACzB~~,~~GAAI~~,EAAA,~~WACJ~~,sBAAqB,EAAA,kBACrB,gBAAe,EAAA,aACf,MAAO,EAAA,~~cACR~~,UAAQ"}
1	+ {"version":3,"file":"radio.cjs","names":[],"sources":["../../../components/radio/radio.vue"],"sourcesContent":["<template>\n <div\n :class=\"rootClass\"\n v-bind=\"addClassStyleAttrs($attrs)\"\n >\n <label :class=\"['d-radio-group', { 'd-radio-group--disabled': internalDisabled }]\">\n <div class=\"d-radio__input\">\n <input\n :checked=\"internalChecked\"\n :name=\"internalName\"\n :value=\"value\"\n :disabled=\"internalDisabled\"\n type=\"radio\"\n :class=\"['d-radio', inputValidationClass, inputClass]\"\n v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"inputListeners\"\n >\n </div>\n <div\n :class=\"[labelClass, 'd-radio__copy d-radio__label']\"\n v-bind=\"labelChildProps\"\n data-qa=\"radio-label\"\n >\n <!-- @slot slot for Radio Label -->\n <slot>{{ label }}</slot>\n </div>\n </label>\n <div\n v-if=\"$slots.description \|\| description \|\| hasMessages\"\n class=\"d-radio__messages\"\n data-qa=\"radio-description-messages\"\n >\n <div\n v-if=\"$slots.description \|\| description\"\n :class=\"['d-description', descriptionClass]\"\n v-bind=\"descriptionChildProps\"\n data-qa=\"radio-description\"\n >\n <!-- @slot slot for Radio Description -->\n <slot name=\"description\">\n {{ description }}\n </slot>\n </div>\n <dt-validation-messages\n :validation-messages=\"formattedMessages\"\n :show-messages=\"showMessages\"\n :class=\"messagesClass\"\n v-bind=\"messagesChildProps\"\n data-qa=\"dt-radio-validation-messages\"\n />\n </div>\n </div>\n</template>\n\n<script>\nimport {\n InputMixin,\n CheckableMixin,\n GroupableMixin,\n MessagesMixin,\n} from '@/common/mixins/input';\nimport { RADIO_INPUT_VALIDATION_CLASSES } from './radio_constants';\nimport { DtValidationMessages } from '../validation_messages';\nimport { hasSlotContent, removeClassStyleAttrs, addClassStyleAttrs } from '@/common/utils';\n\n/*\n Radios are control elements that allow the user to make a single selection.\n * They are typically used in a Radio Group which allows the user to make a selection from a list of options.\n * @see https://dialtone.dialpad.com/components/radio.html\n /\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtRadio',\n\n components: { DtValidationMessages },\n\n mixins: [InputMixin, CheckableMixin, GroupableMixin, MessagesMixin],\n\n inheritAttrs: false,\n\n props: {\n /\n A provided value for the radio\n /\n value: {\n type: [String, Number],\n default: '',\n },\n },\n\n emits: [\n /\n Native input event\n \n @event input\n * @type {String \| Number}\n /\n 'input',\n /\n Event fired to sync the modelValue prop with the parent component\n \n @event input\n * @type {String \| Number}\n /\n 'update:modelValue',\n\n /\n Native input focus event\n \n @event focus\n * @type {FocusEvent}\n /\n 'focus',\n\n /\n Native input focusin event\n \n @event focusin\n * @property {FocusEvent}\n /\n 'focusin',\n\n /\n Native input focusout event\n \n @event focusout\n * @property {FocusEvent}\n /\n 'focusout',\n ],\n\n data () {\n return {\n hasSlotContent,\n };\n },\n\n computed: {\n inputValidationClass () {\n return RADIO_INPUT_VALIDATION_CLASSES[this.internalValidationState];\n },\n\n radioGroupValue () {\n return this.groupContext?.selectedValue;\n },\n\n inputListeners () {\n return {\n /\n * Override input listener to as no-op. Prevents parent input listeners from being passed through onto the input\n * element which will result in the handler being called twice\n * (once on the input element and once by the emitted input event by the change listener).\n */\n input: () => {},\n focusin: event => this.$emit('focusin', event),\n focusout: event => this.$emit('focusout', event),\n change: event => this.emitValue(event.target.value),\n };\n },\n\n hasMessages () {\n return this.formattedMessages.length && this.showMessages;\n },\n },\n\n watch: {\n radioGroupValue: {\n immediate: true,\n handler (newRadioGroupValue) {\n if (this.hasGroup) {\n // update internal value when the radio group value changes\n this.internalChecked = newRadioGroupValue === this.value;\n }\n },\n },\n },\n\n methods: {\n removeClassStyleAttrs,\n addClassStyleAttrs,\n emitValue (value) {\n if (value !== this.radioGroupValue) {\n // update provided value if injected\n this.setGroupValue(value);\n this.$emit('input', value);\n this.$emit('update:modelValue', value);\n }\n },\n },\n};\n</script>\n"],"mappings":"4YAsEA,IAAK,EAAU,CACb,aAAc,CAAE,KAAM,EAAG,CACzB,KAAM,UAEN,WAAY,CAAE,qBAAA,EAAA,QAAsB,CAEpC,OAAQ,CAAC,EAAA,WAAY,EAAA,eAAgB,EAAA,eAAgB,EAAA,cAAc,CAEnE,aAAc,GAEd,MAAO,CAIL,MAAO,CACL,KAAM,CAAC,OAAQ,OAAO,CACtB,QAAS,GACV,CACF,CAED,MAAO,CAOL,QAOA,oBAQA,QAQA,UAQA,WACD,CAED,MAAQ,CACN,MAAO,CACL,eAAA,EAAA,eACD,EAGH,SAAU,CACR,sBAAwB,CACtB,OAAO,EAAA,+BAA+B,KAAK,0BAG7C,iBAAmB,CACjB,OAAO,KAAK,cAAc,eAG5B,gBAAkB,CAChB,MAAO,CAML,UAAa,GACb,QAAS,GAAS,KAAK,MAAM,UAAW,EAAM,CAC9C,SAAU,GAAS,KAAK,MAAM,WAAY,EAAM,CAChD,OAAQ,GAAS,KAAK,UAAU,EAAM,OAAO,MAAM,CACpD,EAGH,aAAe,CACb,OAAO,KAAK,kBAAkB,QAAU,KAAK,cAEhD,CAED,MAAO,CACL,gBAAiB,CACf,UAAW,GACX,QAAS,EAAoB,CACvB,KAAK,WAEP,KAAK,gBAAkB,IAAuB,KAAK,QAGxD,CACF,CAED,QAAS,CACP,sBAAA,EAAA,sBACA,mBAAA,EAAA,mBACA,UAAW,EAAO,CACZ,IAAU,KAAK,kBAEjB,KAAK,cAAc,EAAM,CACzB,KAAK,MAAM,QAAS,EAAM,CAC1B,KAAK,MAAM,oBAAqB,EAAM,GAG3C,CACF,IAvLU,MAAM,iBAAgB,kDAuB3B,MAAM,oBACN,UAAQ,8JAqBN,OAAA,EAAA,EAAA,YAAA,CAjDH,MAAO,EAAA,UAAS,CACT,EAAA,mBAAmB,EAAA,OAAM,CAAA,CAAA,EAAA,EAAA,EAAA,oBAuBzB,QAAA,CArBA,OAAA,EAAA,EAAA,gBAAK,CAAA,gBAAA,CAAA,0BAAiD,EAAA,iBAAgB,CAAA,CAAA,CAAA,CAAA,EAAA,EAAA,EAAA,oBAYtE,MAXN,EAWM,EAAA,EAAA,EAAA,oBADH,SAAA,EAAA,EAAA,YAAA,CARE,QAAS,EAAA,gBACT,KAAM,EAAA,aACN,MAAO,EAAA,MACP,SAAU,EAAA,iBACX,KAAK,QACJ,MAAK,CAAA,UAAc,EAAA,qBAAsB,EAAA,WAAU,EAC5C,EAAA,sBAAsB,EAAA,OAAM,EAAA,EAAA,EAAA,YACf,EAAf,eAAc,GAAA,CAAA,CAAA,KAAA,GAAA,EAAA,CAAA,CAAA,EAAA,EAAA,EAAA,oBAUlB,OAAA,EAAA,EAAA,YAAA,CANH,MAAK,CAAG,EAAA,WAAU,+BAAA,CAAA,CACX,EAAA,gBAAe,CACvB,UAAQ,cAAa,CAAA,CAAA,EAAA,EAAA,EAAA,YAGG,EAAA,OAAA,UAAA,EAAA,KAAA,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBAAf,EAAA,MAAK,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,CAAA,EAAA,CAIV,EAAA,OAAO,aAAe,EAAA,aAAe,EAAA,cAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBAsBvC,MAvBN,EAuBM,CAjBI,EAAA,OAAO,aAAe,EAAA,cAAA,EAAA,EAAA,YAAA,EAAA,EAAA,EAAA,oBASxB,OAAA,EAAA,EAAA,YAAA,OARH,MAAK,CAAA,gBAAoB,EAAA,iBAAgB,EAClC,EAAA,sBAAqB,CAC7B,UAAQ,oBAAmB,CAAA,CAAA,EAAA,EAAA,EAAA,YAKpB,EAAA,OAAA,cAAA,EAAA,KAAA,EAAA,EAAA,EAAA,kBAAA,EAAA,EAAA,iBADF,EAAA,YAAW,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,GAAA,GAAA,EAAA,EAAA,oBAAA,GAAA,GAAA,EAAA,EAAA,EAAA,aAShB,GAAA,EAAA,EAAA,YAAA,CALC,sBAAqB,EAAA,kBACrB,gBAAe,EAAA,aACf,MAAO,EAAA,eACA,EAAA,mBAAkB,CAC1B,UAAQ,+BAA8B,CAAA,CAAA,KAAA,GAAA,CAAA,sBAAA,gBAAA,QAAA,CAAA,CAAA,CAAA,GAAA,EAAA,EAAA,oBAAA,GAAA,GAAA,CAAA,CAAA,GAAA"}

package/dist/lib/radio/radio.js CHANGED Viewed

@@ -1,70 +1,38 @@
-import { VALIDATION_MESSAGE_TYPES as e } from "../../common/constants/index.js";
-import { getUniqueString as t, getValidationState as n, hasSlotContent as r, removeClassStyleAttrs as i } from "../../common/utils/index.js";
-import { CheckableMixin as a, GroupableMixin as o, InputMixin as s, MessagesMixin as c } from "../../common/mixins/input.js";
-import { t as l } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
-import u from "../validation-messages/validation-messages.js";
-import { TEXT_SIZE_MODIFIERS as d, TEXT_STRENGTH_MODIFIERS as f } from "../text/text-constants.js";
-import p from "../text/text.js";
-import { RADIO_INPUT_VALIDATION_CLASSES as m } from "./radio-constants.js";
-import { createBlock as h, createCommentVNode as g, createElementBlock as _, createElementVNode as v, createTextVNode as y, createVNode as b, mergeProps as x, normalizeClass as S, normalizeStyle as C, openBlock as w, renderSlot as T, resolveComponent as E, toDisplayString as D, toHandlers as O, withCtx as k } from "vue";
-//#region components/Radio/Radio.vue
-var A = {
+import { addClassStyleAttrs as e, hasSlotContent as t, removeClassStyleAttrs as n } from "../../common/utils/index.js";
+import { CheckableMixin as r, GroupableMixin as i, InputMixin as a, MessagesMixin as o } from "../../common/mixins/input.js";
+import { t as s } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
+import c from "../validation-messages/validation-messages.js";
+import { RADIO_INPUT_VALIDATION_CLASSES as l } from "./radio-constants.js";
+import { createCommentVNode as u, createElementBlock as d, createElementVNode as f, createTextVNode as p, createVNode as m, mergeProps as h, normalizeClass as g, openBlock as _, renderSlot as v, resolveComponent as y, toDisplayString as b, toHandlers as x } from "vue";
+//#region components/radio/radio.vue
+var S = {
+	compatConfig: { MODE: 3 },
 	name: "DtRadio",
-	components: {
-		DtValidationMessages: u,
-		DtText: p
-	},
+	components: { DtValidationMessages: c },
 	mixins: [
-		s,
 		a,
-		o,
-		c
+		r,
+		i,
+		o
 	],
 	inheritAttrs: !1,
-	props: {
-		value: {
-			type: [String, Number],
-			default: ""
-		},
-		showLabel: {
-			type: Boolean,
-			default: !0
-		},
-		labelSize: {
-			type: [String, Number],
-			default: null,
-			validator: (e) => d.label.includes(String(e))
-		},
-		labelStrength: {
-			type: String,
-			default: null,
-			validator: (e) => Object.keys(f).includes(e)
-		}
-	},
+	props: { value: {
+		type: [String, Number],
+		default: ""
+	} },
 	emits: [
+		"input",
 		"update:modelValue",
 		"focus",
 		"focusin",
 		"focusout"
 	],
 	data() {
-		return {
-			hasSlotContent: r,
-			messagesId: t()
-		};
+		return { hasSlotContent: t };
 	},
 	computed: {
-		hasLabelContent() {
-			return !!(this.$slots.default || this.label);
-		},
-		hasLabel() {
-			return this.showLabel && this.hasLabelContent;
-		},
-		resolvedLabelSize() {
-			return this.labelSize ?? 300;
-		},
 		inputValidationClass() {
-			return m[this.internalValidationState];
+			return l[this.internalValidationState];
 		},
 		radioGroupValue() {
 			return this.groupContext?.selectedValue;
@@ -79,12 +47,6 @@ var A = {
 		},
 		hasMessages() {
 			return this.formattedMessages.length && this.showMessages;
-		},
-		ariaInvalid() {
-			return n(this.formattedMessages) === e.CRITICAL ? "true" : void 0;
-		},
-		ariaDescribedBy() {
-			return this.showMessages && this.formattedMessages.length > 0 ? this.messagesId : void 0;
 		}
 	},
 	watch: { radioGroupValue: {
@@ -93,36 +55,26 @@ var A = {
 			this.hasGroup && (this.internalChecked = e === this.value);
 		}
 	} },
-	mounted() {
-		this.runValidations();
-	},
 	methods: {
-		removeClassStyleAttrs: i,
-		runValidations() {
-			!this.hasLabelContent && !this.$attrs["aria-label"] && console.info("[Dialtone] A label is required for accessibility. Provide a label prop and use show-label=\"false\" to hide it visually.");
-		},
+		removeClassStyleAttrs: n,
+		addClassStyleAttrs: e,
 		emitValue(e) {
-			e !== this.radioGroupValue && (this.setGroupValue(e), this.$emit("update:modelValue", e));
+			e !== this.radioGroupValue && (this.setGroupValue(e), this.$emit("input", e), this.$emit("update:modelValue", e));
 		}
 	}
-}, j = { class: "d-radio__input" }, M = [
+}, C = { class: "d-radio__input" }, w = [
 	"checked",
 	"name",
 	"value",
-	"disabled",
-	"aria-label",
-	"aria-invalid",
-	"aria-describedby"
-], N = {
+	"disabled"
+], T = {
+	key: 0,
 	class: "d-radio__messages",
 	"data-qa": "radio-description-messages"
 };
-function P(e, t, n, r, i, a) {
-	let o = E("dt-text"), s = E("dt-validation-messages");
-	return w(), _("div", {
-		class: S(e.$attrs.class),
-		style: C(e.$attrs.style)
-	}, [v("label", { class: S(["d-radio-group", { "d-radio-group--disabled": e.internalDisabled }]) }, [v("div", j, [v("input", x({
+function E(e, t, n, r, i, a) {
+	let o = y("dt-validation-messages");
+	return _(), d("div", h({ class: e.rootClass }, a.addClassStyleAttrs(e.$attrs)), [f("label", { class: g(["d-radio-group", { "d-radio-group--disabled": e.internalDisabled }]) }, [f("div", C, [f("input", h({
 		checked: e.internalChecked,
 		name: e.internalName,
 		value: n.value,
@@ -132,51 +84,22 @@ function P(e, t, n, r, i, a) {
 			"d-radio",
 			a.inputValidationClass,
 			e.inputClass
-		],
-		"aria-label": !n.showLabel && e.label ? e.label : void 0,
-		"aria-invalid": a.ariaInvalid,
-		"aria-describedby": a.ariaDescribedBy
-	}, a.removeClassStyleAttrs(e.$attrs), O(a.inputListeners, !0)), null, 16, M)]), a.hasLabel ? (w(), h(o, x({
-		key: 0,
-		as: "div",
-		kind: "label",
-		size: a.resolvedLabelSize,
-		strength: n.labelStrength ?? "normal",
-		tone: e.internalDisabled ? "disabled" : "primary",
-		class: [e.labelClass, "d-radio__copy d-radio__label"]
-	}, e.labelChildProps, { "data-qa": "radio-label" }), {
-		default: k(() => [T(e.$slots, "default", {}, () => [y(D(e.label), 1)])]),
-		_: 3
-	}, 16, [
-		"size",
-		"strength",
-		"tone",
-		"class"
-	])) : g("", !0)], 2), v("div", N, [e.$slots.description || e.description ? (w(), h(o, x({
+		]
+	}, a.removeClassStyleAttrs(e.$attrs), x(a.inputListeners, !0)), null, 16, w)]), f("div", h({ class: [e.labelClass, "d-radio__copy d-radio__label"] }, e.labelChildProps, { "data-qa": "radio-label" }), [v(e.$slots, "default", {}, () => [p(b(e.label), 1)])], 16)], 2), e.$slots.description || e.description || a.hasMessages ? (_(), d("div", T, [e.$slots.description || e.description ? (_(), d("div", h({
 		key: 0,
-		kind: "body",
-		size: 200,
-		tone: "tertiary",
-		as: "div",
 		class: ["d-description", e.descriptionClass]
-	}, e.descriptionChildProps, { "data-qa": "radio-description" }), {
-		default: k(() => [T(e.$slots, "description", {}, () => [y(D(e.description), 1)])]),
-		_: 3
-	}, 16, ["class"])) : g("", !0), b(s, x(e.messagesChildProps, {
-		id: i.messagesId,
+	}, e.descriptionChildProps, { "data-qa": "radio-description" }), [v(e.$slots, "description", {}, () => [p(b(e.description), 1)])], 16)) : u("", !0), m(o, h({
 		"validation-messages": e.formattedMessages,
 		"show-messages": e.showMessages,
-		class: e.messagesClass,
-		"data-qa": "dt-radio-validation-messages"
-	}), null, 16, [
-		"id",
+		class: e.messagesClass
+	}, e.messagesChildProps, { "data-qa": "dt-radio-validation-messages" }), null, 16, [
 		"validation-messages",
 		"show-messages",
 		"class"
-	])])], 6);
+	])])) : u("", !0)], 16);
 }
-var F = /* @__PURE__ */ l(A, [["render", P]]);
+var D = /* @__PURE__ */ s(S, [["render", E]]);
 //#endregion
-export { F as default };
+export { D as default };
 //# sourceMappingURL=radio.js.map

package/dist/lib/radio/radio.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"radio.js","names":[],"sources":["../../../components/~~Radio~~/~~Radio~~.vue"],"sourcesContent":["<template>\n <div\n :class=\"~~$attrs.class~~\"\n ~~:style~~=\"$attrs~~.style~~\"\n >\n <label :class=\"['d-radio-group', { 'd-radio-group--disabled': internalDisabled }]\">\n <div class=\"d-radio__input\">\n <input\n :checked=\"internalChecked\"\n :name=\"internalName\"\n :value=\"value\"\n :disabled=\"internalDisabled\"\n type=\"radio\"\n :class=\"['d-radio', inputValidationClass, inputClass]\"\n ~~:aria-label=\"!showLabel && label ? label : undefined\"\n :aria-invalid=\"ariaInvalid\"\n :aria-describedby=\"ariaDescribedBy\"\n~~ v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"inputListeners\"\n >\n </div>\n <~~dt-text\n v-if=\"hasLabel\"\n as=\"~~div\"\n ~~kind=\"label\"\n~~ :~~size=\"resolvedLabelSize\"\n :strength=\"labelStrength ?? 'normal'\"\n :tone=\"internalDisabled ? 'disabled' : 'primary'\"\n :~~class=\"[labelClass, 'd-radio__copy d-radio__label']\"\n v-bind=\"labelChildProps\"\n data-qa=\"radio-label\"\n >\n <!-- @slot slot for Radio Label -->\n <slot>{{ label }}</slot>\n </~~dt-text~~>\n </label>\n <div\n class=\"d-radio__messages\"\n data-qa=\"radio-description-messages\"\n >\n <~~dt-text~~\n v-if=\"$slots.description \|\| description\"\n ~~kind=\"body\"\n~~ :~~size=\"200\"\n tone=\"tertiary\"\n as=\"div\"\n :~~class=\"['d-description', descriptionClass]\"\n v-bind=\"descriptionChildProps\"\n data-qa=\"radio-description\"\n >\n <!-- @slot slot for Radio Description -->\n <slot name=\"description\">\n {{ description }}\n </slot>\n </~~dt-text~~>\n <dt-validation-messages\n ~~v-bind=\"messagesChildProps\"\n~~ :~~id=\"messagesId\"\n :~~validation-messages=\"formattedMessages\"\n :show-messages=\"showMessages\"\n :class=\"messagesClass\"\n data-qa=\"dt-radio-validation-messages\"\n />\n </div>\n </div>\n</template>\n\n<script>\nimport {\n InputMixin,\n CheckableMixin,\n GroupableMixin,\n MessagesMixin,\n} from '@/common/mixins/input';\nimport { RADIO_INPUT_VALIDATION_CLASSES } from './~~RadioConstants~~';\nimport { DtValidationMessages } from '../~~ValidationMessages~~';\nimport { ~~DtText, TEXT_SIZE_MODIFIERS, TEXT_STRENGTH_MODIFIERS } from '@/components/Text';\nimport {~~ hasSlotContent, removeClassStyleAttrs, ~~getUniqueString,~~ ~~getValidationState~~ } from '@/common/utils';\~~nimport { VALIDATION_MESSAGE_TYPES } from '@/common/constants';\~~n\n/*\n Radios are control elements that allow the user to make a single selection.\n * They are typically used in a Radio Group which allows the user to make a selection from a list of options.\n * @see https://dialtone.dialpad.com/components/radio.html\n /\nexport default {\n name: 'DtRadio',\n\n components: { DtValidationMessages, ~~DtText~~ },\n\n mixins: [InputMixin, CheckableMixin, GroupableMixin, MessagesMixin],\n\n inheritAttrs: false,\n\n props: {\n /\n A provided value for the radio\n /\n value: {\n type: [String, Number],\n default: '',\n },\n\n ~~/\n Determines visibility of radio label.\n * @values true, false~~\n /\n showLabel: {\n ~~type: Boolean,\n default: true,\n~~ ~~},\n\n~~ /\n ~~Overrides~~ ~~the~~ ~~label text size.\~~n * @~~values~~ ~~100, 200, 300, 400~~\n /\n labelSize: ~~{\n~~ type: [String, Number~~],\n default: null,\n validator: (s) => TEXT_SIZE_MODIFIERS.label.includes(String(s)),\n~~ }~~,\n~~\n ~~/\n~~ Overrides the label font weight.\n * @values bold, semibold, medium, normal\n /\n ~~labelStrength: {\n type: String~~,\n ~~default: null,\n validator: (s) => Object.keys(TEXT_STRENGTH_MODIFIERS).includes(s),\n~~ ~~},\n },\n\n emits: [\n~~ /\n Event fired to sync the modelValue prop with the parent component\n \n @event ~~update:modelValue~~\n * @type {String \| Number}\n /\n 'update:modelValue',\n\n /\n Native input focus event\n \n @event focus\n * @type {FocusEvent}\n /\n 'focus',\n\n /\n Native input focusin event\n \n @event focusin\n * @property {FocusEvent}\n /\n 'focusin',\n\n /\n Native input focusout event\n \n @event focusout\n * @property {FocusEvent}\n /\n 'focusout',\n ],\n\n data () {\n return {\n hasSlotContent,\n ~~messagesId: getUniqueString(),\n~~ };\n },\n\n computed: {\n hasLabelContent () {\n return !!(this.$slots.default \|\| this.label);\n },\n\n hasLabel () {\n return this.showLabel && this.hasLabelContent;\n },\n\n resolvedLabelSize () {\n return this.labelSize ?? 300;\n },\n\n inputValidationClass () {\n return RADIO_INPUT_VALIDATION_CLASSES[this.internalValidationState];\n },\n\n radioGroupValue () {\n return this.groupContext?.selectedValue;\n },\n\n inputListeners () {\n return {\n /\n * Override input listener to as no-op. Prevents parent input listeners from being passed through onto the input\n * element which will result in the handler being called twice\n * (once on the input element and once by the emitted input event by the change listener).\n */\n input: () => {},\n focusin: event => this.$emit('focusin', event),\n focusout: event => this.$emit('focusout', event),\n change: event => this.emitValue(event.target.value),\n };\n },\n\n hasMessages () {\n return this.formattedMessages.length && this.showMessages;\n },\n\n ariaInvalid () {\n return getValidationState(this.formattedMessages) === VALIDATION_MESSAGE_TYPES.CRITICAL ? 'true' : undefined;\n },\n\n ariaDescribedBy () {\n return this.showMessages && this.formattedMessages.length > 0 ? this.messagesId : undefined;\n },\n },\n\n watch: {\n radioGroupValue: {\n immediate: true,\n handler (newRadioGroupValue) {\n if (this.hasGroup) {\n // update internal value when the radio group value changes\n this.internalChecked = newRadioGroupValue === this.value;\n }\n },\n },\n },\n\n ~~mounted () {\n this.runValidations();\n },\n\n~~ methods: {\n removeClassStyleAttrs,\n\n runValidations () {\n if (!this.hasLabelContent && !this.$attrs['aria-label']) {\n console.info(\n '[Dialtone] A label is required for accessibility. Provide a label prop and use show-label=\"false\" to hide it visually.',\n ~~);\n }\n~~ ~~},\n\n~~ emitValue (value) {\n if (value !== this.radioGroupValue) {\n // update provided value if injected\n this.setGroupValue(value);\n this.$emit('update:modelValue', value);\n }\n },\n },\n};\n</script>\n"],"mappings":"~~;;;;;;;;;;AAqFA~~,IAAK,IAAU;CACb,MAAM;CAEN,YAAY;EAAE,sBAAA~~;EAAsB~~,~~QAAA~~;~~EAAQ;CAE5C~~,QAAQ;EAAC;EAAY;EAAgB;EAAgB;EAAc;CAEnE,cAAc;CAEd,OAAO;EAIL,OAAO;~~GACL~~,MAAM,CAAC,QAAQ,OAAO;~~GACtB~~,SAAS;~~GACV;EAMD~~,WAAW;GACT,MAAM;GACN,SAAS;GACV;EAMD,WAAW;GACT,MAAM,CAAC,QAAQ,OAAO;GACtB,SAAS;GACT,YAAY,MAAM,EAAoB,MAAM,SAAS,OAAO,EAAE,CAAC;GAChE;EAMD,eAAe;GACb,MAAM;GACN,SAAS;GACT,YAAY,MAAM,OAAO,KAAK,EAAwB,CAAC,SAAS,EAAE;GACnE;EACF;CAED,OAAO;EAOL;EAQA;EAQA;EAQA;EACD;CAED,OAAQ;AACN,SAAO~~;GACL;GACA~~,~~YAAY~~,~~GAAiB;GAC9B~~;;CAGH,UAAU;EACR,~~kBAAmB;AACjB,UAAO,CAAC,EAAE,KAAK,OAAO,WAAW,KAAK;;EAGxC,WAAY;AACV,UAAO,KAAK,aAAa,KAAK;;EAGhC,oBAAqB;AACnB,UAAO,KAAK,aAAa;;EAG3B,~~uBAAwB;AACtB,UAAO,EAA+B,KAAK;;EAG7C,kBAAmB;AACjB,UAAO,KAAK,cAAc;;EAG5B,iBAAkB;AAChB,UAAO;IAML,aAAa;IACb,UAAS,MAAS,KAAK,MAAM,WAAW,EAAM;IAC9C,WAAU,MAAS,KAAK,MAAM,YAAY,EAAM;IAChD,SAAQ,MAAS,KAAK,UAAU,EAAM,OAAO,MAAM;IACpD;;EAGH,cAAe;AACb,UAAO,KAAK,kBAAkB,UAAU,KAAK;;~~EAG/C,cAAe~~;~~AACb,UAAO,EAAmB,KAAK,kBAAiB,KAAM,EAAyB,WAAW,SAAS,KAAA;;EAGrG,kBAAmB;AACjB,UAAO,KAAK,gBAAgB,KAAK,kBAAkB,SAAS,IAAI,KAAK,aAAa,KAAA;;EAErF;~~CAED,OAAO,EACL,iBAAiB;EACf,WAAW;EACX,QAAS,GAAoB;AAC3B,GAAI,KAAK,aAEP,KAAK,kBAAkB,MAAuB,KAAK;;EAGxD,EACF;CAED,~~UAAW;AACT,OAAK,gBAAgB;;CAGvB,~~SAAS;EACP;~~EAEA,iBAAkB~~;~~AAChB~~,~~GAAI,CAAC,KAAK,mBAAmB,CAAC,KAAK,OAAO,iBACxC,QAAQ,KACN,2HACD;;EAIL,~~UAAW,GAAO;AAChB,GAAI,MAAU,KAAK,oBAEjB,KAAK,cAAc,EAAM,EACzB,KAAK,MAAM,qBAAqB,EAAM;;EAG3C;CACF,~~QA3PU~~,OAAM,kBAAgB~~;;;;;;;;;CA+B3B~~,OAAM;CACN,WAAQ;;;;~~aArCZ~~,~~EA+DM~~,~~OAAA;EA9DH~~,~~OAAK~~,~~EAAE~~,EAAA,~~OAAO~~,~~MAAK;EACnB~~,~~OAAK~~,~~EAAE~~,EAAA,~~OAAO~~,~~MAAK;KAEpB~~,~~EA8BQ~~,SAAA,~~EA9BA~~,OAAK,EAAA,CAAA,iBAAA,EAAA,2BAAiD,EAAA,kBAAgB,CAAA,CAAA,EAAA,EAAA,CAC5E,~~EAcM~~,~~OAdN~~,~~GAcM~~,~~CAbJ~~,~~EAYC~~,~~SAZD~~,~~EAYC~~;~~EAXE~~,SAAS,EAAA;EACT,MAAM,EAAA;EACN,OAAO,EAAA;EACP,UAAU,EAAA;EACX,MAAK;EACJ,OAAK;GAAA;GAAc,EAAA;GAAsB,EAAA;GAAU;~~EACnD~~,~~cAAU,CAAG,~~EAAA,~~aAAa,EAAA,QAAQ,EAAA,QAAQ,KAAA;EAC1C,gBAAc,EAAA;EACd,oBAAkB,EAAA;IACX,EAAA,~~sBAAsB,EAAA,OAAM,EACpC,EAAqB,EAAf,gBAAc,GAAA,CAAA,EAAA,MAAA,IAAA,EAAA,CAAA,CAAA,~~EAIhB~~,~~EAAA~~,~~YAAA~~,~~GAAA~~,~~EADR~~,~~EAaU,GAbV,EAaU;;EAXR,IAAG;EACH,MAAK;EACJ,MAAM,EAAA;EACN,UAAU,EAAA,iBAAa;EACvB,MAAM,EAAA,mBAAgB,aAAA;EACtB,~~OAAK,CAAG,EAAA,YAAU,+BAAA~~;IACX~~,EAAA,iBAAe,EACvB,WAAQ,eAAa,CAAA,EAAA~~;mBAGG~~,~~CAAxB~~,EAAwB,EAAA,QAAA,WAAA,EAAA,QAAA,CAAA,EAAA,EAAf,EAAA,MAAK,EAAA,EAAA,CAAA,CAAA,CAAA,CAAA~~;;;;;;;uBAGlB~~,~~EA2BM~~,~~OA3BN~~,~~GA2BM~~,~~CAtBI,~~EAAA,OAAO,eAAe,EAAA,eAAA,GAAA,~~EAD9B~~,~~EAcU~~,~~GAdV~~,~~EAcU;;EAZR~~,~~MAAK;EACJ~~,~~MAAM;EACP~~,~~MAAK;EACL~~,~~IAAG;EACF~~,OAAK,CAAA,iBAAoB,EAAA,iBAAgB;IAClC,EAAA,uBAAqB,EAC7B,WAAQ,qBAAmB,CAAA,EAAA~~;mBAKpB~~,~~CAFP~~,EAEO,EAAA,QAAA,eAAA,EAAA,QAAA,CAAA,EAAA,EADF,EAAA,YAAW,EAAA,EAAA,CAAA,CAAA,CAAA,~~CAAA;;iCAGlB~~,~~EAOE~~,~~GAPF~~,~~EAOE~~,~~EANQ~~,~~oBAAkB;EACzB~~,~~IAAI~~,~~EAAA~~;~~EACJ~~,uBAAqB,EAAA;EACrB,iBAAe,EAAA;EACf,OAAO,EAAA;~~EACR~~,WAAQ"}
1	+ {"version":3,"file":"radio.js","names":[],"sources":["../../../components/radio/radio.vue"],"sourcesContent":["<template>\n <div\n :class=\"rootClass\"\n v-bind=\"addClassStyleAttrs($attrs)\"\n >\n <label :class=\"['d-radio-group', { 'd-radio-group--disabled': internalDisabled }]\">\n <div class=\"d-radio__input\">\n <input\n :checked=\"internalChecked\"\n :name=\"internalName\"\n :value=\"value\"\n :disabled=\"internalDisabled\"\n type=\"radio\"\n :class=\"['d-radio', inputValidationClass, inputClass]\"\n v-bind=\"removeClassStyleAttrs($attrs)\"\n v-on=\"inputListeners\"\n >\n </div>\n <div\n :class=\"[labelClass, 'd-radio__copy d-radio__label']\"\n v-bind=\"labelChildProps\"\n data-qa=\"radio-label\"\n >\n <!-- @slot slot for Radio Label -->\n <slot>{{ label }}</slot>\n </div>\n </label>\n <div\n v-if=\"$slots.description \|\| description \|\| hasMessages\"\n class=\"d-radio__messages\"\n data-qa=\"radio-description-messages\"\n >\n <div\n v-if=\"$slots.description \|\| description\"\n :class=\"['d-description', descriptionClass]\"\n v-bind=\"descriptionChildProps\"\n data-qa=\"radio-description\"\n >\n <!-- @slot slot for Radio Description -->\n <slot name=\"description\">\n {{ description }}\n </slot>\n </div>\n <dt-validation-messages\n :validation-messages=\"formattedMessages\"\n :show-messages=\"showMessages\"\n :class=\"messagesClass\"\n v-bind=\"messagesChildProps\"\n data-qa=\"dt-radio-validation-messages\"\n />\n </div>\n </div>\n</template>\n\n<script>\nimport {\n InputMixin,\n CheckableMixin,\n GroupableMixin,\n MessagesMixin,\n} from '@/common/mixins/input';\nimport { RADIO_INPUT_VALIDATION_CLASSES } from './radio_constants';\nimport { DtValidationMessages } from '../validation_messages';\nimport { hasSlotContent, removeClassStyleAttrs, addClassStyleAttrs } from '@/common/utils';\n\n/*\n Radios are control elements that allow the user to make a single selection.\n * They are typically used in a Radio Group which allows the user to make a selection from a list of options.\n * @see https://dialtone.dialpad.com/components/radio.html\n /\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtRadio',\n\n components: { DtValidationMessages },\n\n mixins: [InputMixin, CheckableMixin, GroupableMixin, MessagesMixin],\n\n inheritAttrs: false,\n\n props: {\n /\n A provided value for the radio\n /\n value: {\n type: [String, Number],\n default: '',\n },\n },\n\n emits: [\n /\n Native input event\n \n @event input\n * @type {String \| Number}\n /\n 'input',\n /\n Event fired to sync the modelValue prop with the parent component\n \n @event input\n * @type {String \| Number}\n /\n 'update:modelValue',\n\n /\n Native input focus event\n \n @event focus\n * @type {FocusEvent}\n /\n 'focus',\n\n /\n Native input focusin event\n \n @event focusin\n * @property {FocusEvent}\n /\n 'focusin',\n\n /\n Native input focusout event\n \n @event focusout\n * @property {FocusEvent}\n /\n 'focusout',\n ],\n\n data () {\n return {\n hasSlotContent,\n };\n },\n\n computed: {\n inputValidationClass () {\n return RADIO_INPUT_VALIDATION_CLASSES[this.internalValidationState];\n },\n\n radioGroupValue () {\n return this.groupContext?.selectedValue;\n },\n\n inputListeners () {\n return {\n /\n * Override input listener to as no-op. Prevents parent input listeners from being passed through onto the input\n * element which will result in the handler being called twice\n * (once on the input element and once by the emitted input event by the change listener).\n */\n input: () => {},\n focusin: event => this.$emit('focusin', event),\n focusout: event => this.$emit('focusout', event),\n change: event => this.emitValue(event.target.value),\n };\n },\n\n hasMessages () {\n return this.formattedMessages.length && this.showMessages;\n },\n },\n\n watch: {\n radioGroupValue: {\n immediate: true,\n handler (newRadioGroupValue) {\n if (this.hasGroup) {\n // update internal value when the radio group value changes\n this.internalChecked = newRadioGroupValue === this.value;\n }\n },\n },\n },\n\n methods: {\n removeClassStyleAttrs,\n addClassStyleAttrs,\n emitValue (value) {\n if (value !== this.radioGroupValue) {\n // update provided value if injected\n this.setGroupValue(value);\n this.$emit('input', value);\n this.$emit('update:modelValue', value);\n }\n },\n },\n};\n</script>\n"],"mappings":";;;;;;;AAsEA,IAAK,IAAU;CACb,cAAc,EAAE,MAAM,GAAG;CACzB,MAAM;CAEN,YAAY,EAAE,sBAAA,GAAsB;CAEpC,QAAQ;EAAC;EAAY;EAAgB;EAAgB;EAAc;CAEnE,cAAc;CAEd,OAAO,EAIL,OAAO;EACL,MAAM,CAAC,QAAQ,OAAO;EACtB,SAAS;EACV,EACF;CAED,OAAO;EAOL;EAOA;EAQA;EAQA;EAQA;EACD;CAED,OAAQ;AACN,SAAO,EACL,mBACD;;CAGH,UAAU;EACR,uBAAwB;AACtB,UAAO,EAA+B,KAAK;;EAG7C,kBAAmB;AACjB,UAAO,KAAK,cAAc;;EAG5B,iBAAkB;AAChB,UAAO;IAML,aAAa;IACb,UAAS,MAAS,KAAK,MAAM,WAAW,EAAM;IAC9C,WAAU,MAAS,KAAK,MAAM,YAAY,EAAM;IAChD,SAAQ,MAAS,KAAK,UAAU,EAAM,OAAO,MAAM;IACpD;;EAGH,cAAe;AACb,UAAO,KAAK,kBAAkB,UAAU,KAAK;;EAEhD;CAED,OAAO,EACL,iBAAiB;EACf,WAAW;EACX,QAAS,GAAoB;AAC3B,GAAI,KAAK,aAEP,KAAK,kBAAkB,MAAuB,KAAK;;EAGxD,EACF;CAED,SAAS;EACP;EACA;EACA,UAAW,GAAO;AAChB,GAAI,MAAU,KAAK,oBAEjB,KAAK,cAAc,EAAM,EACzB,KAAK,MAAM,SAAS,EAAM,EAC1B,KAAK,MAAM,qBAAqB,EAAM;;EAG3C;CACF,QAvLU,OAAM,kBAAgB;;;;;;;CAuB3B,OAAM;CACN,WAAQ;;;;aA7BZ,EAkDM,OAlDN,EAkDM,EAjDH,OAAO,EAAA,WAAS,EACT,EAAA,mBAAmB,EAAA,OAAM,CAAA,EAAA,CAEjC,EAqBQ,SAAA,EArBA,OAAK,EAAA,CAAA,iBAAA,EAAA,2BAAiD,EAAA,kBAAgB,CAAA,CAAA,EAAA,EAAA,CAC5E,EAWM,OAXN,GAWM,CAVJ,EASC,SATD,EASC;EARE,SAAS,EAAA;EACT,MAAM,EAAA;EACN,OAAO,EAAA;EACP,UAAU,EAAA;EACX,MAAK;EACJ,OAAK;GAAA;GAAc,EAAA;GAAsB,EAAA;GAAU;IAC5C,EAAA,sBAAsB,EAAA,OAAM,EACpC,EAAqB,EAAf,gBAAc,GAAA,CAAA,EAAA,MAAA,IAAA,EAAA,CAAA,CAAA,EAGxB,EAOM,OAPN,EAOM,EANH,OAAK,CAAG,EAAA,YAAU,+BAAA,EAAA,EACX,EAAA,iBAAe,EACvB,WAAQ,eAAa,CAAA,EAAA,CAGrB,EAAwB,EAAA,QAAA,WAAA,EAAA,QAAA,CAAA,EAAA,EAAf,EAAA,MAAK,EAAA,EAAA,CAAA,CAAA,CAAA,EAAA,GAAA,CAAA,EAAA,EAAA,EAIV,EAAA,OAAO,eAAe,EAAA,eAAe,EAAA,eAAA,GAAA,EAD7C,EAuBM,OAvBN,GAuBM,CAjBI,EAAA,OAAO,eAAe,EAAA,eAAA,GAAA,EAD9B,EAUM,OAVN,EAUM;;EARH,OAAK,CAAA,iBAAoB,EAAA,iBAAgB;IAClC,EAAA,uBAAqB,EAC7B,WAAQ,qBAAmB,CAAA,EAAA,CAG3B,EAEO,EAAA,QAAA,eAAA,EAAA,QAAA,CAAA,EAAA,EADF,EAAA,YAAW,EAAA,EAAA,CAAA,CAAA,CAAA,EAAA,GAAA,IAAA,EAAA,IAAA,GAAA,EAGlB,EAME,GANF,EAME;EALC,uBAAqB,EAAA;EACrB,iBAAe,EAAA;EACf,OAAO,EAAA;IACA,EAAA,oBAAkB,EAC1B,WAAQ,gCAA8B,CAAA,EAAA,MAAA,IAAA;EAAA;EAAA;EAAA;EAAA,CAAA,CAAA,CAAA,IAAA,EAAA,IAAA,GAAA,CAAA,EAAA,GAAA"}

package/dist/lib/radio-group/radio-group.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e={name:`DtRadioGroup`,extends:require(`../input-group/input-group.cjs`).default,props:{modelValue:{type:[String,Number],default:``},dataQaGroup:{type:String,default:`radio-group`},dataQaGroupLegend:{type:String,default:`radio-group-legend`},dataQaGroupMessages:{type:String,default:`radio-group-messages`}},emits:[`update:modelValue`],data(){return{internalValue:this.modelValue}},watch:{modelValue(e){this.internalValue=e},internalValue:{immediate:!0,handler(e){this.provideObj.selectedValue=e}}},methods:{setGroupValue(e){this.$emit(`update:modelValue`,e)},getMessageKey(e,t){return`radio-group-message-${e}-${t}-${this.id}`}}};exports.default=e;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e={compatConfig:{MODE:3},name:`DtRadioGroup`,extends:require(`../input-group/input-group.cjs`).default,props:{modelValue:{type:[String,Number],default:``},dataQaGroup:{type:String,default:`radio-group`},dataQaGroupLegend:{type:String,default:`radio-group-legend`},dataQaGroupMessages:{type:String,default:`radio-group-messages`}},emits:[`input`,`update:modelValue`],data(){return{internalValue:this.modelValue}},watch:{modelValue(e){this.internalValue=e},internalValue:{immediate:!0,handler(e){this.provideObj.selectedValue=e}}},methods:{setGroupValue(e){this.$emit(`input`,e),this.$emit(`update:modelValue`,e)},getMessageKey(e,t){return`radio-group-message-${e}-${t}-${this.id}`}}};exports.default=e;
 //# sourceMappingURL=radio-group.cjs.map

package/dist/lib/radio-group/radio-group.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"radio-group.cjs","names":[],"sources":["../../../components/~~RadioGroup~~/~~RadioGroup~~.vue"],"sourcesContent":["<script>\nimport { DtInputGroup } from '../~~InputGroup~~';\n\n/*\n Radio Groups are control elements that allow the user to make a single selection from a list of options.\n * @see https://dialtone.dialpad.com/components/radio_group.html\n /\nexport default {\n name: 'DtRadioGroup',\n\n extends: DtInputGroup,\n\n props: {\n /\n A provided value for the radio group\n /\n modelValue: {\n type: [String, Number],\n default: '',\n },\n\n /\n A data qa tag for the radio group\n /\n dataQaGroup: {\n type: String,\n default: 'radio-group',\n },\n\n /\n A data qa tag for the radio group legend\n /\n dataQaGroupLegend: {\n type: String,\n default: 'radio-group-legend',\n },\n\n /\n A data qa tag for the radio group messages\n /\n dataQaGroupMessages: {\n type: String,\n default: 'radio-group-messages',\n },\n },\n\n emits: [\n /\n ~~Event~~ ~~fired~~ to ~~sync~~ ~~the~~ ~~modelValue~~ ~~prop~~ ~~with~~ ~~the~~ ~~parent~~ ~~component~~\n \n @event ~~update:modelValue~~\n * @type {String \| Number}\n /\n 'update:modelValue',\n ],\n\n data () {\n return {\n internalValue: this.modelValue,\n };\n },\n\n watch: {\n modelValue (newValue) {\n this.internalValue = newValue;\n },\n\n /\n * watching value to support 2 way binding for slotted radios.\n * need this to pass value to slotted checkboxes if modified outside\n * radio group.\n /\n internalValue: {\n immediate: true,\n handler (newInternalValue) {\n this.provideObj.selectedValue = newInternalValue;\n },\n },\n },\n\n methods: {\n /\n * provided value to support 2 way binding for slotted radios.\n * slotted radios will change this value and need to emit new value up.\n */\n setGroupValue (newValue) {\n this.$emit('update:modelValue', newValue);\n },\n\n getMessageKey (type, index) {\n return `radio-group-message-${type}-${index}-${this.id}`;\n },\n },\n};\n</script>\n"],"mappings":"+FAOA,IAAK,EAAU,CACb,KAAM,eAEN,kDAAS,QAET,MAAO,~~CAIL~~,WAAY,CACV,KAAM,CAAC,OAAQ,OAAO,CACtB,QAAS,GACV,CAKD,YAAa,CACX,KAAM,OACN,QAAS,cACV,CAKD,kBAAmB,CACjB,KAAM,OACN,QAAS,qBACV,CAKD,oBAAqB,CACnB,KAAM,OACN,QAAS,uBACV,CACF,CAED,MAAO,CAOL,oBACD,CAED,MAAQ,CACN,MAAO,CACL,cAAe,KAAK,WACrB,EAGH,MAAO,CACL,WAAY,EAAU,CACpB,KAAK,cAAgB,GAQvB,cAAe,CACb,UAAW,GACX,QAAS,EAAkB,CACzB,KAAK,WAAW,cAAgB,GAEnC,CACF,CAED,QAAS,CAKP,cAAe,EAAU,CACvB,KAAK,MAAM,oBAAqB,EAAS,EAG3C,cAAe,EAAM,EAAO,CAC1B,MAAO,uBAAuB,EAAK,GAAG,EAAM,GAAG,KAAK,MAEvD,CACF"}
1	+ {"version":3,"file":"radio-group.cjs","names":[],"sources":["../../../components/radio_group/radio_group.vue"],"sourcesContent":["<script>\nimport { DtInputGroup } from '../input_group';\n\n/*\n Radio Groups are control elements that allow the user to make a single selection from a list of options.\n * @see https://dialtone.dialpad.com/components/radio_group.html\n /\nexport default {\n compatConfig: { MODE: 3 },\n name: 'DtRadioGroup',\n\n extends: DtInputGroup,\n\n props: {\n /\n A provided value for the radio group\n * @model value\n /\n modelValue: {\n type: [String, Number],\n default: '',\n },\n\n /\n A data qa tag for the radio group\n /\n dataQaGroup: {\n type: String,\n default: 'radio-group',\n },\n\n /\n A data qa tag for the radio group legend\n /\n dataQaGroupLegend: {\n type: String,\n default: 'radio-group-legend',\n },\n\n /\n A data qa tag for the radio group messages\n /\n dataQaGroupMessages: {\n type: String,\n default: 'radio-group-messages',\n },\n },\n\n emits: [\n /\n Native input event\n \n @event input\n * @type {String \| Number}\n /\n 'input',\n /\n Native input event\n \n @event input\n * @type {String \| Number}\n /\n 'update:modelValue',\n ],\n\n data () {\n return {\n internalValue: this.modelValue,\n };\n },\n\n watch: {\n modelValue (newValue) {\n this.internalValue = newValue;\n },\n\n /\n * watching value to support 2 way binding for slotted radios.\n * need this to pass value to slotted checkboxes if modified outside\n * radio group.\n /\n internalValue: {\n immediate: true,\n handler (newInternalValue) {\n this.provideObj.selectedValue = newInternalValue;\n },\n },\n },\n\n methods: {\n /\n * provided value to support 2 way binding for slotted radios.\n * slotted radios will change this value and need to emit new value up.\n */\n setGroupValue (newValue) {\n this.$emit('input', newValue);\n this.$emit('update:modelValue', newValue);\n },\n\n getMessageKey (type, index) {\n return `radio-group-message-${type}-${index}-${this.id}`;\n },\n },\n};\n</script>\n"],"mappings":"+FAOA,IAAK,EAAU,CACb,aAAc,CAAE,KAAM,EAAG,CACzB,KAAM,eAEN,kDAAS,QAET,MAAO,CAKL,WAAY,CACV,KAAM,CAAC,OAAQ,OAAO,CACtB,QAAS,GACV,CAKD,YAAa,CACX,KAAM,OACN,QAAS,cACV,CAKD,kBAAmB,CACjB,KAAM,OACN,QAAS,qBACV,CAKD,oBAAqB,CACnB,KAAM,OACN,QAAS,uBACV,CACF,CAED,MAAO,CAOL,QAOA,oBACD,CAED,MAAQ,CACN,MAAO,CACL,cAAe,KAAK,WACrB,EAGH,MAAO,CACL,WAAY,EAAU,CACpB,KAAK,cAAgB,GAQvB,cAAe,CACb,UAAW,GACX,QAAS,EAAkB,CACzB,KAAK,WAAW,cAAgB,GAEnC,CACF,CAED,QAAS,CAKP,cAAe,EAAU,CACvB,KAAK,MAAM,QAAS,EAAS,CAC7B,KAAK,MAAM,oBAAqB,EAAS,EAG3C,cAAe,EAAM,EAAO,CAC1B,MAAO,uBAAuB,EAAK,GAAG,EAAM,GAAG,KAAK,MAEvD,CACF"}