@dialpad/dialtone-vue 3.223.0-next.3 → 3.223.0-next.4

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

@@ -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";
+import { ordinalSizeValidator as e } from "../../common/validators/index.js";
+import { t } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
+import { PROGRESS_CIRCLE_KINDS as n, PROGRESS_CIRCLE_SIZES as r } from "./progress-circle-constants.js";
+import { createCommentVNode as i, createElementBlock as a, createElementVNode as o, normalizeClass as s, normalizeStyle as c, openBlock as l } from "vue";
 //#region components/ProgressCircle/ProgressCircle.vue
-var l = {
+var u = {
 	name: "DtProgressCircle",
 	props: {
 		ariaLabel: {
@@ -15,14 +16,14 @@ var l = {
 			validator: (e) => e >= 0 && e <= 100
 		},
 		size: {
-			type: String,
-			default: "500",
-			validator: (e) => Object.keys(n).includes(e)
+			type: [String, Number],
+			default: 500,
+			validator: e(r)
 		},
 		kind: {
 			type: String,
 			default: "default",
-			validator: (e) => Object.keys(t).includes(e)
+			validator: (e) => Object.keys(n).includes(e)
 		}
 	},
 	data() {
@@ -42,10 +43,10 @@ var l = {
 			return this.isAi ? { stroke: `url(#${this.aiGradientId})` } : {};
 		},
 		sizeClass() {
-			return n[this.size];
+			return r[this.size];
 		},
 		kindClass() {
-			return t[this.kind];
+			return n[this.kind];
 		},
 		circleRadius() {
 			return 12 - this.strokeWidth / 2;
@@ -68,10 +69,10 @@ var l = {
 			};
 		}
 	}
-}, u = ["aria-label", "aria-valuenow"], d = { key: 0 }, f = ["id"], p = ["d", "stroke-width"], m = ["d", "stroke-width"];
-function h(e, t, n, l, h, g) {
-	return c(), i("div", {
-		class: o(["d-progress-circle", [g.sizeClass, g.kindClass]]),
+}, d = ["aria-label", "aria-valuenow"], f = { key: 0 }, p = ["id"], m = ["d", "stroke-width"], h = ["d", "stroke-width"];
+function g(e, t, n, r, u, g) {
+	return l(), a("div", {
+		class: s(["d-progress-circle", [g.sizeClass, g.kindClass]]),
 		role: "progressbar",
 		"aria-label": n.ariaLabel,
 		tabindex: "-1",
@@ -79,56 +80,56 @@ function h(e, t, n, l, h, g) {
 		"aria-valuemin": "0",
 		"aria-valuemax": "100",
 		"data-qa": "dt-progress-circle"
-	}, [(c(), i("svg", {
+	}, [(l(), a("svg", {
 		class: "d-progress-circle__bar",
-		style: s(g.cssVars),
+		style: c(g.cssVars),
 		viewBox: "0 0 24 24"
 	}, [
-		g.isAi ? (c(), i("defs", d, [a("linearGradient", {
+		g.isAi ? (l(), a("defs", f, [o("linearGradient", {
 			id: g.aiGradientId,
 			x1: "0%",
 			y1: "0%",
 			x2: "100%",
 			y2: "100%"
 		}, [...t[0] || (t[0] = [
-			a("stop", {
+			o("stop", {
 				offset: "0%",
 				"stop-color": "var(--dt-color-brand-gold)"
 			}, null, -1),
-			a("stop", {
+			o("stop", {
 				offset: "33%",
 				"stop-color": "var(--dt-color-brand-red)"
 			}, null, -1),
-			a("stop", {
+			o("stop", {
 				offset: "66%",
 				"stop-color": "var(--dt-color-brand-magenta)"
 			}, null, -1),
-			a("stop", {
+			o("stop", {
 				offset: "100%",
 				"stop-color": "var(--dt-color-brand-purple)"
 			}, null, -1)
-		])], 8, f)])) : r("", !0),
-		n.progress <= 95 ? (c(), i("path", {
+		])], 8, p)])) : i("", !0),
+		n.progress <= 95 ? (l(), a("path", {
 			key: 1,
 			d: g.circlePath,
 			class: "d-progress-circle__shape d-progress-circle__shape--track",
 			fill: "none",
-			"stroke-width": h.strokeWidth,
+			"stroke-width": u.strokeWidth,
 			"stroke-linecap": "round"
-		}, null, 8, p)) : r("", !0),
-		n.progress > 0 ? (c(), i("path", {
+		}, null, 8, m)) : i("", !0),
+		n.progress > 0 ? (l(), a("path", {
 			key: 2,
 			d: g.circlePath,
 			class: "d-progress-circle__shape d-progress-circle__shape--fill",
 			fill: "none",
-			"stroke-width": h.strokeWidth,
+			"stroke-width": u.strokeWidth,
 			"stroke-linecap": "round",
-			style: s(g.fillStrokeStyle)
-		}, null, 12, m)) : r("", !0)
-	], 4))], 10, u);
+			style: c(g.fillStrokeStyle)
+		}, null, 12, h)) : i("", !0)
+	], 4))], 10, d);
 }
-var g = /* @__PURE__ */ e(l, [["render", h]]);
+var _ = /* @__PURE__ */ t(u, [["render", g]]);
 //#endregion
-export { g as default };
+export { _ as default };
 
 //# sourceMappingURL=progress-circle.js.map

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

@@ -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":"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"}
+{"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';\nimport { ordinalSizeValidator } from '@/common/validators';\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, Number],\n      default: 500,\n      validator: ordinalSizeValidator(PROGRESS_CIRCLE_SIZES),\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/prose/prose.cjs

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`./prose-constants.cjs`);let t=require(`vue`);var n=Object.assign({name:`DtProse`},{__name:`Prose`,props:{size:{type:[String,Number],default:300,validator:t=>Object.keys(e.PROSE_SIZE_MODIFIERS).includes(String(t))},density:{type:[String,Number],default:200,validator:t=>Object.keys(e.PROSE_DENSITY_MODIFIERS).includes(String(t))}},setup(n){let r=n,i=(0,t.computed)(()=>[`d-prose`,e.PROSE_SIZE_MODIFIERS[String(r.size)],e.PROSE_DENSITY_MODIFIERS[String(r.density)]].filter(Boolean)),a=(0,t.ref)(null);function o(e){return e.includes(`-`)}function s(t,n){return e.PROSE_DISALLOWED_ELEMENTS.includes(n)?!(n===`input`&&t.getAttribute(`type`)===`checkbox`&&t.parentElement?.tagName.toLowerCase()===`li`):!1}function c(t,n){let r=e.PROSE_ALLOWED_ATTRIBUTES._global||[],i=e.PROSE_ALLOWED_ATTRIBUTES[n]||[],a=[...r,...i],o=[];for(let n of t.attributes){if(e._PROSE_URL_ATTRIBUTES.includes(n.name)&&!e._isSafeProseUrl(n.value)){o.push(n.name);continue}a.includes(n.name)||e._PROSE_ALLOWED_ATTRIBUTE_PREFIXES.some(e=>n.name.startsWith(e))||o.push(n.name)}for(let e of o)t.removeAttribute(e)}function l(){if(!a.value)return;let e=document.createTreeWalker(a.value,NodeFilter.SHOW_ELEMENT),t=e.nextNode();for(;t;){let n=t.tagName.toLowerCase();c(t,n),t=e.nextNode()}}function u(){if(!a.value)return;let e=document.createTreeWalker(a.value,NodeFilter.SHOW_ELEMENT),t=e.nextNode();for(;t;){let n=t.tagName.toLowerCase();o(n)?console.error(`DtProse: Custom element <${n}> is not allowed inside prose content. Only plain HTML elements are permitted.`):s(t,n)&&console.error(`DtProse: <${n}> is not allowed inside prose content. Form elements and interactive controls should not be used in prose blocks.`),t=e.nextNode()}}return(0,t.onMounted)(l),(0,t.onUpdated)(l),process.env.NODE_ENV!==`production`&&((0,t.onMounted)(u),(0,t.onUpdated)(u)),(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{ref_key:`proseRef`,ref:a,class:(0,t.normalizeClass)(i.value),"data-qa":`dt-prose`},[(0,t.renderSlot)(e.$slots,`default`)],2))}});exports.default=n;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/validators/index.cjs`),t=require(`./prose-constants.cjs`);let n=require(`vue`);var r=Object.assign({name:`DtProse`},{__name:`Prose`,props:{size:{type:[String,Number],default:300,validator:e.ordinalSizeValidator(t.PROSE_SIZE_MODIFIERS)},density:{type:[String,Number],default:200,validator:e=>Object.keys(t.PROSE_DENSITY_MODIFIERS).includes(String(e))}},setup(e){let r=e,i=(0,n.computed)(()=>[`d-prose`,t.PROSE_SIZE_MODIFIERS[String(r.size)],t.PROSE_DENSITY_MODIFIERS[String(r.density)]].filter(Boolean)),a=(0,n.ref)(null);function o(e){return e.includes(`-`)}function s(e,n){return t.PROSE_DISALLOWED_ELEMENTS.includes(n)?!(n===`input`&&e.getAttribute(`type`)===`checkbox`&&e.parentElement?.tagName.toLowerCase()===`li`):!1}function c(e,n){let r=t.PROSE_ALLOWED_ATTRIBUTES._global||[],i=t.PROSE_ALLOWED_ATTRIBUTES[n]||[],a=[...r,...i],o=[];for(let n of e.attributes){if(t._PROSE_URL_ATTRIBUTES.includes(n.name)&&!t._isSafeProseUrl(n.value)){o.push(n.name);continue}a.includes(n.name)||t._PROSE_ALLOWED_ATTRIBUTE_PREFIXES.some(e=>n.name.startsWith(e))||o.push(n.name)}for(let t of o)e.removeAttribute(t)}function l(){if(!a.value)return;let e=document.createTreeWalker(a.value,NodeFilter.SHOW_ELEMENT),t=e.nextNode();for(;t;){let n=t.tagName.toLowerCase();c(t,n),t=e.nextNode()}}function u(){if(!a.value)return;let e=document.createTreeWalker(a.value,NodeFilter.SHOW_ELEMENT),t=e.nextNode();for(;t;){let n=t.tagName.toLowerCase();o(n)?console.error(`DtProse: Custom element <${n}> is not allowed inside prose content. Only plain HTML elements are permitted.`):s(t,n)&&console.error(`DtProse: <${n}> is not allowed inside prose content. Form elements and interactive controls should not be used in prose blocks.`),t=e.nextNode()}}return(0,n.onMounted)(l),(0,n.onUpdated)(l),process.env.NODE_ENV!==`production`&&((0,n.onMounted)(u),(0,n.onUpdated)(u)),(e,t)=>((0,n.openBlock)(),(0,n.createElementBlock)(`div`,{ref_key:`proseRef`,ref:a,class:(0,n.normalizeClass)(i.value),"data-qa":`dt-prose`},[(0,n.renderSlot)(e.$slots,`default`)],2))}});exports.default=r;
 //# sourceMappingURL=prose.cjs.map

package/dist/lib/prose/prose.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"prose.cjs","names":[],"sources":["../../../components/Prose/Prose.vue"],"sourcesContent":["<!-- eslint-disable vue/no-restricted-class -->\n<template>\n  <div\n    ref=\"proseRef\"\n    :class=\"proseClasses\"\n    data-qa=\"dt-prose\"\n  >\n    <!-- @slot Default slot for raw HTML content -->\n    <slot />\n  </div>\n</template>\n\n<script setup>\ndefineOptions({ name: 'DtProse' });\n\nimport { computed, ref, onMounted, onUpdated } from 'vue';\nimport {\n  PROSE_DISALLOWED_ELEMENTS,\n  PROSE_ALLOWED_ATTRIBUTES,\n  _PROSE_ALLOWED_ATTRIBUTE_PREFIXES,\n  _PROSE_URL_ATTRIBUTES,\n  PROSE_SIZE_MODIFIERS,\n  PROSE_DENSITY_MODIFIERS,\n  _isSafeProseUrl,\n} from './ProseConstants.js';\n\nconst props = defineProps({\n  /**\n   * The size of the prose typography scale.\n   * @values 100, 200, 300\n   */\n  size: {\n    type: [String, Number],\n    default: 300,\n    validator: (s) => Object.keys(PROSE_SIZE_MODIFIERS).includes(String(s)),\n  },\n\n  /**\n   * The density (line-height) of prose content.\n   * @values 100, 200, 300\n   */\n  density: {\n    type: [String, Number],\n    default: 200,\n    validator: (s) => Object.keys(PROSE_DENSITY_MODIFIERS).includes(String(s)),\n  },\n});\n\nconst proseClasses = computed(() => [\n  'd-prose',\n  PROSE_SIZE_MODIFIERS[String(props.size)],\n  PROSE_DENSITY_MODIFIERS[String(props.density)],\n].filter(Boolean));\n\nconst proseRef = ref(null);\n\nfunction isCustomElement (tagName) {\n  return tagName.includes('-');\n}\n\nfunction isDisallowedElement (node, tagName) {\n  if (!PROSE_DISALLOWED_ELEMENTS.includes(tagName)) return false;\n\n  // Exception: <input type=\"checkbox\"> inside <li> (task list pattern)\n  return !(\n    tagName === 'input' &&\n    node.getAttribute('type') === 'checkbox' &&\n    node.parentElement?.tagName.toLowerCase() === 'li'\n  );\n}\n\nfunction stripDisallowedAttributes (node, tagName) {\n  const allowedGlobal = PROSE_ALLOWED_ATTRIBUTES._global || [];\n  const allowedForTag = PROSE_ALLOWED_ATTRIBUTES[tagName] || [];\n  const allowed = [...allowedGlobal, ...allowedForTag];\n\n  const attrsToRemove = [];\n  for (const attr of node.attributes) {\n    if (_PROSE_URL_ATTRIBUTES.includes(attr.name) && !_isSafeProseUrl(attr.value)) {\n      attrsToRemove.push(attr.name);\n      continue;\n    }\n    if (allowed.includes(attr.name)) continue;\n    if (_PROSE_ALLOWED_ATTRIBUTE_PREFIXES.some(prefix => attr.name.startsWith(prefix))) continue;\n    attrsToRemove.push(attr.name);\n  }\n  for (const attrName of attrsToRemove) {\n    node.removeAttribute(attrName);\n  }\n}\n\nfunction sanitizeContent () {\n  if (!proseRef.value) return;\n\n  const walker = document.createTreeWalker(\n    proseRef.value,\n    NodeFilter.SHOW_ELEMENT,\n  );\n\n  let node = walker.nextNode();\n  while (node) {\n    const tagName = node.tagName.toLowerCase();\n    stripDisallowedAttributes(node, tagName);\n\n    node = walker.nextNode();\n  }\n}\n\nfunction validateContent () {\n  if (!proseRef.value) return;\n\n  const walker = document.createTreeWalker(\n    proseRef.value,\n    NodeFilter.SHOW_ELEMENT,\n  );\n\n  let node = walker.nextNode();\n  while (node) {\n    const tagName = node.tagName.toLowerCase();\n\n    if (isCustomElement(tagName)) {\n      console.error(\n        `DtProse: Custom element <${tagName}> is not allowed inside prose content. ` +\n        'Only plain HTML elements are permitted.',\n      );\n    } else if (isDisallowedElement(node, tagName)) {\n      console.error(\n        `DtProse: <${tagName}> is not allowed inside prose content. ` +\n        'Form elements and interactive controls should not be used in prose blocks.',\n      );\n    }\n\n    node = walker.nextNode();\n  }\n}\n\nonMounted(sanitizeContent);\nonUpdated(sanitizeContent);\n\nif (process.env.NODE_ENV !== 'production') {\n  onMounted(validateContent);\n  onUpdated(validateContent);\n}\n</script>\n"],"mappings":"ueA0BA,IAAM,EAAQ,EAsBR,GAAA,EAAA,EAAA,cAA8B,CAClC,UACA,EAAA,qBAAqB,OAAO,EAAM,KAAK,EACvC,EAAA,wBAAwB,OAAO,EAAM,QAAQ,EAC9C,CAAC,OAAO,QAAQ,CAAC,CAEZ,GAAA,EAAA,EAAA,KAAe,KAAK,CAE1B,SAAS,EAAiB,EAAS,CACjC,OAAO,EAAQ,SAAS,IAAI,CAG9B,SAAS,EAAqB,EAAM,EAAS,CAI3C,OAHK,EAAA,0BAA0B,SAAS,EAAQ,CAGzC,EACL,IAAY,SACZ,EAAK,aAAa,OAAO,GAAK,YAC9B,EAAK,eAAe,QAAQ,aAAa,GAAK,MANS,GAU3D,SAAS,EAA2B,EAAM,EAAS,CACjD,IAAM,EAAgB,EAAA,yBAAyB,SAAW,EAAE,CACtD,EAAgB,EAAA,yBAAyB,IAAY,EAAE,CACvD,EAAU,CAAC,GAAG,EAAe,GAAG,EAAc,CAE9C,EAAgB,EAAE,CACxB,IAAK,IAAM,KAAQ,EAAK,WAAY,CAClC,GAAI,EAAA,sBAAsB,SAAS,EAAK,KAAK,EAAI,CAAC,EAAA,gBAAgB,EAAK,MAAM,CAAE,CAC7E,EAAc,KAAK,EAAK,KAAK,CAC7B,SAEE,EAAQ,SAAS,EAAK,KAAK,EAC3B,EAAA,kCAAkC,KAAK,GAAU,EAAK,KAAK,WAAW,EAAO,CAAC,EAClF,EAAc,KAAK,EAAK,KAAK,CAE/B,IAAK,IAAM,KAAY,EACrB,EAAK,gBAAgB,EAAS,CAIlC,SAAS,GAAmB,CAC1B,GAAI,CAAC,EAAS,MAAO,OAErB,IAAM,EAAS,SAAS,iBACtB,EAAS,MACT,WAAW,aACZ,CAEG,EAAO,EAAO,UAAU,CAC5B,KAAO,GAAM,CACX,IAAM,EAAU,EAAK,QAAQ,aAAa,CAC1C,EAA0B,EAAM,EAAQ,CAExC,EAAO,EAAO,UAAU,EAI5B,SAAS,GAAmB,CAC1B,GAAI,CAAC,EAAS,MAAO,OAErB,IAAM,EAAS,SAAS,iBACtB,EAAS,MACT,WAAW,aACZ,CAEG,EAAO,EAAO,UAAU,CAC5B,KAAO,GAAM,CACX,IAAM,EAAU,EAAK,QAAQ,aAAa,CAEtC,EAAgB,EAAQ,CAC1B,QAAQ,MACN,4BAA4B,EAAQ,gFAErC,CACQ,EAAoB,EAAM,EAAQ,EAC3C,QAAQ,MACN,aAAa,EAAQ,mHAEtB,CAGH,EAAO,EAAO,UAAU,SAI5B,EAAA,EAAA,WAAU,EAAgB,EAC1B,EAAA,EAAA,WAAU,EAAgB,CAE1B,QAAA,IAAA,WAA6B,gBAC3B,EAAA,EAAA,WAAU,EAAgB,EAC1B,EAAA,EAAA,WAAU,EAAgB,qDApIpB,MAAA,SANA,WAAJ,IAAI,EACH,OAAA,EAAA,EAAA,gBAAO,EAAA,MAAY,CACpB,UAAQ,8BAGA,EAAA,OAAA,UAAA,CAAA,CAAA,EAAA"}
+{"version":3,"file":"prose.cjs","names":[],"sources":["../../../components/Prose/Prose.vue"],"sourcesContent":["<!-- eslint-disable vue/no-restricted-class -->\n<template>\n  <div\n    ref=\"proseRef\"\n    :class=\"proseClasses\"\n    data-qa=\"dt-prose\"\n  >\n    <!-- @slot Default slot for raw HTML content -->\n    <slot />\n  </div>\n</template>\n\n<script setup>\ndefineOptions({ name: 'DtProse' });\n\nimport { computed, ref, onMounted, onUpdated } from 'vue';\nimport { ordinalSizeValidator } from '@/common/validators';\nimport {\n  PROSE_DISALLOWED_ELEMENTS,\n  PROSE_ALLOWED_ATTRIBUTES,\n  _PROSE_ALLOWED_ATTRIBUTE_PREFIXES,\n  _PROSE_URL_ATTRIBUTES,\n  PROSE_SIZE_MODIFIERS,\n  PROSE_DENSITY_MODIFIERS,\n  _isSafeProseUrl,\n} from './ProseConstants.js';\n\nconst props = defineProps({\n  /**\n   * The size of the prose typography scale.\n   * @values 100, 200, 300\n   */\n  size: {\n    type: [String, Number],\n    default: 300,\n    validator: ordinalSizeValidator(PROSE_SIZE_MODIFIERS),\n  },\n\n  /**\n   * The density (line-height) of prose content.\n   * @values 100, 200, 300\n   */\n  density: {\n    type: [String, Number],\n    default: 200,\n    validator: (s) => Object.keys(PROSE_DENSITY_MODIFIERS).includes(String(s)),\n  },\n});\n\nconst proseClasses = computed(() => [\n  'd-prose',\n  PROSE_SIZE_MODIFIERS[String(props.size)],\n  PROSE_DENSITY_MODIFIERS[String(props.density)],\n].filter(Boolean));\n\nconst proseRef = ref(null);\n\nfunction isCustomElement (tagName) {\n  return tagName.includes('-');\n}\n\nfunction isDisallowedElement (node, tagName) {\n  if (!PROSE_DISALLOWED_ELEMENTS.includes(tagName)) return false;\n\n  // Exception: <input type=\"checkbox\"> inside <li> (task list pattern)\n  return !(\n    tagName === 'input' &&\n    node.getAttribute('type') === 'checkbox' &&\n    node.parentElement?.tagName.toLowerCase() === 'li'\n  );\n}\n\nfunction stripDisallowedAttributes (node, tagName) {\n  const allowedGlobal = PROSE_ALLOWED_ATTRIBUTES._global || [];\n  const allowedForTag = PROSE_ALLOWED_ATTRIBUTES[tagName] || [];\n  const allowed = [...allowedGlobal, ...allowedForTag];\n\n  const attrsToRemove = [];\n  for (const attr of node.attributes) {\n    if (_PROSE_URL_ATTRIBUTES.includes(attr.name) && !_isSafeProseUrl(attr.value)) {\n      attrsToRemove.push(attr.name);\n      continue;\n    }\n    if (allowed.includes(attr.name)) continue;\n    if (_PROSE_ALLOWED_ATTRIBUTE_PREFIXES.some(prefix => attr.name.startsWith(prefix))) continue;\n    attrsToRemove.push(attr.name);\n  }\n  for (const attrName of attrsToRemove) {\n    node.removeAttribute(attrName);\n  }\n}\n\nfunction sanitizeContent () {\n  if (!proseRef.value) return;\n\n  const walker = document.createTreeWalker(\n    proseRef.value,\n    NodeFilter.SHOW_ELEMENT,\n  );\n\n  let node = walker.nextNode();\n  while (node) {\n    const tagName = node.tagName.toLowerCase();\n    stripDisallowedAttributes(node, tagName);\n\n    node = walker.nextNode();\n  }\n}\n\nfunction validateContent () {\n  if (!proseRef.value) return;\n\n  const walker = document.createTreeWalker(\n    proseRef.value,\n    NodeFilter.SHOW_ELEMENT,\n  );\n\n  let node = walker.nextNode();\n  while (node) {\n    const tagName = node.tagName.toLowerCase();\n\n    if (isCustomElement(tagName)) {\n      console.error(\n        `DtProse: Custom element <${tagName}> is not allowed inside prose content. ` +\n        'Only plain HTML elements are permitted.',\n      );\n    } else if (isDisallowedElement(node, tagName)) {\n      console.error(\n        `DtProse: <${tagName}> is not allowed inside prose content. ` +\n        'Form elements and interactive controls should not be used in prose blocks.',\n      );\n    }\n\n    node = walker.nextNode();\n  }\n}\n\nonMounted(sanitizeContent);\nonUpdated(sanitizeContent);\n\nif (process.env.NODE_ENV !== 'production') {\n  onMounted(validateContent);\n  onUpdated(validateContent);\n}\n</script>\n"],"mappings":"0gBA2BA,IAAM,EAAQ,EAsBR,GAAA,EAAA,EAAA,cAA8B,CAClC,UACA,EAAA,qBAAqB,OAAO,EAAM,KAAK,EACvC,EAAA,wBAAwB,OAAO,EAAM,QAAQ,EAC9C,CAAC,OAAO,QAAQ,CAAC,CAEZ,GAAA,EAAA,EAAA,KAAe,KAAK,CAE1B,SAAS,EAAiB,EAAS,CACjC,OAAO,EAAQ,SAAS,IAAI,CAG9B,SAAS,EAAqB,EAAM,EAAS,CAI3C,OAHK,EAAA,0BAA0B,SAAS,EAAQ,CAGzC,EACL,IAAY,SACZ,EAAK,aAAa,OAAO,GAAK,YAC9B,EAAK,eAAe,QAAQ,aAAa,GAAK,MANS,GAU3D,SAAS,EAA2B,EAAM,EAAS,CACjD,IAAM,EAAgB,EAAA,yBAAyB,SAAW,EAAE,CACtD,EAAgB,EAAA,yBAAyB,IAAY,EAAE,CACvD,EAAU,CAAC,GAAG,EAAe,GAAG,EAAc,CAE9C,EAAgB,EAAE,CACxB,IAAK,IAAM,KAAQ,EAAK,WAAY,CAClC,GAAI,EAAA,sBAAsB,SAAS,EAAK,KAAK,EAAI,CAAC,EAAA,gBAAgB,EAAK,MAAM,CAAE,CAC7E,EAAc,KAAK,EAAK,KAAK,CAC7B,SAEE,EAAQ,SAAS,EAAK,KAAK,EAC3B,EAAA,kCAAkC,KAAK,GAAU,EAAK,KAAK,WAAW,EAAO,CAAC,EAClF,EAAc,KAAK,EAAK,KAAK,CAE/B,IAAK,IAAM,KAAY,EACrB,EAAK,gBAAgB,EAAS,CAIlC,SAAS,GAAmB,CAC1B,GAAI,CAAC,EAAS,MAAO,OAErB,IAAM,EAAS,SAAS,iBACtB,EAAS,MACT,WAAW,aACZ,CAEG,EAAO,EAAO,UAAU,CAC5B,KAAO,GAAM,CACX,IAAM,EAAU,EAAK,QAAQ,aAAa,CAC1C,EAA0B,EAAM,EAAQ,CAExC,EAAO,EAAO,UAAU,EAI5B,SAAS,GAAmB,CAC1B,GAAI,CAAC,EAAS,MAAO,OAErB,IAAM,EAAS,SAAS,iBACtB,EAAS,MACT,WAAW,aACZ,CAEG,EAAO,EAAO,UAAU,CAC5B,KAAO,GAAM,CACX,IAAM,EAAU,EAAK,QAAQ,aAAa,CAEtC,EAAgB,EAAQ,CAC1B,QAAQ,MACN,4BAA4B,EAAQ,gFAErC,CACQ,EAAoB,EAAM,EAAQ,EAC3C,QAAQ,MACN,aAAa,EAAQ,mHAEtB,CAGH,EAAO,EAAO,UAAU,SAI5B,EAAA,EAAA,WAAU,EAAgB,EAC1B,EAAA,EAAA,WAAU,EAAgB,CAE1B,QAAA,IAAA,WAA6B,gBAC3B,EAAA,EAAA,WAAU,EAAgB,EAC1B,EAAA,EAAA,WAAU,EAAgB,qDArIpB,MAAA,SANA,WAAJ,IAAI,EACH,OAAA,EAAA,EAAA,gBAAO,EAAA,MAAY,CACpB,UAAQ,8BAGA,EAAA,OAAA,UAAA,CAAA,CAAA,EAAA"}

package/dist/lib/prose/prose.js

@@ -1,42 +1,43 @@
-import { PROSE_ALLOWED_ATTRIBUTES as e, PROSE_DENSITY_MODIFIERS as t, PROSE_DISALLOWED_ELEMENTS as n, PROSE_SIZE_MODIFIERS as r, _PROSE_ALLOWED_ATTRIBUTE_PREFIXES as i, _PROSE_URL_ATTRIBUTES as a, _isSafeProseUrl as o } from "./prose-constants.js";
-import { computed as s, createElementBlock as c, normalizeClass as l, onMounted as u, onUpdated as d, openBlock as f, ref as p, renderSlot as m } from "vue";
+import { ordinalSizeValidator as e } from "../../common/validators/index.js";
+import { PROSE_ALLOWED_ATTRIBUTES as t, PROSE_DENSITY_MODIFIERS as n, PROSE_DISALLOWED_ELEMENTS as r, PROSE_SIZE_MODIFIERS as i, _PROSE_ALLOWED_ATTRIBUTE_PREFIXES as a, _PROSE_URL_ATTRIBUTES as o, _isSafeProseUrl as s } from "./prose-constants.js";
+import { computed as c, createElementBlock as l, normalizeClass as u, onMounted as d, onUpdated as f, openBlock as p, ref as m, renderSlot as h } from "vue";
 //#region components/Prose/Prose.vue
-var h = /* @__PURE__ */ Object.assign({ name: "DtProse" }, {
+var g = /* @__PURE__ */ Object.assign({ name: "DtProse" }, {
 	__name: "Prose",
 	props: {
 		size: {
 			type: [String, Number],
 			default: 300,
-			validator: (e) => Object.keys(r).includes(String(e))
+			validator: e(i)
 		},
 		density: {
 			type: [String, Number],
 			default: 200,
-			validator: (e) => Object.keys(t).includes(String(e))
+			validator: (e) => Object.keys(n).includes(String(e))
 		}
 	},
-	setup(h) {
-		let g = h, _ = s(() => [
+	setup(e) {
+		let g = e, _ = c(() => [
 			"d-prose",
-			r[String(g.size)],
-			t[String(g.density)]
-		].filter(Boolean)), v = p(null);
+			i[String(g.size)],
+			n[String(g.density)]
+		].filter(Boolean)), v = m(null);
 		function y(e) {
 			return e.includes("-");
 		}
 		function b(e, t) {
-			return n.includes(t) ? !(t === "input" && e.getAttribute("type") === "checkbox" && e.parentElement?.tagName.toLowerCase() === "li") : !1;
+			return r.includes(t) ? !(t === "input" && e.getAttribute("type") === "checkbox" && e.parentElement?.tagName.toLowerCase() === "li") : !1;
 		}
-		function x(t, n) {
-			let r = e._global || [], s = e[n] || [], c = [...r, ...s], l = [];
-			for (let e of t.attributes) {
-				if (a.includes(e.name) && !o(e.value)) {
-					l.push(e.name);
+		function x(e, n) {
+			let r = t._global || [], i = t[n] || [], c = [...r, ...i], l = [];
+			for (let t of e.attributes) {
+				if (o.includes(t.name) && !s(t.value)) {
+					l.push(t.name);
 					continue;
 				}
-				c.includes(e.name) || i.some((t) => e.name.startsWith(t)) || l.push(e.name);
+				c.includes(t.name) || a.some((e) => t.name.startsWith(e)) || l.push(t.name);
 			}
-			for (let e of l) t.removeAttribute(e);
+			for (let t of l) e.removeAttribute(t);
 		}
 		function S() {
 			if (!v.value) return;
@@ -54,15 +55,15 @@ var h = /* @__PURE__ */ Object.assign({ name: "DtProse" }, {
 				y(n) ? console.error(`DtProse: Custom element <${n}> is not allowed inside prose content. Only plain HTML elements are permitted.`) : b(t, n) && console.error(`DtProse: <${n}> is not allowed inside prose content. Form elements and interactive controls should not be used in prose blocks.`), t = e.nextNode();
 			}
 		}
-		return u(S), d(S), process.env.NODE_ENV !== "production" && (u(C), d(C)), (e, t) => (f(), c("div", {
+		return d(S), f(S), process.env.NODE_ENV !== "production" && (d(C), f(C)), (e, t) => (p(), l("div", {
 			ref_key: "proseRef",
 			ref: v,
-			class: l(_.value),
+			class: u(_.value),
 			"data-qa": "dt-prose"
-		}, [m(e.$slots, "default")], 2));
+		}, [h(e.$slots, "default")], 2));
 	}
 });
 //#endregion
-export { h as default };
+export { g as default };
 
 //# sourceMappingURL=prose.js.map

package/dist/lib/prose/prose.js.map

@@ -1 +1 @@
-{"version":3,"file":"prose.js","names":[],"sources":["../../../components/Prose/Prose.vue"],"sourcesContent":["<!-- eslint-disable vue/no-restricted-class -->\n<template>\n  <div\n    ref=\"proseRef\"\n    :class=\"proseClasses\"\n    data-qa=\"dt-prose\"\n  >\n    <!-- @slot Default slot for raw HTML content -->\n    <slot />\n  </div>\n</template>\n\n<script setup>\ndefineOptions({ name: 'DtProse' });\n\nimport { computed, ref, onMounted, onUpdated } from 'vue';\nimport {\n  PROSE_DISALLOWED_ELEMENTS,\n  PROSE_ALLOWED_ATTRIBUTES,\n  _PROSE_ALLOWED_ATTRIBUTE_PREFIXES,\n  _PROSE_URL_ATTRIBUTES,\n  PROSE_SIZE_MODIFIERS,\n  PROSE_DENSITY_MODIFIERS,\n  _isSafeProseUrl,\n} from './ProseConstants.js';\n\nconst props = defineProps({\n  /**\n   * The size of the prose typography scale.\n   * @values 100, 200, 300\n   */\n  size: {\n    type: [String, Number],\n    default: 300,\n    validator: (s) => Object.keys(PROSE_SIZE_MODIFIERS).includes(String(s)),\n  },\n\n  /**\n   * The density (line-height) of prose content.\n   * @values 100, 200, 300\n   */\n  density: {\n    type: [String, Number],\n    default: 200,\n    validator: (s) => Object.keys(PROSE_DENSITY_MODIFIERS).includes(String(s)),\n  },\n});\n\nconst proseClasses = computed(() => [\n  'd-prose',\n  PROSE_SIZE_MODIFIERS[String(props.size)],\n  PROSE_DENSITY_MODIFIERS[String(props.density)],\n].filter(Boolean));\n\nconst proseRef = ref(null);\n\nfunction isCustomElement (tagName) {\n  return tagName.includes('-');\n}\n\nfunction isDisallowedElement (node, tagName) {\n  if (!PROSE_DISALLOWED_ELEMENTS.includes(tagName)) return false;\n\n  // Exception: <input type=\"checkbox\"> inside <li> (task list pattern)\n  return !(\n    tagName === 'input' &&\n    node.getAttribute('type') === 'checkbox' &&\n    node.parentElement?.tagName.toLowerCase() === 'li'\n  );\n}\n\nfunction stripDisallowedAttributes (node, tagName) {\n  const allowedGlobal = PROSE_ALLOWED_ATTRIBUTES._global || [];\n  const allowedForTag = PROSE_ALLOWED_ATTRIBUTES[tagName] || [];\n  const allowed = [...allowedGlobal, ...allowedForTag];\n\n  const attrsToRemove = [];\n  for (const attr of node.attributes) {\n    if (_PROSE_URL_ATTRIBUTES.includes(attr.name) && !_isSafeProseUrl(attr.value)) {\n      attrsToRemove.push(attr.name);\n      continue;\n    }\n    if (allowed.includes(attr.name)) continue;\n    if (_PROSE_ALLOWED_ATTRIBUTE_PREFIXES.some(prefix => attr.name.startsWith(prefix))) continue;\n    attrsToRemove.push(attr.name);\n  }\n  for (const attrName of attrsToRemove) {\n    node.removeAttribute(attrName);\n  }\n}\n\nfunction sanitizeContent () {\n  if (!proseRef.value) return;\n\n  const walker = document.createTreeWalker(\n    proseRef.value,\n    NodeFilter.SHOW_ELEMENT,\n  );\n\n  let node = walker.nextNode();\n  while (node) {\n    const tagName = node.tagName.toLowerCase();\n    stripDisallowedAttributes(node, tagName);\n\n    node = walker.nextNode();\n  }\n}\n\nfunction validateContent () {\n  if (!proseRef.value) return;\n\n  const walker = document.createTreeWalker(\n    proseRef.value,\n    NodeFilter.SHOW_ELEMENT,\n  );\n\n  let node = walker.nextNode();\n  while (node) {\n    const tagName = node.tagName.toLowerCase();\n\n    if (isCustomElement(tagName)) {\n      console.error(\n        `DtProse: Custom element <${tagName}> is not allowed inside prose content. ` +\n        'Only plain HTML elements are permitted.',\n      );\n    } else if (isDisallowedElement(node, tagName)) {\n      console.error(\n        `DtProse: <${tagName}> is not allowed inside prose content. ` +\n        'Form elements and interactive controls should not be used in prose blocks.',\n      );\n    }\n\n    node = walker.nextNode();\n  }\n}\n\nonMounted(sanitizeContent);\nonUpdated(sanitizeContent);\n\nif (process.env.NODE_ENV !== 'production') {\n  onMounted(validateContent);\n  onUpdated(validateContent);\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;EA0BA,IAAM,IAAQ,GAsBR,IAAe,QAAe;GAClC;GACA,EAAqB,OAAO,EAAM,KAAK;GACvC,EAAwB,OAAO,EAAM,QAAQ;GAC9C,CAAC,OAAO,QAAQ,CAAC,EAEZ,IAAW,EAAI,KAAK;EAE1B,SAAS,EAAiB,GAAS;AACjC,UAAO,EAAQ,SAAS,IAAI;;EAG9B,SAAS,EAAqB,GAAM,GAAS;AAI3C,UAHK,EAA0B,SAAS,EAAQ,GAGzC,EACL,MAAY,WACZ,EAAK,aAAa,OAAO,KAAK,cAC9B,EAAK,eAAe,QAAQ,aAAa,KAAK,QANS;;EAU3D,SAAS,EAA2B,GAAM,GAAS;GACjD,IAAM,IAAgB,EAAyB,WAAW,EAAE,EACtD,IAAgB,EAAyB,MAAY,EAAE,EACvD,IAAU,CAAC,GAAG,GAAe,GAAG,EAAc,EAE9C,IAAgB,EAAE;AACxB,QAAK,IAAM,KAAQ,EAAK,YAAY;AAClC,QAAI,EAAsB,SAAS,EAAK,KAAK,IAAI,CAAC,EAAgB,EAAK,MAAM,EAAE;AAC7E,OAAc,KAAK,EAAK,KAAK;AAC7B;;AAEE,MAAQ,SAAS,EAAK,KAAK,IAC3B,EAAkC,MAAK,MAAU,EAAK,KAAK,WAAW,EAAO,CAAC,IAClF,EAAc,KAAK,EAAK,KAAK;;AAE/B,QAAK,IAAM,KAAY,EACrB,GAAK,gBAAgB,EAAS;;EAIlC,SAAS,IAAmB;AAC1B,OAAI,CAAC,EAAS,MAAO;GAErB,IAAM,IAAS,SAAS,iBACtB,EAAS,OACT,WAAW,aACZ,EAEG,IAAO,EAAO,UAAU;AAC5B,UAAO,IAAM;IACX,IAAM,IAAU,EAAK,QAAQ,aAAa;AAG1C,IAFA,EAA0B,GAAM,EAAQ,EAExC,IAAO,EAAO,UAAU;;;EAI5B,SAAS,IAAmB;AAC1B,OAAI,CAAC,EAAS,MAAO;GAErB,IAAM,IAAS,SAAS,iBACtB,EAAS,OACT,WAAW,aACZ,EAEG,IAAO,EAAO,UAAU;AAC5B,UAAO,IAAM;IACX,IAAM,IAAU,EAAK,QAAQ,aAAa;AAc1C,IAZI,EAAgB,EAAQ,GAC1B,QAAQ,MACN,4BAA4B,EAAQ,gFAErC,GACQ,EAAoB,GAAM,EAAQ,IAC3C,QAAQ,MACN,aAAa,EAAQ,mHAEtB,EAGH,IAAO,EAAO,UAAU;;;SAI5B,EAAU,EAAgB,EAC1B,EAAU,EAAgB,EAE1B,QAAA,IAAA,aAA6B,iBAC3B,EAAU,EAAgB,EAC1B,EAAU,EAAgB,mBA3I1B,EAOM,OAAA;YANA;GAAJ,KAAI;GACH,OAAK,EAAE,EAAA,MAAY;GACpB,WAAQ;MAGR,EAAQ,EAAA,QAAA,UAAA,CAAA,EAAA,EAAA"}
+{"version":3,"file":"prose.js","names":[],"sources":["../../../components/Prose/Prose.vue"],"sourcesContent":["<!-- eslint-disable vue/no-restricted-class -->\n<template>\n  <div\n    ref=\"proseRef\"\n    :class=\"proseClasses\"\n    data-qa=\"dt-prose\"\n  >\n    <!-- @slot Default slot for raw HTML content -->\n    <slot />\n  </div>\n</template>\n\n<script setup>\ndefineOptions({ name: 'DtProse' });\n\nimport { computed, ref, onMounted, onUpdated } from 'vue';\nimport { ordinalSizeValidator } from '@/common/validators';\nimport {\n  PROSE_DISALLOWED_ELEMENTS,\n  PROSE_ALLOWED_ATTRIBUTES,\n  _PROSE_ALLOWED_ATTRIBUTE_PREFIXES,\n  _PROSE_URL_ATTRIBUTES,\n  PROSE_SIZE_MODIFIERS,\n  PROSE_DENSITY_MODIFIERS,\n  _isSafeProseUrl,\n} from './ProseConstants.js';\n\nconst props = defineProps({\n  /**\n   * The size of the prose typography scale.\n   * @values 100, 200, 300\n   */\n  size: {\n    type: [String, Number],\n    default: 300,\n    validator: ordinalSizeValidator(PROSE_SIZE_MODIFIERS),\n  },\n\n  /**\n   * The density (line-height) of prose content.\n   * @values 100, 200, 300\n   */\n  density: {\n    type: [String, Number],\n    default: 200,\n    validator: (s) => Object.keys(PROSE_DENSITY_MODIFIERS).includes(String(s)),\n  },\n});\n\nconst proseClasses = computed(() => [\n  'd-prose',\n  PROSE_SIZE_MODIFIERS[String(props.size)],\n  PROSE_DENSITY_MODIFIERS[String(props.density)],\n].filter(Boolean));\n\nconst proseRef = ref(null);\n\nfunction isCustomElement (tagName) {\n  return tagName.includes('-');\n}\n\nfunction isDisallowedElement (node, tagName) {\n  if (!PROSE_DISALLOWED_ELEMENTS.includes(tagName)) return false;\n\n  // Exception: <input type=\"checkbox\"> inside <li> (task list pattern)\n  return !(\n    tagName === 'input' &&\n    node.getAttribute('type') === 'checkbox' &&\n    node.parentElement?.tagName.toLowerCase() === 'li'\n  );\n}\n\nfunction stripDisallowedAttributes (node, tagName) {\n  const allowedGlobal = PROSE_ALLOWED_ATTRIBUTES._global || [];\n  const allowedForTag = PROSE_ALLOWED_ATTRIBUTES[tagName] || [];\n  const allowed = [...allowedGlobal, ...allowedForTag];\n\n  const attrsToRemove = [];\n  for (const attr of node.attributes) {\n    if (_PROSE_URL_ATTRIBUTES.includes(attr.name) && !_isSafeProseUrl(attr.value)) {\n      attrsToRemove.push(attr.name);\n      continue;\n    }\n    if (allowed.includes(attr.name)) continue;\n    if (_PROSE_ALLOWED_ATTRIBUTE_PREFIXES.some(prefix => attr.name.startsWith(prefix))) continue;\n    attrsToRemove.push(attr.name);\n  }\n  for (const attrName of attrsToRemove) {\n    node.removeAttribute(attrName);\n  }\n}\n\nfunction sanitizeContent () {\n  if (!proseRef.value) return;\n\n  const walker = document.createTreeWalker(\n    proseRef.value,\n    NodeFilter.SHOW_ELEMENT,\n  );\n\n  let node = walker.nextNode();\n  while (node) {\n    const tagName = node.tagName.toLowerCase();\n    stripDisallowedAttributes(node, tagName);\n\n    node = walker.nextNode();\n  }\n}\n\nfunction validateContent () {\n  if (!proseRef.value) return;\n\n  const walker = document.createTreeWalker(\n    proseRef.value,\n    NodeFilter.SHOW_ELEMENT,\n  );\n\n  let node = walker.nextNode();\n  while (node) {\n    const tagName = node.tagName.toLowerCase();\n\n    if (isCustomElement(tagName)) {\n      console.error(\n        `DtProse: Custom element <${tagName}> is not allowed inside prose content. ` +\n        'Only plain HTML elements are permitted.',\n      );\n    } else if (isDisallowedElement(node, tagName)) {\n      console.error(\n        `DtProse: <${tagName}> is not allowed inside prose content. ` +\n        'Form elements and interactive controls should not be used in prose blocks.',\n      );\n    }\n\n    node = walker.nextNode();\n  }\n}\n\nonMounted(sanitizeContent);\nonUpdated(sanitizeContent);\n\nif (process.env.NODE_ENV !== 'production') {\n  onMounted(validateContent);\n  onUpdated(validateContent);\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;EA2BA,IAAM,IAAQ,GAsBR,IAAe,QAAe;GAClC;GACA,EAAqB,OAAO,EAAM,KAAK;GACvC,EAAwB,OAAO,EAAM,QAAQ;GAC9C,CAAC,OAAO,QAAQ,CAAC,EAEZ,IAAW,EAAI,KAAK;EAE1B,SAAS,EAAiB,GAAS;AACjC,UAAO,EAAQ,SAAS,IAAI;;EAG9B,SAAS,EAAqB,GAAM,GAAS;AAI3C,UAHK,EAA0B,SAAS,EAAQ,GAGzC,EACL,MAAY,WACZ,EAAK,aAAa,OAAO,KAAK,cAC9B,EAAK,eAAe,QAAQ,aAAa,KAAK,QANS;;EAU3D,SAAS,EAA2B,GAAM,GAAS;GACjD,IAAM,IAAgB,EAAyB,WAAW,EAAE,EACtD,IAAgB,EAAyB,MAAY,EAAE,EACvD,IAAU,CAAC,GAAG,GAAe,GAAG,EAAc,EAE9C,IAAgB,EAAE;AACxB,QAAK,IAAM,KAAQ,EAAK,YAAY;AAClC,QAAI,EAAsB,SAAS,EAAK,KAAK,IAAI,CAAC,EAAgB,EAAK,MAAM,EAAE;AAC7E,OAAc,KAAK,EAAK,KAAK;AAC7B;;AAEE,MAAQ,SAAS,EAAK,KAAK,IAC3B,EAAkC,MAAK,MAAU,EAAK,KAAK,WAAW,EAAO,CAAC,IAClF,EAAc,KAAK,EAAK,KAAK;;AAE/B,QAAK,IAAM,KAAY,EACrB,GAAK,gBAAgB,EAAS;;EAIlC,SAAS,IAAmB;AAC1B,OAAI,CAAC,EAAS,MAAO;GAErB,IAAM,IAAS,SAAS,iBACtB,EAAS,OACT,WAAW,aACZ,EAEG,IAAO,EAAO,UAAU;AAC5B,UAAO,IAAM;IACX,IAAM,IAAU,EAAK,QAAQ,aAAa;AAG1C,IAFA,EAA0B,GAAM,EAAQ,EAExC,IAAO,EAAO,UAAU;;;EAI5B,SAAS,IAAmB;AAC1B,OAAI,CAAC,EAAS,MAAO;GAErB,IAAM,IAAS,SAAS,iBACtB,EAAS,OACT,WAAW,aACZ,EAEG,IAAO,EAAO,UAAU;AAC5B,UAAO,IAAM;IACX,IAAM,IAAU,EAAK,QAAQ,aAAa;AAc1C,IAZI,EAAgB,EAAQ,GAC1B,QAAQ,MACN,4BAA4B,EAAQ,gFAErC,GACQ,EAAoB,GAAM,EAAQ,IAC3C,QAAQ,MACN,aAAa,EAAQ,mHAEtB,EAGH,IAAO,EAAO,UAAU;;;SAI5B,EAAU,EAAgB,EAC1B,EAAU,EAAgB,EAE1B,QAAA,IAAA,aAA6B,iBAC3B,EAAU,EAAgB,EAC1B,EAAU,EAAgB,mBA5I1B,EAOM,OAAA;YANA;GAAJ,KAAI;GACH,OAAK,EAAE,EAAA,MAAY;GACpB,WAAQ;MAGR,EAAQ,EAAA,QAAA,UAAA,CAAA,EAAA,EAAA"}

package/dist/lib/segmented-control/segmented-control.cjs

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/utils/index.cjs`),t=require(`../stack/stack.cjs`),n=require(`../../common/composables/use-indicator-animation.cjs`),r=require(`./segmented-control-constants.cjs`);let i=require(`vue`);var a=Object.assign({name:`DtSegmentedControl`},{__name:`SegmentedControl`,props:{id:{type:String,default(){return e.getUniqueString()}},modelValue:{type:String,required:!0},ariaLabel:{type:String,default:void 0},orientation:{type:String,default:r.SEGMENTED_CONTROL_ORIENTATION_DEFAULT,validator:e=>r.SEGMENTED_CONTROL_ORIENTATIONS.includes(e)},size:{type:[String,Number],default:200,validator:e=>r.SEGMENTED_CONTROL_SIZES.includes(String(e))},activationMode:{type:String,default:r.SEGMENTED_CONTROL_ACTIVATION_MODE_DEFAULT,validator:e=>r.SEGMENTED_CONTROL_ACTIVATION_MODES.includes(e)},disabled:{type:Boolean,default:!1},showDivider:{type:Boolean,default:!0},borderless:{type:Boolean,default:!1},spread:{type:String,default:r.SEGMENTED_CONTROL_SPREAD_DEFAULT,validator:e=>r.SEGMENTED_CONTROL_SPREADS.includes(e)},labelClass:{type:[String,Array,Object],default:``},showIndicatorTransition:{type:Boolean,default:!0}},emits:[`update:modelValue`,`change`,`before-change`],setup(e,{emit:a}){let o=e,s=a,c=(0,i.ref)(null),l=(0,i.ref)(null),u=(0,i.computed)(()=>o.orientation===`vertical`?`column`:`row`),d=(0,i.computed)(()=>[`d-segmented-control`,r.SEGMENTED_CONTROL_SIZE_MODIFIERS[String(o.size)],o.showDivider?null:`d-segmented-control--hide-divider`,o.borderless?`d-segmented-control--borderless`:null,o.orientation===`vertical`?`d-segmented-control--vertical`:null,o.spread===`evenly`&&o.orientation===`horizontal`?`d-segmented-control--spread-evenly`:null]),f=(0,i.reactive)({selected:o.modelValue,disabled:o.disabled,size:o.size,labelClass:o.labelClass});(0,i.watchEffect)(()=>{f.selected=o.modelValue,f.disabled=o.disabled,f.size=o.size,f.labelClass=o.labelClass}),(0,i.provide)(r.SEGMENTED_CONTROL_CONTEXT_KEY,f),(0,i.provide)(r.SEGMENTED_CONTROL_SELECT_KEY,_),(0,i.provide)(r.SEGMENTED_CONTROL_FOCUS_KEY,g);function p(){let e=h();if(!e.length||e.some(e=>e.getAttribute(`tabindex`)===`0`))return;let t=e.find(e=>!b(e));t&&t.setAttribute(`tabindex`,`0`)}let m=n.useIndicatorAnimation(c,`--segmented-indicator-duration`,`--segmented-indicator-easing`);(0,i.onMounted)(p),(0,i.watch)(()=>[o.modelValue,o.disabled],p,{flush:`post`});function h(){let e=c.value?.$el||c.value;return e?Array.from(e.querySelectorAll(r.SEGMENTED_CONTROL_ITEM_SELECTOR)):[]}function g(e){l.value=e}async function _(e,{animate:t=!0}={}){if(o.disabled||e===o.modelValue)return;let n=new Event(`before-change`,{cancelable:!0});if(s(`before-change`,n),n.defaultPrevented)return;m.cancel();let a=t&&o.showIndicatorTransition?m.snapshot(`[aria-checked="true"]`):null;if(s(`update:modelValue`,e),s(`change`,e),!a)return;await(0,i.nextTick)();let l=(c.value?.$el||c.value)?.querySelector(`[${r.SEGMENTED_CONTROL_DATA_VALUE_ATTR}="${CSS.escape(e)}"]`);l&&m.animate({oldRect:a.rect,newEl:l,orientation:o.orientation,hideProps:{backgroundColor:`transparent`},indicatorExtra:{backgroundColor:`var(--button-color-background)`},pseudoElement:`::after`})}function v(e,t){if(t){let n=t.target.closest(r.SEGMENTED_CONTROL_ITEM_SELECTOR);if(n){let t=e.indexOf(n);if(t!==-1)return t}}let n=e.findIndex(e=>{let t=e.getAttribute(r.SEGMENTED_CONTROL_DATA_VALUE_ATTR);return l.value?t===l.value:e.getAttribute(`aria-checked`)===`true`});return n===-1?0:n}function y(e){b(e)||_(e.getAttribute(r.SEGMENTED_CONTROL_DATA_VALUE_ATTR))}function b(e){return e.getAttribute(`aria-disabled`)===`true`}function x(e,t,n){let r=e.length;for(let i=1;i<=r;i++){let a=(t+i*n+r)%r;if(!b(e[a]))return a}return t}function S(e,t,n){let r=o.orientation===`horizontal`,i=r?`ArrowRight`:`ArrowDown`,a=r?`ArrowLeft`:`ArrowUp`;switch(e){case i:return x(n,t,1);case a:return x(n,t,-1);case`Home`:return x(n,n.length-1,1);case`End`:return x(n,0,-1);default:return-1}}function C(e){let t=h();if(!t.length)return;let n=v(t,e);if(e.key===`Enter`||e.key===` `){y(t[n]),e.preventDefault(),e.stopPropagation();return}let i=S(e.key,n,t);if(i!==-1&&(e.preventDefault(),e.stopPropagation(),t[i].focus(),o.activationMode===`auto`)){m.cancel();let e=t[i].getAttribute(r.SEGMENTED_CONTROL_DATA_VALUE_ATTR);b(t[i])||_(e,{animate:!1})}}return(n,r)=>((0,i.openBlock)(),(0,i.createBlock)((0,i.unref)(t.default),{id:e.id,ref_key:`container`,ref:c,align:`stretch`,class:(0,i.normalizeClass)(d.value),direction:u.value,role:`radiogroup`,"aria-label":e.ariaLabel,"aria-orientation":e.orientation,"data-qa":`dt-segmented-control`,onKeydown:C},{default:(0,i.withCtx)(()=>[(0,i.renderSlot)(n.$slots,`default`)]),_:3},8,[`id`,`class`,`direction`,`aria-label`,`aria-orientation`]))}});exports.default=a;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../common/validators/index.cjs`),t=require(`../../common/utils/index.cjs`),n=require(`../stack/stack.cjs`),r=require(`../../common/composables/use-indicator-animation.cjs`),i=require(`./segmented-control-constants.cjs`);let a=require(`vue`);var o=Object.assign({name:`DtSegmentedControl`},{__name:`SegmentedControl`,props:{id:{type:String,default(){return t.getUniqueString()}},modelValue:{type:String,required:!0},ariaLabel:{type:String,default:void 0},orientation:{type:String,default:i.SEGMENTED_CONTROL_ORIENTATION_DEFAULT,validator:e=>i.SEGMENTED_CONTROL_ORIENTATIONS.includes(e)},size:{type:[String,Number],default:200,validator:e.ordinalSizeValidator(i.SEGMENTED_CONTROL_SIZES)},activationMode:{type:String,default:i.SEGMENTED_CONTROL_ACTIVATION_MODE_DEFAULT,validator:e=>i.SEGMENTED_CONTROL_ACTIVATION_MODES.includes(e)},disabled:{type:Boolean,default:!1},showDivider:{type:Boolean,default:!0},borderless:{type:Boolean,default:!1},spread:{type:String,default:i.SEGMENTED_CONTROL_SPREAD_DEFAULT,validator:e=>i.SEGMENTED_CONTROL_SPREADS.includes(e)},labelClass:{type:[String,Array,Object],default:``},showIndicatorTransition:{type:Boolean,default:!0}},emits:[`update:modelValue`,`change`,`before-change`],setup(e,{emit:t}){let o=e,s=t,c=(0,a.ref)(null),l=(0,a.ref)(null),u=(0,a.computed)(()=>o.orientation===`vertical`?`column`:`row`),d=(0,a.computed)(()=>[`d-segmented-control`,i.SEGMENTED_CONTROL_SIZE_MODIFIERS[String(o.size)],o.showDivider?null:`d-segmented-control--hide-divider`,o.borderless?`d-segmented-control--borderless`:null,o.orientation===`vertical`?`d-segmented-control--vertical`:null,o.spread===`evenly`&&o.orientation===`horizontal`?`d-segmented-control--spread-evenly`:null]),f=(0,a.reactive)({selected:o.modelValue,disabled:o.disabled,size:o.size,labelClass:o.labelClass});(0,a.watchEffect)(()=>{f.selected=o.modelValue,f.disabled=o.disabled,f.size=o.size,f.labelClass=o.labelClass}),(0,a.provide)(i.SEGMENTED_CONTROL_CONTEXT_KEY,f),(0,a.provide)(i.SEGMENTED_CONTROL_SELECT_KEY,_),(0,a.provide)(i.SEGMENTED_CONTROL_FOCUS_KEY,g);function p(){let e=h();if(!e.length||e.some(e=>e.getAttribute(`tabindex`)===`0`))return;let t=e.find(e=>!b(e));t&&t.setAttribute(`tabindex`,`0`)}let m=r.useIndicatorAnimation(c,`--segmented-indicator-duration`,`--segmented-indicator-easing`);(0,a.onMounted)(p),(0,a.watch)(()=>[o.modelValue,o.disabled],p,{flush:`post`});function h(){let e=c.value?.$el||c.value;return e?Array.from(e.querySelectorAll(i.SEGMENTED_CONTROL_ITEM_SELECTOR)):[]}function g(e){l.value=e}async function _(e,{animate:t=!0}={}){if(o.disabled||e===o.modelValue)return;let n=new Event(`before-change`,{cancelable:!0});if(s(`before-change`,n),n.defaultPrevented)return;m.cancel();let r=t&&o.showIndicatorTransition?m.snapshot(`[aria-checked="true"]`):null;if(s(`update:modelValue`,e),s(`change`,e),!r)return;await(0,a.nextTick)();let l=(c.value?.$el||c.value)?.querySelector(`[${i.SEGMENTED_CONTROL_DATA_VALUE_ATTR}="${CSS.escape(e)}"]`);l&&m.animate({oldRect:r.rect,newEl:l,orientation:o.orientation,hideProps:{backgroundColor:`transparent`},indicatorExtra:{backgroundColor:`var(--button-color-background)`},pseudoElement:`::after`})}function v(e,t){if(t){let n=t.target.closest(i.SEGMENTED_CONTROL_ITEM_SELECTOR);if(n){let t=e.indexOf(n);if(t!==-1)return t}}let n=e.findIndex(e=>{let t=e.getAttribute(i.SEGMENTED_CONTROL_DATA_VALUE_ATTR);return l.value?t===l.value:e.getAttribute(`aria-checked`)===`true`});return n===-1?0:n}function y(e){b(e)||_(e.getAttribute(i.SEGMENTED_CONTROL_DATA_VALUE_ATTR))}function b(e){return e.getAttribute(`aria-disabled`)===`true`}function x(e,t,n){let r=e.length;for(let i=1;i<=r;i++){let a=(t+i*n+r)%r;if(!b(e[a]))return a}return t}function S(e,t,n){let r=o.orientation===`horizontal`,i=r?`ArrowRight`:`ArrowDown`,a=r?`ArrowLeft`:`ArrowUp`;switch(e){case i:return x(n,t,1);case a:return x(n,t,-1);case`Home`:return x(n,n.length-1,1);case`End`:return x(n,0,-1);default:return-1}}function C(e){let t=h();if(!t.length)return;let n=v(t,e);if(e.key===`Enter`||e.key===` `){y(t[n]),e.preventDefault(),e.stopPropagation();return}let r=S(e.key,n,t);if(r!==-1&&(e.preventDefault(),e.stopPropagation(),t[r].focus(),o.activationMode===`auto`)){m.cancel();let e=t[r].getAttribute(i.SEGMENTED_CONTROL_DATA_VALUE_ATTR);b(t[r])||_(e,{animate:!1})}}return(t,r)=>((0,a.openBlock)(),(0,a.createBlock)((0,a.unref)(n.default),{id:e.id,ref_key:`container`,ref:c,align:`stretch`,class:(0,a.normalizeClass)(d.value),direction:u.value,role:`radiogroup`,"aria-label":e.ariaLabel,"aria-orientation":e.orientation,"data-qa":`dt-segmented-control`,onKeydown:C},{default:(0,a.withCtx)(()=>[(0,a.renderSlot)(t.$slots,`default`)]),_:3},8,[`id`,`class`,`direction`,`aria-label`,`aria-orientation`]))}});exports.default=o;
 //# sourceMappingURL=segmented-control.cjs.map

package/dist/lib/segmented-control/segmented-control.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"segmented-control.cjs","names":[],"sources":["../../../components/SegmentedControl/SegmentedControl.vue"],"sourcesContent":["<template>\n  <dt-stack\n    :id=\"id\"\n    ref=\"container\"\n    align=\"stretch\"\n    :class=\"containerClasses\"\n    :direction=\"stackDirection\"\n    role=\"radiogroup\"\n    :aria-label=\"ariaLabel\"\n    :aria-orientation=\"orientation\"\n    data-qa=\"dt-segmented-control\"\n    @keydown=\"handleKeyDown\"\n  >\n    <!-- @slot DtSegmentedControlItem children -->\n    <slot />\n  </dt-stack>\n</template>\n\n<script setup>\nimport { ref, computed, reactive, watchEffect, watch, provide, onMounted, nextTick } from 'vue';\nimport { getUniqueString } from '@/common/utils';\nimport { DtStack } from '@/components/Stack';\nimport { useIndicatorAnimation } from '@/common/composables/useIndicatorAnimation';\nimport {\n  SEGMENTED_CONTROL_SIZES,\n  SEGMENTED_CONTROL_SIZE_DEFAULT,\n  SEGMENTED_CONTROL_SIZE_MODIFIERS,\n  SEGMENTED_CONTROL_ORIENTATIONS,\n  SEGMENTED_CONTROL_ORIENTATION_DEFAULT,\n  SEGMENTED_CONTROL_ACTIVATION_MODES,\n  SEGMENTED_CONTROL_ACTIVATION_MODE_DEFAULT,\n  SEGMENTED_CONTROL_SPREADS,\n  SEGMENTED_CONTROL_SPREAD_DEFAULT,\n  SEGMENTED_CONTROL_CONTEXT_KEY,\n  SEGMENTED_CONTROL_SELECT_KEY,\n  SEGMENTED_CONTROL_FOCUS_KEY,\n  SEGMENTED_CONTROL_ITEM_SELECTOR,\n  SEGMENTED_CONTROL_DATA_VALUE_ATTR,\n} from './SegmentedControlConstants.js';\n\ndefineOptions({ name: 'DtSegmentedControl' });\n\nconst props = defineProps({\n  /**\n   * Element ID for the radiogroup container.\n   * Auto-generated if not provided.\n   */\n  id: {\n    type: String,\n    default () { return getUniqueString(); },\n  },\n\n  /**\n   * The currently selected value (v-model).\n   */\n  modelValue: {\n    type: String,\n    required: true,\n  },\n\n  /**\n   * Accessible label for the radiogroup.\n   */\n  ariaLabel: {\n    type: String,\n    default: undefined,\n  },\n\n  /**\n   * Orientation of the segmented control.\n   * Maps to DtStack direction: horizontal -> row, vertical -> column.\n   * @values horizontal, vertical\n   */\n  orientation: {\n    type: String,\n    default: SEGMENTED_CONTROL_ORIENTATION_DEFAULT,\n    validator: (v) => SEGMENTED_CONTROL_ORIENTATIONS.includes(v),\n  },\n\n  /**\n   * DtButton size for all items. Inherited by children via provide.\n   * @values 100, 200, 300, 400, 500\n   */\n  size: {\n    type: [String, Number],\n    default: SEGMENTED_CONTROL_SIZE_DEFAULT,\n    validator: (v) => SEGMENTED_CONTROL_SIZES.includes(String(v)),\n  },\n\n  /**\n   * Controls whether items are selected on focus (auto) or on click/Space/Enter (manual).\n   * @values auto, manual\n   */\n  activationMode: {\n    type: String,\n    default: SEGMENTED_CONTROL_ACTIVATION_MODE_DEFAULT,\n    validator: (v) => SEGMENTED_CONTROL_ACTIVATION_MODES.includes(v),\n  },\n\n  /**\n   * Disables all items in the group.\n   * Per-item disabled is set via the disabled prop on DtSegmentedControlItem.\n   */\n  disabled: {\n    type: Boolean,\n    default: false,\n  },\n\n  /**\n   * Shows the dividers between items.\n   */\n  showDivider: {\n    type: Boolean,\n    default: true,\n  },\n\n  /**\n   * Removes the border and padding from the container.\n   */\n  borderless: {\n    type: Boolean,\n    default: false,\n  },\n\n  /**\n   * Controls how items distribute space.\n   * 'grow' (default): items size to their content.\n   * 'evenly': items share space equally.\n   * @values grow, evenly\n   */\n  spread: {\n    type: String,\n    default: SEGMENTED_CONTROL_SPREAD_DEFAULT,\n    validator: (v) => SEGMENTED_CONTROL_SPREADS.includes(v),\n  },\n\n  /**\n   * Default label class for all items. Items can override with their own labelClass prop.\n   */\n  labelClass: {\n    type: [String, Array, Object],\n    default: '',\n  },\n\n  /**\n   * If true, the selection indicator animates between items on click.\n   * @values true, false\n   */\n  showIndicatorTransition: {\n    type: Boolean,\n    default: true,\n  },\n});\n\nconst emit = defineEmits([\n  /**\n   * v-model event. Emitted when the selected value changes.\n   * @event update:modelValue\n   * @type {String}\n   */\n  'update:modelValue',\n\n  /**\n   * Emitted when the user selects an item (click, Enter, Space, or arrow in auto mode).\n   * Not emitted for programmatic modelValue changes.\n   * @event change\n   * @type {String}\n   */\n  'change',\n\n  /**\n   * Emitted before a selection change. Call event.preventDefault() to cancel the change.\n   * @event before-change\n   * @type {Event}\n   */\n  'before-change',\n]);\n\nconst container = ref(null);\nconst focusedValue = ref(null);\n\nconst stackDirection = computed(() => props.orientation === 'vertical' ? 'column' : 'row');\n\nconst containerClasses = computed(() => [\n  'd-segmented-control',\n  SEGMENTED_CONTROL_SIZE_MODIFIERS[String(props.size)],\n  !props.showDivider ? 'd-segmented-control--hide-divider' : null,\n  props.borderless ? 'd-segmented-control--borderless' : null,\n  props.orientation === 'vertical' ? 'd-segmented-control--vertical' : null,\n  props.spread === 'evenly' && props.orientation === 'horizontal'\n    ? 'd-segmented-control--spread-evenly'\n    : null,\n]);\n\n// Reactive context provided to children\nconst groupContext = reactive({\n  selected: props.modelValue,\n  disabled: props.disabled,\n  size: props.size,\n  labelClass: props.labelClass,\n});\n\nwatchEffect(() => {\n  groupContext.selected = props.modelValue;\n  groupContext.disabled = props.disabled;\n  groupContext.size = props.size;\n  groupContext.labelClass = props.labelClass;\n});\n\nprovide(SEGMENTED_CONTROL_CONTEXT_KEY, groupContext);\nprovide(SEGMENTED_CONTROL_SELECT_KEY, selectValue);\nprovide(SEGMENTED_CONTROL_FOCUS_KEY, setFocus);\n\n// Ensures at least one enabled item is tabbable (WAI-ARIA radiogroup requirement).\n// Items set tabindex based on isSelected && !isDisabled. If the selected item is disabled\n// or modelValue doesn't match any item, no item has tabindex=\"0\". This fallback sets\n// tabindex=\"0\" on the first enabled item so keyboard users can reach the control.\nfunction ensureTabbable () {\n  const items = getItems();\n  if (!items.length) return;\n  const hasTabbable = items.some(el => el.getAttribute('tabindex') === '0');\n  if (hasTabbable) return;\n  const firstEnabled = items.find(el => !isItemDisabled(el));\n  if (firstEnabled) firstEnabled.setAttribute('tabindex', '0');\n}\n\nconst indicator = useIndicatorAnimation(\n  container, '--segmented-indicator-duration', '--segmented-indicator-easing',\n);\n\nonMounted(ensureTabbable);\n\nwatch(() => [props.modelValue, props.disabled], ensureTabbable, { flush: 'post' });\n\nfunction getItems () {\n  const el = container.value?.$el || container.value;\n  return el ? Array.from(el.querySelectorAll(SEGMENTED_CONTROL_ITEM_SELECTOR)) : [];\n}\n\nfunction setFocus (value) {\n  focusedValue.value = value;\n}\n\nasync function selectValue (value, { animate: shouldAnimate = true } = {}) {\n  if (props.disabled) return;\n  if (value === props.modelValue) return;\n  const beforeChangeEvent = new Event('before-change', { cancelable: true });\n  emit('before-change', beforeChangeEvent);\n  if (beforeChangeEvent.defaultPrevented) return;\n\n  indicator.cancel();\n  const shouldTransition = shouldAnimate && props.showIndicatorTransition;\n  const old = shouldTransition ? indicator.snapshot('[aria-checked=\"true\"]') : null;\n\n  emit('update:modelValue', value);\n  emit('change', value);\n\n  if (!old) return;\n\n  await nextTick();\n  const newEl = (container.value?.$el || container.value)\n    ?.querySelector(`[${SEGMENTED_CONTROL_DATA_VALUE_ATTR}=\"${CSS.escape(value)}\"]`);\n  if (!newEl) return;\n\n  indicator.animate({\n    oldRect: old.rect,\n    newEl,\n    orientation: props.orientation,\n    hideProps: { backgroundColor: 'transparent' },\n    indicatorExtra: { backgroundColor: 'var(--button-color-background)' },\n    pseudoElement: '::after',\n  });\n}\n\nfunction getFocusedIndex (items, event) {\n  // First check event.target — the element that actually has focus\n  if (event) {\n    const target = event.target.closest(SEGMENTED_CONTROL_ITEM_SELECTOR);\n    if (target) {\n      const targetIdx = items.indexOf(target);\n      if (targetIdx !== -1) return targetIdx;\n    }\n  }\n  // Fall back to tracked focusedValue, then aria-checked\n  const idx = items.findIndex(el => {\n    const value = el.getAttribute(SEGMENTED_CONTROL_DATA_VALUE_ATTR);\n    return focusedValue.value ? value === focusedValue.value : el.getAttribute('aria-checked') === 'true';\n  });\n  return idx === -1 ? 0 : idx;\n}\n\nfunction activateItem (item) {\n  if (isItemDisabled(item)) return;\n  selectValue(item.getAttribute(SEGMENTED_CONTROL_DATA_VALUE_ATTR));\n}\n\nfunction isItemDisabled (item) {\n  return item.getAttribute('aria-disabled') === 'true';\n}\n\nfunction findNextEnabled (items, fromIndex, direction) {\n  const len = items.length;\n  for (let i = 1; i <= len; i++) {\n    const index = (fromIndex + i * direction + len) % len;\n    if (!isItemDisabled(items[index])) return index;\n  }\n  return fromIndex;\n}\n\nfunction getNavigationIndex (key, currentIndex, items) {\n  const isHorizontal = props.orientation === 'horizontal';\n  const nextKey = isHorizontal ? 'ArrowRight' : 'ArrowDown';\n  const prevKey = isHorizontal ? 'ArrowLeft' : 'ArrowUp';\n\n  switch (key) {\n    case nextKey: return findNextEnabled(items, currentIndex, 1);\n    case prevKey: return findNextEnabled(items, currentIndex, -1);\n    case 'Home': return findNextEnabled(items, items.length - 1, 1);\n    case 'End': return findNextEnabled(items, 0, -1);\n    default: return -1;\n  }\n}\n\nfunction handleKeyDown (event) {\n  const items = getItems();\n  if (!items.length) return;\n\n  const focusedIndex = getFocusedIndex(items, event);\n\n  if (event.key === 'Enter' || event.key === ' ') {\n    activateItem(items[focusedIndex]);\n    event.preventDefault();\n    event.stopPropagation();\n    return;\n  }\n\n  const newIndex = getNavigationIndex(event.key, focusedIndex, items);\n  if (newIndex === -1) return;\n\n  event.preventDefault();\n  event.stopPropagation();\n  items[newIndex].focus();\n\n  if (props.activationMode === 'auto') {\n    indicator.cancel();\n    const value = items[newIndex].getAttribute(SEGMENTED_CONTROL_DATA_VALUE_ATTR);\n    if (!isItemDisabled(items[newIndex])) {\n      selectValue(value, { animate: false });\n    }\n  }\n}\n</script>\n"],"mappings":"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"}
+{"version":3,"file":"segmented-control.cjs","names":[],"sources":["../../../components/SegmentedControl/SegmentedControl.vue"],"sourcesContent":["<template>\n  <dt-stack\n    :id=\"id\"\n    ref=\"container\"\n    align=\"stretch\"\n    :class=\"containerClasses\"\n    :direction=\"stackDirection\"\n    role=\"radiogroup\"\n    :aria-label=\"ariaLabel\"\n    :aria-orientation=\"orientation\"\n    data-qa=\"dt-segmented-control\"\n    @keydown=\"handleKeyDown\"\n  >\n    <!-- @slot DtSegmentedControlItem children -->\n    <slot />\n  </dt-stack>\n</template>\n\n<script setup>\nimport { ref, computed, reactive, watchEffect, watch, provide, onMounted, nextTick } from 'vue';\nimport { getUniqueString } from '@/common/utils';\nimport { DtStack } from '@/components/Stack';\nimport { useIndicatorAnimation } from '@/common/composables/useIndicatorAnimation';\nimport { ordinalSizeValidator } from '@/common/validators';\nimport {\n  SEGMENTED_CONTROL_SIZES,\n  SEGMENTED_CONTROL_SIZE_DEFAULT,\n  SEGMENTED_CONTROL_SIZE_MODIFIERS,\n  SEGMENTED_CONTROL_ORIENTATIONS,\n  SEGMENTED_CONTROL_ORIENTATION_DEFAULT,\n  SEGMENTED_CONTROL_ACTIVATION_MODES,\n  SEGMENTED_CONTROL_ACTIVATION_MODE_DEFAULT,\n  SEGMENTED_CONTROL_SPREADS,\n  SEGMENTED_CONTROL_SPREAD_DEFAULT,\n  SEGMENTED_CONTROL_CONTEXT_KEY,\n  SEGMENTED_CONTROL_SELECT_KEY,\n  SEGMENTED_CONTROL_FOCUS_KEY,\n  SEGMENTED_CONTROL_ITEM_SELECTOR,\n  SEGMENTED_CONTROL_DATA_VALUE_ATTR,\n} from './SegmentedControlConstants.js';\n\ndefineOptions({ name: 'DtSegmentedControl' });\n\nconst props = defineProps({\n  /**\n   * Element ID for the radiogroup container.\n   * Auto-generated if not provided.\n   */\n  id: {\n    type: String,\n    default () { return getUniqueString(); },\n  },\n\n  /**\n   * The currently selected value (v-model).\n   */\n  modelValue: {\n    type: String,\n    required: true,\n  },\n\n  /**\n   * Accessible label for the radiogroup.\n   */\n  ariaLabel: {\n    type: String,\n    default: undefined,\n  },\n\n  /**\n   * Orientation of the segmented control.\n   * Maps to DtStack direction: horizontal -> row, vertical -> column.\n   * @values horizontal, vertical\n   */\n  orientation: {\n    type: String,\n    default: SEGMENTED_CONTROL_ORIENTATION_DEFAULT,\n    validator: (v) => SEGMENTED_CONTROL_ORIENTATIONS.includes(v),\n  },\n\n  /**\n   * DtButton size for all items. Inherited by children via provide.\n   * @values 100, 200, 300, 400, 500\n   */\n  size: {\n    type: [String, Number],\n    default: SEGMENTED_CONTROL_SIZE_DEFAULT,\n    validator: ordinalSizeValidator(SEGMENTED_CONTROL_SIZES),\n  },\n\n  /**\n   * Controls whether items are selected on focus (auto) or on click/Space/Enter (manual).\n   * @values auto, manual\n   */\n  activationMode: {\n    type: String,\n    default: SEGMENTED_CONTROL_ACTIVATION_MODE_DEFAULT,\n    validator: (v) => SEGMENTED_CONTROL_ACTIVATION_MODES.includes(v),\n  },\n\n  /**\n   * Disables all items in the group.\n   * Per-item disabled is set via the disabled prop on DtSegmentedControlItem.\n   */\n  disabled: {\n    type: Boolean,\n    default: false,\n  },\n\n  /**\n   * Shows the dividers between items.\n   */\n  showDivider: {\n    type: Boolean,\n    default: true,\n  },\n\n  /**\n   * Removes the border and padding from the container.\n   */\n  borderless: {\n    type: Boolean,\n    default: false,\n  },\n\n  /**\n   * Controls how items distribute space.\n   * 'grow' (default): items size to their content.\n   * 'evenly': items share space equally.\n   * @values grow, evenly\n   */\n  spread: {\n    type: String,\n    default: SEGMENTED_CONTROL_SPREAD_DEFAULT,\n    validator: (v) => SEGMENTED_CONTROL_SPREADS.includes(v),\n  },\n\n  /**\n   * Default label class for all items. Items can override with their own labelClass prop.\n   */\n  labelClass: {\n    type: [String, Array, Object],\n    default: '',\n  },\n\n  /**\n   * If true, the selection indicator animates between items on click.\n   * @values true, false\n   */\n  showIndicatorTransition: {\n    type: Boolean,\n    default: true,\n  },\n});\n\nconst emit = defineEmits([\n  /**\n   * v-model event. Emitted when the selected value changes.\n   * @event update:modelValue\n   * @type {String}\n   */\n  'update:modelValue',\n\n  /**\n   * Emitted when the user selects an item (click, Enter, Space, or arrow in auto mode).\n   * Not emitted for programmatic modelValue changes.\n   * @event change\n   * @type {String}\n   */\n  'change',\n\n  /**\n   * Emitted before a selection change. Call event.preventDefault() to cancel the change.\n   * @event before-change\n   * @type {Event}\n   */\n  'before-change',\n]);\n\nconst container = ref(null);\nconst focusedValue = ref(null);\n\nconst stackDirection = computed(() => props.orientation === 'vertical' ? 'column' : 'row');\n\nconst containerClasses = computed(() => [\n  'd-segmented-control',\n  SEGMENTED_CONTROL_SIZE_MODIFIERS[String(props.size)],\n  !props.showDivider ? 'd-segmented-control--hide-divider' : null,\n  props.borderless ? 'd-segmented-control--borderless' : null,\n  props.orientation === 'vertical' ? 'd-segmented-control--vertical' : null,\n  props.spread === 'evenly' && props.orientation === 'horizontal'\n    ? 'd-segmented-control--spread-evenly'\n    : null,\n]);\n\n// Reactive context provided to children\nconst groupContext = reactive({\n  selected: props.modelValue,\n  disabled: props.disabled,\n  size: props.size,\n  labelClass: props.labelClass,\n});\n\nwatchEffect(() => {\n  groupContext.selected = props.modelValue;\n  groupContext.disabled = props.disabled;\n  groupContext.size = props.size;\n  groupContext.labelClass = props.labelClass;\n});\n\nprovide(SEGMENTED_CONTROL_CONTEXT_KEY, groupContext);\nprovide(SEGMENTED_CONTROL_SELECT_KEY, selectValue);\nprovide(SEGMENTED_CONTROL_FOCUS_KEY, setFocus);\n\n// Ensures at least one enabled item is tabbable (WAI-ARIA radiogroup requirement).\n// Items set tabindex based on isSelected && !isDisabled. If the selected item is disabled\n// or modelValue doesn't match any item, no item has tabindex=\"0\". This fallback sets\n// tabindex=\"0\" on the first enabled item so keyboard users can reach the control.\nfunction ensureTabbable () {\n  const items = getItems();\n  if (!items.length) return;\n  const hasTabbable = items.some(el => el.getAttribute('tabindex') === '0');\n  if (hasTabbable) return;\n  const firstEnabled = items.find(el => !isItemDisabled(el));\n  if (firstEnabled) firstEnabled.setAttribute('tabindex', '0');\n}\n\nconst indicator = useIndicatorAnimation(\n  container, '--segmented-indicator-duration', '--segmented-indicator-easing',\n);\n\nonMounted(ensureTabbable);\n\nwatch(() => [props.modelValue, props.disabled], ensureTabbable, { flush: 'post' });\n\nfunction getItems () {\n  const el = container.value?.$el || container.value;\n  return el ? Array.from(el.querySelectorAll(SEGMENTED_CONTROL_ITEM_SELECTOR)) : [];\n}\n\nfunction setFocus (value) {\n  focusedValue.value = value;\n}\n\nasync function selectValue (value, { animate: shouldAnimate = true } = {}) {\n  if (props.disabled) return;\n  if (value === props.modelValue) return;\n  const beforeChangeEvent = new Event('before-change', { cancelable: true });\n  emit('before-change', beforeChangeEvent);\n  if (beforeChangeEvent.defaultPrevented) return;\n\n  indicator.cancel();\n  const shouldTransition = shouldAnimate && props.showIndicatorTransition;\n  const old = shouldTransition ? indicator.snapshot('[aria-checked=\"true\"]') : null;\n\n  emit('update:modelValue', value);\n  emit('change', value);\n\n  if (!old) return;\n\n  await nextTick();\n  const newEl = (container.value?.$el || container.value)\n    ?.querySelector(`[${SEGMENTED_CONTROL_DATA_VALUE_ATTR}=\"${CSS.escape(value)}\"]`);\n  if (!newEl) return;\n\n  indicator.animate({\n    oldRect: old.rect,\n    newEl,\n    orientation: props.orientation,\n    hideProps: { backgroundColor: 'transparent' },\n    indicatorExtra: { backgroundColor: 'var(--button-color-background)' },\n    pseudoElement: '::after',\n  });\n}\n\nfunction getFocusedIndex (items, event) {\n  // First check event.target — the element that actually has focus\n  if (event) {\n    const target = event.target.closest(SEGMENTED_CONTROL_ITEM_SELECTOR);\n    if (target) {\n      const targetIdx = items.indexOf(target);\n      if (targetIdx !== -1) return targetIdx;\n    }\n  }\n  // Fall back to tracked focusedValue, then aria-checked\n  const idx = items.findIndex(el => {\n    const value = el.getAttribute(SEGMENTED_CONTROL_DATA_VALUE_ATTR);\n    return focusedValue.value ? value === focusedValue.value : el.getAttribute('aria-checked') === 'true';\n  });\n  return idx === -1 ? 0 : idx;\n}\n\nfunction activateItem (item) {\n  if (isItemDisabled(item)) return;\n  selectValue(item.getAttribute(SEGMENTED_CONTROL_DATA_VALUE_ATTR));\n}\n\nfunction isItemDisabled (item) {\n  return item.getAttribute('aria-disabled') === 'true';\n}\n\nfunction findNextEnabled (items, fromIndex, direction) {\n  const len = items.length;\n  for (let i = 1; i <= len; i++) {\n    const index = (fromIndex + i * direction + len) % len;\n    if (!isItemDisabled(items[index])) return index;\n  }\n  return fromIndex;\n}\n\nfunction getNavigationIndex (key, currentIndex, items) {\n  const isHorizontal = props.orientation === 'horizontal';\n  const nextKey = isHorizontal ? 'ArrowRight' : 'ArrowDown';\n  const prevKey = isHorizontal ? 'ArrowLeft' : 'ArrowUp';\n\n  switch (key) {\n    case nextKey: return findNextEnabled(items, currentIndex, 1);\n    case prevKey: return findNextEnabled(items, currentIndex, -1);\n    case 'Home': return findNextEnabled(items, items.length - 1, 1);\n    case 'End': return findNextEnabled(items, 0, -1);\n    default: return -1;\n  }\n}\n\nfunction handleKeyDown (event) {\n  const items = getItems();\n  if (!items.length) return;\n\n  const focusedIndex = getFocusedIndex(items, event);\n\n  if (event.key === 'Enter' || event.key === ' ') {\n    activateItem(items[focusedIndex]);\n    event.preventDefault();\n    event.stopPropagation();\n    return;\n  }\n\n  const newIndex = getNavigationIndex(event.key, focusedIndex, items);\n  if (newIndex === -1) return;\n\n  event.preventDefault();\n  event.stopPropagation();\n  items[newIndex].focus();\n\n  if (props.activationMode === 'auto') {\n    indicator.cancel();\n    const value = items[newIndex].getAttribute(SEGMENTED_CONTROL_DATA_VALUE_ATTR);\n    if (!isItemDisabled(items[newIndex])) {\n      selectValue(value, { animate: false });\n    }\n  }\n}\n</script>\n"],"mappings":"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"}