@dialpad/dialtone-vue 3.220.0-next.4 → 3.220.0

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

@@ -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          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      v-if=\"$slots.description || description || hasMessages\"\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        :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 { DtText, TEXT_SIZE_MODIFIERS, TEXT_STRENGTH_MODIFIERS } from '@/components/text';\nimport { hasSlotContent, removeClassStyleAttrs } 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, 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    };\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\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":"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"}
+{"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":"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"}

package/dist/lib/radio/radio.js

@@ -1,67 +1,38 @@
-import { hasSlotContent as e, removeClassStyleAttrs as t } from "../../common/utils/index.js";
-import { CheckableMixin as n, GroupableMixin as r, InputMixin as i, MessagesMixin as a } from "../../common/mixins/input.js";
-import { t as o } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
-import s from "../validation-messages/validation-messages.js";
-import { TEXT_SIZE_MODIFIERS as c, TEXT_STRENGTH_MODIFIERS as l } from "../text/text-constants.js";
-import u from "../text/text.js";
-import { RADIO_INPUT_VALIDATION_CLASSES as d } from "./radio-constants.js";
-import { createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createTextVNode as g, createVNode as _, mergeProps as v, normalizeClass as y, normalizeStyle as b, openBlock as x, renderSlot as S, resolveComponent as C, toDisplayString as w, toHandlers as T, withCtx as E } from "vue";
+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 D = {
+var S = {
 	compatConfig: { MODE: 3 },
 	name: "DtRadio",
-	components: {
-		DtValidationMessages: s,
-		DtText: u
-	},
+	components: { DtValidationMessages: c },
 	mixins: [
-		i,
-		n,
+		a,
 		r,
-		a
+		i,
+		o
 	],
 	inheritAttrs: !1,
-	props: {
-		value: {
-			type: [String, Number],
-			default: ""
-		},
-		showLabel: {
-			type: Boolean,
-			default: !0
-		},
-		labelSize: {
-			type: [String, Number],
-			default: null,
-			validator: (e) => c.label.includes(String(e))
-		},
-		labelStrength: {
-			type: String,
-			default: null,
-			validator: (e) => Object.keys(l).includes(e)
-		}
-	},
+	props: { value: {
+		type: [String, Number],
+		default: ""
+	} },
 	emits: [
+		"input",
 		"update:modelValue",
 		"focus",
 		"focusin",
 		"focusout"
 	],
 	data() {
-		return { hasSlotContent: e };
+		return { hasSlotContent: t };
 	},
 	computed: {
-		hasLabelContent() {
-			return !!(this.$slots.default || this.label);
-		},
-		hasLabel() {
-			return this.showLabel && this.hasLabelContent;
-		},
-		resolvedLabelSize() {
-			return this.labelSize ?? 300;
-		},
 		inputValidationClass() {
-			return d[this.internalValidationState];
+			return l[this.internalValidationState];
 		},
 		radioGroupValue() {
 			return this.groupContext?.selectedValue;
@@ -84,35 +55,26 @@ var D = {
 			this.hasGroup && (this.internalChecked = e === this.value);
 		}
 	} },
-	mounted() {
-		this.runValidations();
-	},
 	methods: {
-		removeClassStyleAttrs: t,
-		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));
 		}
 	}
-}, O = { class: "d-radio__input" }, k = [
+}, C = { class: "d-radio__input" }, w = [
 	"checked",
 	"name",
 	"value",
-	"disabled",
-	"aria-label"
-], A = {
+	"disabled"
+], T = {
 	key: 0,
 	class: "d-radio__messages",
 	"data-qa": "radio-description-messages"
 };
-function j(e, t, n, r, i, a) {
-	let o = C("dt-text"), s = C("dt-validation-messages");
-	return x(), m("div", {
-		class: y(e.$attrs.class),
-		style: b(e.$attrs.style)
-	}, [h("label", { class: y(["d-radio-group", { "d-radio-group--disabled": e.internalDisabled }]) }, [h("div", O, [h("input", v({
+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,
@@ -122,35 +84,11 @@ function j(e, t, n, r, i, a) {
 			"d-radio",
 			a.inputValidationClass,
 			e.inputClass
-		],
-		"aria-label": !n.showLabel && e.label ? e.label : void 0
-	}, a.removeClassStyleAttrs(e.$attrs), T(a.inputListeners, !0)), null, 16, k)]), a.hasLabel ? (x(), f(o, v({
-		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: E(() => [S(e.$slots, "default", {}, () => [g(w(e.label), 1)])]),
-		_: 3
-	}, 16, [
-		"size",
-		"strength",
-		"tone",
-		"class"
-	])) : p("", !0)], 2), e.$slots.description || e.description || a.hasMessages ? (x(), m("div", A, [e.$slots.description || e.description ? (x(), f(o, v({
+		]
+	}, 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: E(() => [S(e.$slots, "description", {}, () => [g(w(e.description), 1)])]),
-		_: 3
-	}, 16, ["class"])) : p("", !0), _(s, v({
+	}, 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
@@ -158,10 +96,10 @@ function j(e, t, n, r, i, a) {
 		"validation-messages",
 		"show-messages",
 		"class"
-	])])) : p("", !0)], 6);
+	])])) : u("", !0)], 16);
 }
-var M = /* @__PURE__ */ o(D, [["render", j]]);
+var D = /* @__PURE__ */ s(S, [["render", E]]);
 //#endregion
-export { M as default };
+export { D as default };
 
 //# sourceMappingURL=radio.js.map

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

@@ -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          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      v-if=\"$slots.description || description || hasMessages\"\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        :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 { DtText, TEXT_SIZE_MODIFIERS, TEXT_STRENGTH_MODIFIERS } from '@/components/text';\nimport { hasSlotContent, removeClassStyleAttrs } 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, 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    };\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\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":"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"}
+{"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

@@ -1,2 +1,2 @@
-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:[`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

@@ -1 +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     */\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,aAAc,CAAE,KAAM,EAAG,CACzB,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"}
+{"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"}

package/dist/lib/radio-group/radio-group.js

@@ -22,7 +22,7 @@ var t = {
 			default: "radio-group-messages"
 		}
 	},
-	emits: ["update:modelValue"],
+	emits: ["input", "update:modelValue"],
 	data() {
 		return { internalValue: this.modelValue };
 	},
@@ -39,7 +39,7 @@ var t = {
 	},
 	methods: {
 		setGroupValue(e) {
-			this.$emit("update:modelValue", e);
+			this.$emit("input", e), this.$emit("update:modelValue", e);
 		},
 		getMessageKey(e, t) {
 			return `radio-group-message-${e}-${t}-${this.id}`;

package/dist/lib/radio-group/radio-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-group.js","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     */\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":";;AAOA,IAAK,IAAU;CACb,cAAc,EAAE,MAAM,GAAG;CACzB,MAAM;CAEN,SAAS;CAET,OAAO;EAIL,YAAY;GACV,MAAM,CAAC,QAAQ,OAAO;GACtB,SAAS;GACV;EAKD,aAAa;GACX,MAAM;GACN,SAAS;GACV;EAKD,mBAAmB;GACjB,MAAM;GACN,SAAS;GACV;EAKD,qBAAqB;GACnB,MAAM;GACN,SAAS;GACV;EACF;CAED,OAAO,CAOL,oBACD;CAED,OAAQ;AACN,SAAO,EACL,eAAe,KAAK,YACrB;;CAGH,OAAO;EACL,WAAY,GAAU;AACpB,QAAK,gBAAgB;;EAQvB,eAAe;GACb,WAAW;GACX,QAAS,GAAkB;AACzB,SAAK,WAAW,gBAAgB;;GAEnC;EACF;CAED,SAAS;EAKP,cAAe,GAAU;AACvB,QAAK,MAAM,qBAAqB,EAAS;;EAG3C,cAAe,GAAM,GAAO;AAC1B,UAAO,uBAAuB,EAAK,GAAG,EAAM,GAAG,KAAK;;EAEvD;CACF"}
+{"version":3,"file":"radio-group.js","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":";;AAOA,IAAK,IAAU;CACb,cAAc,EAAE,MAAM,GAAG;CACzB,MAAM;CAEN,SAAS;CAET,OAAO;EAKL,YAAY;GACV,MAAM,CAAC,QAAQ,OAAO;GACtB,SAAS;GACV;EAKD,aAAa;GACX,MAAM;GACN,SAAS;GACV;EAKD,mBAAmB;GACjB,MAAM;GACN,SAAS;GACV;EAKD,qBAAqB;GACnB,MAAM;GACN,SAAS;GACV;EACF;CAED,OAAO,CAOL,SAOA,oBACD;CAED,OAAQ;AACN,SAAO,EACL,eAAe,KAAK,YACrB;;CAGH,OAAO;EACL,WAAY,GAAU;AACpB,QAAK,gBAAgB;;EAQvB,eAAe;GACb,WAAW;GACX,QAAS,GAAkB;AACzB,SAAK,WAAW,gBAAgB;;GAEnC;EACF;CAED,SAAS;EAKP,cAAe,GAAU;AAEvB,GADA,KAAK,MAAM,SAAS,EAAS,EAC7B,KAAK,MAAM,qBAAqB,EAAS;;EAG3C,cAAe,GAAM,GAAO;AAC1B,UAAO,uBAAuB,EAAK,GAAG,EAAM,GAAG,KAAK;;EAEvD;CACF"}

package/dist/lib/resizable/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../resizable_utils-DabS08OL.cjs`),t=require(`../../resizable-DdPrpKvD.cjs`),n=require(`../../resizable_handle-g45rLu_2.cjs`),r=require(`./resizable-panel.cjs`);exports.DEFAULT_PANEL_SIZE=e.l,exports.DtResizable=t.t,exports.DtResizableHandle=n.t,exports.DtResizablePanel=r.default,exports.MIN_PANEL_SIZE_PX=e.u,exports.RESIZABLE_CONTEXT_KEY=e.d,exports.buildHandleId=e.f,exports.hasPercentageMinSize=e.t,exports.invalidateTokenCache=e.n,exports.isCSSValue=e.r,exports.isPercentageValue=e.i,exports.isValidSizing=e.a,exports.parseSizeToPixels=e.o,exports.pixelsToPercentage=e.s,exports.validateContainerSize=e.c;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../resizable_utils-DhuzXRdP.cjs`),t=require(`../../resizable-aOVGO_Os.cjs`),n=require(`../../resizable_handle-RIKS8frB.cjs`),r=require(`./resizable-panel.cjs`);exports.DEFAULT_PANEL_SIZE=e.l,exports.DtResizable=t.t,exports.DtResizableHandle=n.t,exports.DtResizablePanel=r.default,exports.MIN_PANEL_SIZE_PX=e.u,exports.RESIZABLE_CONTEXT_KEY=e.d,exports.buildHandleId=e.f,exports.hasPercentageMinSize=e.t,exports.invalidateTokenCache=e.n,exports.isCSSValue=e.r,exports.isPercentageValue=e.i,exports.isValidSizing=e.a,exports.parseSizeToPixels=e.o,exports.pixelsToPercentage=e.s,exports.validateContainerSize=e.c;

package/dist/lib/resizable/index.js

@@ -1,5 +1,5 @@
-import { a as e, c as t, d as n, f as r, i, l as a, n as o, o as s, r as c, s as l, t as u, u as d } from "../../resizable_utils-CQscchW4.js";
-import { t as f } from "../../resizable-CcxS3dH7.js";
-import { t as p } from "../../resizable_handle-vqI5i9u6.js";
+import { a as e, c as t, d as n, f as r, i, l as a, n as o, o as s, r as c, s as l, t as u, u as d } from "../../resizable_utils-BComtrMV.js";
+import { t as f } from "../../resizable-D4-peBOl.js";
+import { t as p } from "../../resizable_handle-BlKBiWnx.js";
 import m from "./resizable-panel.js";
 export { a as DEFAULT_PANEL_SIZE, f as DtResizable, p as DtResizableHandle, m as DtResizablePanel, d as MIN_PANEL_SIZE_PX, n as RESIZABLE_CONTEXT_KEY, r as buildHandleId, u as hasPercentageMinSize, o as invalidateTokenCache, c as isCSSValue, i as isPercentageValue, e as isValidSizing, s as parseSizeToPixels, l as pixelsToPercentage, t as validateContainerSize };

package/dist/lib/resizable/resizable-handle.cjs

@@ -1 +1 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require(`../../resizable_handle-g45rLu_2.cjs`);exports.default=e.t;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require(`../../resizable_handle-RIKS8frB.cjs`);exports.default=e.t;

package/dist/lib/resizable/resizable-handle.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../resizable_handle-vqI5i9u6.js";
+import { t as e } from "../../resizable_handle-BlKBiWnx.js";
 export { e as default };

package/dist/lib/resizable/resizable-panel.cjs

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../resizable_utils-DabS08OL.cjs`);let t=require(`vue`);var n=[`id`,`data-panel-id`],r={__name:`resizable_panel`,props:{id:{type:String,required:!0},initialSize:{type:String,default:void 0},userMinSize:{type:String,default:void 0},userMaxSize:{type:String,default:void 0},systemMinSize:{type:String,default:void 0},systemMaxSize:{type:String,default:void 0},collapseSize:{type:String,default:void 0},resizable:{type:Boolean,default:!0},collapsible:{type:Boolean,default:!1},collapsed:{type:Boolean,default:!1},class:{type:[String,Object,Array],default:``},contentClass:{type:[String,Object,Array],default:``}},setup(r){let i=r,a=[`initialSize`,`userMinSize`,`userMaxSize`,`systemMinSize`,`systemMaxSize`,`collapseSize`];(0,t.watch)(()=>a.map(e=>i[e]),t=>t.forEach((t,n)=>{t!==void 0&&!e.a(t)&&console.error(`[DtResizablePanel] Invalid ${a[n]}: "${t}".`)}),{immediate:!0});let o=(0,t.inject)(e.d,null),s=o?.layout??(0,t.computed)(()=>({panels:new Map,handles:[]})),c=o?.isResizing??(0,t.computed)(()=>!1),l=o?.offsetContentStyles??(0,t.computed)(()=>({})),u=o?.registerPanel??null,d=o?.unregisterPanel??null,f=(0,t.computed)(()=>({id:i.id,initialSize:i.initialSize,userMinSize:i.userMinSize,userMaxSize:i.userMaxSize,systemMinSize:i.systemMinSize,systemMaxSize:i.systemMaxSize,collapseSize:i.collapseSize,resizable:i.resizable??!0,collapsible:i.collapsible??!1,collapsed:i.collapsed??!1}));(0,t.onMounted)(()=>{u&&u(f.value)}),(0,t.onUnmounted)(()=>{d&&d(i.id)}),(0,t.watch)(f,()=>{u&&u(f.value)},{deep:!0});let p=o?.collapsePanel??null,m=o?.isInitializing??(0,t.computed)(()=>!1);(0,t.watch)(()=>i.collapsed,e=>{m.value||p&&e!==void 0&&p(i.id,e)},{immediate:!0});let h=o?.panelMap??(0,t.computed)(()=>new Map),g=(0,t.computed)(()=>h.value.get(i.id)),_=(0,t.computed)(()=>{let e=s.value.panels.get(i.id);return e?e.collapsed?{insetInlineStart:`${e.left}px`,inlineSize:`0px`,overflow:`hidden`,pointerEvents:`none`}:{insetInlineStart:`${e.left}px`,insetInlineEnd:`${e.right}px`}:{insetInlineStart:`0px`,inlineSize:`0px`,pointerEvents:`none`}});return(e,a)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{id:`dt-resizable-panel-${i.id}`,class:(0,t.normalizeClass)([`d-resizable-panel`,[i.class,{"d-resizable-panel--collapsed":g.value&&g.value.collapsed===!0,"d-resizable-panel--fixed":g.value&&g.value.resizable===!1}]]),style:(0,t.normalizeStyle)(_.value),"data-panel-id":i.id,"data-qa":`d-resizable-panel`},[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`d-resizable-panel__content`,r.contentClass]),style:(0,t.normalizeStyle)((0,t.unref)(l))},[(0,t.renderSlot)(e.$slots,`default`,{panel:g.value,isCollapsed:g.value?.collapsed,isResizing:(0,t.unref)(c)})],6)],14,n))}};exports.default=r;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}}),require(`../../chunk-Bmb41Sf3.cjs`);const e=require(`../../resizable_utils-DhuzXRdP.cjs`);let t=require(`vue`);var n=[`id`,`data-panel-id`],r={__name:`resizable_panel`,props:{id:{type:String,required:!0},initialSize:{type:String,default:void 0},userMinSize:{type:String,default:void 0},userMaxSize:{type:String,default:void 0},systemMinSize:{type:String,default:void 0},systemMaxSize:{type:String,default:void 0},collapseSize:{type:String,default:void 0},resizable:{type:Boolean,default:!0},collapsible:{type:Boolean,default:!1},collapsed:{type:Boolean,default:!1},class:{type:[String,Object,Array],default:``}},setup(r){let i=r,a=[`initialSize`,`userMinSize`,`userMaxSize`,`systemMinSize`,`systemMaxSize`,`collapseSize`];(0,t.watch)(()=>a.map(e=>i[e]),t=>t.forEach((t,n)=>{t!==void 0&&!e.a(t)&&console.error(`[DtResizablePanel] Invalid ${a[n]}: "${t}".`)}),{immediate:!0});let o=(0,t.inject)(e.d,null),s=o?.layout??(0,t.computed)(()=>({panels:new Map,handles:[]})),c=o?.isResizing??(0,t.computed)(()=>!1),l=o?.offsetContentStyles??(0,t.computed)(()=>({})),u=o?.registerPanel??null,d=o?.unregisterPanel??null,f=(0,t.computed)(()=>({id:i.id,initialSize:i.initialSize,userMinSize:i.userMinSize,userMaxSize:i.userMaxSize,systemMinSize:i.systemMinSize,systemMaxSize:i.systemMaxSize,collapseSize:i.collapseSize,resizable:i.resizable??!0,collapsible:i.collapsible??!1,collapsed:i.collapsed??!1}));(0,t.onMounted)(()=>{u&&u(f.value)}),(0,t.onUnmounted)(()=>{d&&d(i.id)}),(0,t.watch)(f,()=>{u&&u(f.value)},{deep:!0});let p=o?.collapsePanel??null,m=o?.isInitializing??(0,t.computed)(()=>!1);(0,t.watch)(()=>i.collapsed,e=>{m.value||p&&e!==void 0&&p(i.id,e)},{immediate:!0});let h=o?.panelMap??(0,t.computed)(()=>new Map),g=(0,t.computed)(()=>h.value.get(i.id)),_=(0,t.computed)(()=>{let e=s.value.panels.get(i.id);return e?e.collapsed?{insetInlineStart:`${e.left}px`,inlineSize:`0px`,overflow:`hidden`,pointerEvents:`none`}:{insetInlineStart:`${e.left}px`,insetInlineEnd:`${e.right}px`}:{insetInlineStart:`0px`,inlineSize:`0px`,pointerEvents:`none`}});return(e,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{id:`dt-resizable-panel-${i.id}`,class:(0,t.normalizeClass)([`d-resizable-panel`,[i.class,{"d-resizable-panel--collapsed":g.value&&g.value.collapsed===!0,"d-resizable-panel--fixed":g.value&&g.value.resizable===!1}]]),style:(0,t.normalizeStyle)(_.value),"data-panel-id":i.id,"data-qa":`d-resizable-panel`},[(0,t.createElementVNode)(`div`,{class:`d-resizable-panel__content`,style:(0,t.normalizeStyle)((0,t.unref)(l))},[(0,t.renderSlot)(e.$slots,`default`,{panel:g.value,isCollapsed:g.value?.collapsed,isResizing:(0,t.unref)(c)})],4)],14,n))}};exports.default=r;
 //# sourceMappingURL=resizable-panel.cjs.map

package/dist/lib/resizable/resizable-panel.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"resizable-panel.cjs","names":[],"sources":["../../../components/resizable/resizable_panel.vue"],"sourcesContent":["<template>\n  <div\n    :id=\"`dt-resizable-panel-${props.id}`\"\n    class=\"d-resizable-panel\"\n    :class=\"[\n      props.class,\n      {\n        'd-resizable-panel--collapsed': panel && panel.collapsed === true,\n        'd-resizable-panel--fixed': panel && panel.resizable === false,\n      },\n    ]\"\n    :style=\"panelStyles\"\n    :data-panel-id=\"props.id\"\n    data-qa=\"d-resizable-panel\"\n  >\n    <div\n      :class=\"['d-resizable-panel__content', contentClass]\"\n      :style=\"offsetContentStyles\"\n    >\n      <!-- @slot Panel content. Provides panel state and collapsed/resizing flags. -->\n      <slot\n        :panel=\"panel\"\n        :is-collapsed=\"panel?.collapsed\"\n        :is-resizing=\"isResizing\"\n      />\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { computed, inject, onMounted, onUnmounted, watch } from 'vue';\nimport { RESIZABLE_CONTEXT_KEY } from './resizable_constants';\nimport { isValidSizing } from './resizable_utils';\n\nconst props = defineProps({\n  /** Unique panel identifier. Must be unique within its DtResizable parent. */\n  id: { type: String, required: true },\n  /**\n   * Initial size as a Dialtone layout token (maps to `--dt-layout-*`, matching\n   * DtBox and the `d-w-*` / `d-h-*` utility classes) or a percentage with 'p'\n   * suffix (e.g. '25p' for 25% of the container).\n   * @values 1px, 2px, 8px, 25, 20px, 24px, 50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 10p, 20p, 25p, 30p, 33p, 40p, 50p, 60p, 66p, 70p, 75p, 80p, 90p, 95p, 100p\n   */\n  initialSize: { type: String, default: undefined },\n  /**\n   * Minimum size for user drag interactions (hard floor). Accepts a layout\n   * token or percentage; see `initialSize` for the value set.\n   * @values 0, 1px, 2px, 8px, 25, 20px, 24px, 50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 10p, 20p, 25p, 30p, 33p, 40p, 50p, 60p, 66p, 70p, 75p, 80p, 90p, 95p, 100p\n   */\n  userMinSize: { type: String, default: undefined },\n  /**\n   * Maximum size for user drag interactions (hard ceiling). Accepts a layout\n   * token or percentage; see `initialSize` for the value set.\n   * @values 1px, 2px, 8px, 25, 20px, 24px, 50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 10p, 20p, 25p, 30p, 33p, 40p, 50p, 60p, 66p, 70p, 75p, 80p, 90p, 95p, 100p\n   */\n  userMaxSize: { type: String, default: undefined },\n  /**\n   * Minimum size for system viewport scaling. Falls back to userMinSize.\n   * Accepts a layout token or percentage; see `initialSize` for the value set.\n   * @values 0, 1px, 2px, 8px, 25, 20px, 24px, 50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 10p, 20p, 25p, 30p, 33p, 40p, 50p, 60p, 66p, 70p, 75p, 80p, 90p, 95p, 100p\n   */\n  systemMinSize: { type: String, default: undefined },\n  /**\n   * Maximum size for system viewport scaling. Falls back to userMaxSize.\n   * Accepts a layout token or percentage; see `initialSize` for the value set.\n   * @values 1px, 2px, 8px, 25, 20px, 24px, 50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 10p, 20p, 25p, 30p, 33p, 40p, 50p, 60p, 66p, 70p, 75p, 80p, 90p, 95p, 100p\n   */\n  systemMaxSize: { type: String, default: undefined },\n  /**\n   * Container width threshold that triggers auto-collapse. Accepts a layout\n   * token or percentage; see `initialSize` for the value set.\n   * @values 1px, 2px, 8px, 25, 20px, 24px, 50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 10p, 20p, 25p, 30p, 33p, 40p, 50p, 60p, 66p, 70p, 75p, 80p, 90p, 95p, 100p\n   */\n  collapseSize: { type: String, default: undefined },\n  /** Whether this panel can be resized by dragging. */\n  resizable: { type: Boolean, default: true },\n  /** Whether this panel can be collapsed to zero width. */\n  collapsible: { type: Boolean, default: false },\n  /** Initial collapsed state. */\n  collapsed: { type: Boolean, default: false },\n  /** Additional CSS classes applied to the panel element. */\n  class: { type: [String, Object, Array], default: '' },\n  /** Additional CSS classes applied to the inner content wrapper element. */\n  contentClass: { type: [String, Object, Array], default: '' },\n});\n\nconst SIZE_PROPS = ['initialSize', 'userMinSize', 'userMaxSize', 'systemMinSize', 'systemMaxSize', 'collapseSize'];\nwatch(\n  () => SIZE_PROPS.map(n => props[n]),\n  vals => vals.forEach((v, i) => {\n    if (v !== undefined && !isValidSizing(v)) {\n      console.error(`[DtResizablePanel] Invalid ${SIZE_PROPS[i]}: \"${v}\".`);\n    }\n  }),\n  { immediate: true },\n);\n\nconst ctx = inject(RESIZABLE_CONTEXT_KEY, null);\nconst layoutRef = ctx?.layout ?? computed(() => ({ panels: new Map(), handles: [] }));\nconst isResizing = ctx?.isResizing ?? computed(() => false);\nconst offsetContentStyles = ctx?.offsetContentStyles ?? computed(() => ({}));\n\nconst registerPanel = ctx?.registerPanel ?? null;\nconst unregisterPanel = ctx?.unregisterPanel ?? null;\n\nconst panelConfig = computed(() => ({\n  id: props.id,\n  initialSize: props.initialSize,\n  userMinSize: props.userMinSize,\n  userMaxSize: props.userMaxSize,\n  systemMinSize: props.systemMinSize,\n  systemMaxSize: props.systemMaxSize,\n  collapseSize: props.collapseSize,\n  resizable: props.resizable ?? true,\n  collapsible: props.collapsible ?? false,\n  collapsed: props.collapsed ?? false,\n}));\n\nonMounted(() => {\n  if (registerPanel) {\n    registerPanel(panelConfig.value);\n  }\n});\n\nonUnmounted(() => {\n  if (unregisterPanel) {\n    unregisterPanel(props.id);\n  }\n});\n\n// Re-register on config change (watch each config field explicitly)\nwatch(panelConfig, () => {\n  if (registerPanel) registerPanel(panelConfig.value);\n}, { deep: true });\n\nconst collapsePanel = ctx?.collapsePanel ?? null;\nconst isInitializing = ctx?.isInitializing ?? computed(() => false);\n\nwatch(\n  () => props.collapsed,\n  newCollapsed => {\n    if (isInitializing.value) return;\n    if (collapsePanel && newCollapsed !== undefined) {\n      collapsePanel(props.id, newCollapsed);\n    }\n  },\n  { immediate: true },\n);\n\nconst panelMap = ctx?.panelMap ?? computed(() => new Map());\nconst panel = computed(() => panelMap.value.get(props.id));\n\nconst panelStyles = computed(() => {\n  const position = layoutRef.value.panels.get(props.id);\n\n  if (!position) {\n    return { insetInlineStart: '0px', inlineSize: '0px', pointerEvents: 'none' };\n  }\n\n  if (position.collapsed) {\n    return {\n      insetInlineStart: `${position.left}px`,\n      inlineSize: '0px',\n      overflow: 'hidden',\n      pointerEvents: 'none',\n    };\n  }\n\n  return {\n    insetInlineStart: `${position.left}px`,\n    insetInlineEnd: `${position.right}px`,\n  };\n});\n</script>\n"],"mappings":"iwBAkCA,IAAM,EAAQ,EAoDR,EAAa,CAAC,cAAe,cAAe,cAAe,gBAAiB,gBAAiB,eAAe,EAClH,EAAA,EAAA,WACQ,EAAW,IAAI,GAAK,EAAM,GAAG,CACnC,GAAQ,EAAK,SAAS,EAAG,IAAM,CACzB,IAAM,IAAA,IAAa,CAAC,EAAA,EAAc,EAAE,EACtC,QAAQ,MAAM,8BAA8B,EAAW,GAAG,KAAK,EAAE,IAAI,EAEvE,CACF,CAAE,UAAW,GAAM,CACpB,CAED,IAAM,GAAA,EAAA,EAAA,QAAa,EAAA,EAAuB,KAAK,CACzC,EAAY,GAAK,SAAA,EAAA,EAAA,eAA0B,CAAE,OAAQ,IAAI,IAAO,QAAS,EAAE,CAAE,EAAE,CAC/E,EAAa,GAAK,aAAA,EAAA,EAAA,cAA6B,GAAM,CACrD,EAAsB,GAAK,sBAAA,EAAA,EAAA,eAAuC,EAAE,EAAE,CAEtE,EAAgB,GAAK,eAAiB,KACtC,EAAkB,GAAK,iBAAmB,KAE1C,GAAA,EAAA,EAAA,eAA8B,CAClC,GAAI,EAAM,GACV,YAAa,EAAM,YACnB,YAAa,EAAM,YACnB,YAAa,EAAM,YACnB,cAAe,EAAM,cACrB,cAAe,EAAM,cACrB,aAAc,EAAM,aACpB,UAAW,EAAM,WAAa,GAC9B,YAAa,EAAM,aAAe,GAClC,UAAW,EAAM,WAAa,GAC/B,EAAE,EAEH,EAAA,EAAA,eAAgB,CACV,GACF,EAAc,EAAY,MAAM,EAElC,EAEF,EAAA,EAAA,iBAAkB,CACZ,GACF,EAAgB,EAAM,GAAG,EAE3B,EAGF,EAAA,EAAA,OAAM,MAAmB,CACnB,GAAe,EAAc,EAAY,MAAM,EAClD,CAAE,KAAM,GAAM,CAAC,CAElB,IAAM,EAAgB,GAAK,eAAiB,KACtC,EAAiB,GAAK,iBAAA,EAAA,EAAA,cAAiC,GAAM,EAEnE,EAAA,EAAA,WACQ,EAAM,UACZ,GAAgB,CACV,EAAe,OACf,GAAiB,IAAiB,IAAA,IACpC,EAAc,EAAM,GAAI,EAAa,EAGzC,CAAE,UAAW,GAAM,CACpB,CAED,IAAM,EAAW,GAAK,WAAA,EAAA,EAAA,cAA2B,IAAI,IAAM,CACrD,GAAA,EAAA,EAAA,cAAuB,EAAS,MAAM,IAAI,EAAM,GAAG,CAAC,CAEpD,GAAA,EAAA,EAAA,cAA6B,CACjC,IAAM,EAAW,EAAU,MAAM,OAAO,IAAI,EAAM,GAAG,CAerD,OAbK,EAID,EAAS,UACJ,CACL,iBAAkB,GAAG,EAAS,KAAK,IACnC,WAAY,MACZ,SAAU,SACV,cAAe,OAChB,CAGI,CACL,iBAAkB,GAAG,EAAS,KAAK,IACnC,eAAgB,GAAG,EAAS,MAAM,IACnC,CAfQ,CAAE,iBAAkB,MAAO,WAAY,MAAO,cAAe,OAAQ,EAgB9E,0DAlJM,MAAA,CAxBH,GAAE,sBAAwB,EAAM,KACjC,OAAA,EAAA,EAAA,gBAAK,CAAC,oBAAmB,CACT,EAAM,MAAA,gCAAuD,EAAA,OAAS,EAAA,MAAM,YAAS,8BAA+C,EAAA,OAAS,EAAA,MAAM,YAAS,OAO3K,OAAA,EAAA,EAAA,gBAAO,EAAA,MAAW,CAClB,gBAAe,EAAM,GACtB,UAAQ,+CAYF,MAAA,CATH,OAAA,EAAA,EAAA,gBAAK,CAAA,6BAAiC,EAAA,aAAY,CAAA,CAClD,OAAA,EAAA,EAAA,iBAAA,EAAA,EAAA,OAAO,EAAmB,CAAA,oBAOzB,EAAA,OAAA,UAAA,CAHC,MAAO,EAAA,MACP,YAAc,EAAA,OAAO,UACrB,YAAA,EAAA,EAAA,OAAa,EAAU"}
+{"version":3,"file":"resizable-panel.cjs","names":[],"sources":["../../../components/resizable/resizable_panel.vue"],"sourcesContent":["<template>\n  <div\n    :id=\"`dt-resizable-panel-${props.id}`\"\n    class=\"d-resizable-panel\"\n    :class=\"[\n      props.class,\n      {\n        'd-resizable-panel--collapsed': panel && panel.collapsed === true,\n        'd-resizable-panel--fixed': panel && panel.resizable === false,\n      },\n    ]\"\n    :style=\"panelStyles\"\n    :data-panel-id=\"props.id\"\n    data-qa=\"d-resizable-panel\"\n  >\n    <div\n      class=\"d-resizable-panel__content\"\n      :style=\"offsetContentStyles\"\n    >\n      <!-- @slot Panel content. Provides panel state and collapsed/resizing flags. -->\n      <slot\n        :panel=\"panel\"\n        :is-collapsed=\"panel?.collapsed\"\n        :is-resizing=\"isResizing\"\n      />\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { computed, inject, onMounted, onUnmounted, watch } from 'vue';\nimport { RESIZABLE_CONTEXT_KEY } from './resizable_constants';\nimport { isValidSizing } from './resizable_utils';\n\nconst props = defineProps({\n  /** Unique panel identifier. Must be unique within its DtResizable parent. */\n  id: { type: String, required: true },\n  /** Initial size as a percentage token (e.g., '25p' for 25%) or Dialtone size token. */\n  initialSize: { type: String, default: undefined },\n  /** Minimum size for user drag interactions (hard floor). */\n  userMinSize: { type: String, default: undefined },\n  /** Maximum size for user drag interactions (hard ceiling). */\n  userMaxSize: { type: String, default: undefined },\n  /** Minimum size for system viewport scaling. Falls back to userMinSize. */\n  systemMinSize: { type: String, default: undefined },\n  /** Maximum size for system viewport scaling. Falls back to userMaxSize. */\n  systemMaxSize: { type: String, default: undefined },\n  /** Container width threshold that triggers auto-collapse. */\n  collapseSize: { type: String, default: undefined },\n  /** Whether this panel can be resized by dragging. */\n  resizable: { type: Boolean, default: true },\n  /** Whether this panel can be collapsed to zero width. */\n  collapsible: { type: Boolean, default: false },\n  /** Initial collapsed state. */\n  collapsed: { type: Boolean, default: false },\n  /** Additional CSS classes applied to the panel element. */\n  class: { type: [String, Object, Array], default: '' },\n});\n\nconst SIZE_PROPS = ['initialSize', 'userMinSize', 'userMaxSize', 'systemMinSize', 'systemMaxSize', 'collapseSize'];\nwatch(\n  () => SIZE_PROPS.map(n => props[n]),\n  vals => vals.forEach((v, i) => {\n    if (v !== undefined && !isValidSizing(v)) {\n      console.error(`[DtResizablePanel] Invalid ${SIZE_PROPS[i]}: \"${v}\".`);\n    }\n  }),\n  { immediate: true },\n);\n\nconst ctx = inject(RESIZABLE_CONTEXT_KEY, null);\nconst layoutRef = ctx?.layout ?? computed(() => ({ panels: new Map(), handles: [] }));\nconst isResizing = ctx?.isResizing ?? computed(() => false);\nconst offsetContentStyles = ctx?.offsetContentStyles ?? computed(() => ({}));\n\nconst registerPanel = ctx?.registerPanel ?? null;\nconst unregisterPanel = ctx?.unregisterPanel ?? null;\n\nconst panelConfig = computed(() => ({\n  id: props.id,\n  initialSize: props.initialSize,\n  userMinSize: props.userMinSize,\n  userMaxSize: props.userMaxSize,\n  systemMinSize: props.systemMinSize,\n  systemMaxSize: props.systemMaxSize,\n  collapseSize: props.collapseSize,\n  resizable: props.resizable ?? true,\n  collapsible: props.collapsible ?? false,\n  collapsed: props.collapsed ?? false,\n}));\n\nonMounted(() => {\n  if (registerPanel) {\n    registerPanel(panelConfig.value);\n  }\n});\n\nonUnmounted(() => {\n  if (unregisterPanel) {\n    unregisterPanel(props.id);\n  }\n});\n\n// Re-register on config change (watch each config field explicitly)\nwatch(panelConfig, () => {\n  if (registerPanel) registerPanel(panelConfig.value);\n}, { deep: true });\n\nconst collapsePanel = ctx?.collapsePanel ?? null;\nconst isInitializing = ctx?.isInitializing ?? computed(() => false);\n\nwatch(\n  () => props.collapsed,\n  newCollapsed => {\n    if (isInitializing.value) return;\n    if (collapsePanel && newCollapsed !== undefined) {\n      collapsePanel(props.id, newCollapsed);\n    }\n  },\n  { immediate: true },\n);\n\nconst panelMap = ctx?.panelMap ?? computed(() => new Map());\nconst panel = computed(() => panelMap.value.get(props.id));\n\nconst panelStyles = computed(() => {\n  const position = layoutRef.value.panels.get(props.id);\n\n  if (!position) {\n    return { insetInlineStart: '0px', inlineSize: '0px', pointerEvents: 'none' };\n  }\n\n  if (position.collapsed) {\n    return {\n      insetInlineStart: `${position.left}px`,\n      inlineSize: '0px',\n      overflow: 'hidden',\n      pointerEvents: 'none',\n    };\n  }\n\n  return {\n    insetInlineStart: `${position.left}px`,\n    insetInlineEnd: `${position.right}px`,\n  };\n});\n</script>\n"],"mappings":"4sBAkCA,IAAM,EAAQ,EAyBR,EAAa,CAAC,cAAe,cAAe,cAAe,gBAAiB,gBAAiB,eAAe,EAClH,EAAA,EAAA,WACQ,EAAW,IAAI,GAAK,EAAM,GAAG,CACnC,GAAQ,EAAK,SAAS,EAAG,IAAM,CACzB,IAAM,IAAA,IAAa,CAAC,EAAA,EAAc,EAAE,EACtC,QAAQ,MAAM,8BAA8B,EAAW,GAAG,KAAK,EAAE,IAAI,EAEvE,CACF,CAAE,UAAW,GAAM,CACpB,CAED,IAAM,GAAA,EAAA,EAAA,QAAa,EAAA,EAAuB,KAAK,CACzC,EAAY,GAAK,SAAA,EAAA,EAAA,eAA0B,CAAE,OAAQ,IAAI,IAAO,QAAS,EAAE,CAAE,EAAE,CAC/E,EAAa,GAAK,aAAA,EAAA,EAAA,cAA6B,GAAM,CACrD,EAAsB,GAAK,sBAAA,EAAA,EAAA,eAAuC,EAAE,EAAE,CAEtE,EAAgB,GAAK,eAAiB,KACtC,EAAkB,GAAK,iBAAmB,KAE1C,GAAA,EAAA,EAAA,eAA8B,CAClC,GAAI,EAAM,GACV,YAAa,EAAM,YACnB,YAAa,EAAM,YACnB,YAAa,EAAM,YACnB,cAAe,EAAM,cACrB,cAAe,EAAM,cACrB,aAAc,EAAM,aACpB,UAAW,EAAM,WAAa,GAC9B,YAAa,EAAM,aAAe,GAClC,UAAW,EAAM,WAAa,GAC/B,EAAE,EAEH,EAAA,EAAA,eAAgB,CACV,GACF,EAAc,EAAY,MAAM,EAElC,EAEF,EAAA,EAAA,iBAAkB,CACZ,GACF,EAAgB,EAAM,GAAG,EAE3B,EAGF,EAAA,EAAA,OAAM,MAAmB,CACnB,GAAe,EAAc,EAAY,MAAM,EAClD,CAAE,KAAM,GAAM,CAAC,CAElB,IAAM,EAAgB,GAAK,eAAiB,KACtC,EAAiB,GAAK,iBAAA,EAAA,EAAA,cAAiC,GAAM,EAEnE,EAAA,EAAA,WACQ,EAAM,UACZ,GAAgB,CACV,EAAe,OACf,GAAiB,IAAiB,IAAA,IACpC,EAAc,EAAM,GAAI,EAAa,EAGzC,CAAE,UAAW,GAAM,CACpB,CAED,IAAM,EAAW,GAAK,WAAA,EAAA,EAAA,cAA2B,IAAI,IAAM,CACrD,GAAA,EAAA,EAAA,cAAuB,EAAS,MAAM,IAAI,EAAM,GAAG,CAAC,CAEpD,GAAA,EAAA,EAAA,cAA6B,CACjC,IAAM,EAAW,EAAU,MAAM,OAAO,IAAI,EAAM,GAAG,CAerD,OAbK,EAID,EAAS,UACJ,CACL,iBAAkB,GAAG,EAAS,KAAK,IACnC,WAAY,MACZ,SAAU,SACV,cAAe,OAChB,CAGI,CACL,iBAAkB,GAAG,EAAS,KAAK,IACnC,eAAgB,GAAG,EAAS,MAAM,IACnC,CAfQ,CAAE,iBAAkB,MAAO,WAAY,MAAO,cAAe,OAAQ,EAgB9E,0DAvHM,MAAA,CAxBH,GAAE,sBAAwB,EAAM,KACjC,OAAA,EAAA,EAAA,gBAAK,CAAC,oBAAmB,CACT,EAAM,MAAA,gCAAuD,EAAA,OAAS,EAAA,MAAM,YAAS,8BAA+C,EAAA,OAAS,EAAA,MAAM,YAAS,OAO3K,OAAA,EAAA,EAAA,gBAAO,EAAA,MAAW,CAClB,gBAAe,EAAM,GACtB,UAAQ,+CAYF,MAAA,CATJ,MAAM,6BACL,OAAA,EAAA,EAAA,iBAAA,EAAA,EAAA,OAAO,EAAmB,CAAA,oBAOzB,EAAA,OAAA,UAAA,CAHC,MAAO,EAAA,MACP,YAAc,EAAA,OAAO,UACrB,YAAA,EAAA,EAAA,OAAa,EAAU"}

package/dist/lib/resizable/resizable-panel.js

@@ -1,4 +1,4 @@
-import { a as e, d as t } from "../../resizable_utils-CQscchW4.js";
+import { a as e, d as t } from "../../resizable_utils-BComtrMV.js";
 import { computed as n, createElementBlock as r, createElementVNode as i, inject as a, normalizeClass as o, normalizeStyle as s, onMounted as c, onUnmounted as l, openBlock as u, renderSlot as d, unref as f, watch as p } from "vue";
 //#region components/resizable/resizable_panel.vue
 var m = ["id", "data-panel-id"], h = {
@@ -51,14 +51,6 @@ var m = ["id", "data-panel-id"], h = {
 				Array
 			],
 			default: ""
-		},
-		contentClass: {
-			type: [
-				String,
-				Object,
-				Array
-			],
-			default: ""
 		}
 	},
 	setup(h) {
@@ -125,13 +117,13 @@ var m = ["id", "data-panel-id"], h = {
 			"data-panel-id": g.id,
 			"data-qa": "d-resizable-panel"
 		}, [i("div", {
-			class: o(["d-resizable-panel__content", h.contentClass]),
+			class: "d-resizable-panel__content",
 			style: s(f(x))
 		}, [d(e.$slots, "default", {
 			panel: O.value,
 			isCollapsed: O.value?.collapsed,
 			isResizing: f(b)
-		})], 6)], 14, m));
+		})], 4)], 14, m));
 	}
 };
 //#endregion

package/dist/lib/resizable/resizable-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"resizable-panel.js","names":[],"sources":["../../../components/resizable/resizable_panel.vue"],"sourcesContent":["<template>\n  <div\n    :id=\"`dt-resizable-panel-${props.id}`\"\n    class=\"d-resizable-panel\"\n    :class=\"[\n      props.class,\n      {\n        'd-resizable-panel--collapsed': panel && panel.collapsed === true,\n        'd-resizable-panel--fixed': panel && panel.resizable === false,\n      },\n    ]\"\n    :style=\"panelStyles\"\n    :data-panel-id=\"props.id\"\n    data-qa=\"d-resizable-panel\"\n  >\n    <div\n      :class=\"['d-resizable-panel__content', contentClass]\"\n      :style=\"offsetContentStyles\"\n    >\n      <!-- @slot Panel content. Provides panel state and collapsed/resizing flags. -->\n      <slot\n        :panel=\"panel\"\n        :is-collapsed=\"panel?.collapsed\"\n        :is-resizing=\"isResizing\"\n      />\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { computed, inject, onMounted, onUnmounted, watch } from 'vue';\nimport { RESIZABLE_CONTEXT_KEY } from './resizable_constants';\nimport { isValidSizing } from './resizable_utils';\n\nconst props = defineProps({\n  /** Unique panel identifier. Must be unique within its DtResizable parent. */\n  id: { type: String, required: true },\n  /**\n   * Initial size as a Dialtone layout token (maps to `--dt-layout-*`, matching\n   * DtBox and the `d-w-*` / `d-h-*` utility classes) or a percentage with 'p'\n   * suffix (e.g. '25p' for 25% of the container).\n   * @values 1px, 2px, 8px, 25, 20px, 24px, 50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 10p, 20p, 25p, 30p, 33p, 40p, 50p, 60p, 66p, 70p, 75p, 80p, 90p, 95p, 100p\n   */\n  initialSize: { type: String, default: undefined },\n  /**\n   * Minimum size for user drag interactions (hard floor). Accepts a layout\n   * token or percentage; see `initialSize` for the value set.\n   * @values 0, 1px, 2px, 8px, 25, 20px, 24px, 50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 10p, 20p, 25p, 30p, 33p, 40p, 50p, 60p, 66p, 70p, 75p, 80p, 90p, 95p, 100p\n   */\n  userMinSize: { type: String, default: undefined },\n  /**\n   * Maximum size for user drag interactions (hard ceiling). Accepts a layout\n   * token or percentage; see `initialSize` for the value set.\n   * @values 1px, 2px, 8px, 25, 20px, 24px, 50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 10p, 20p, 25p, 30p, 33p, 40p, 50p, 60p, 66p, 70p, 75p, 80p, 90p, 95p, 100p\n   */\n  userMaxSize: { type: String, default: undefined },\n  /**\n   * Minimum size for system viewport scaling. Falls back to userMinSize.\n   * Accepts a layout token or percentage; see `initialSize` for the value set.\n   * @values 0, 1px, 2px, 8px, 25, 20px, 24px, 50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 10p, 20p, 25p, 30p, 33p, 40p, 50p, 60p, 66p, 70p, 75p, 80p, 90p, 95p, 100p\n   */\n  systemMinSize: { type: String, default: undefined },\n  /**\n   * Maximum size for system viewport scaling. Falls back to userMaxSize.\n   * Accepts a layout token or percentage; see `initialSize` for the value set.\n   * @values 1px, 2px, 8px, 25, 20px, 24px, 50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 10p, 20p, 25p, 30p, 33p, 40p, 50p, 60p, 66p, 70p, 75p, 80p, 90p, 95p, 100p\n   */\n  systemMaxSize: { type: String, default: undefined },\n  /**\n   * Container width threshold that triggers auto-collapse. Accepts a layout\n   * token or percentage; see `initialSize` for the value set.\n   * @values 1px, 2px, 8px, 25, 20px, 24px, 50, 75, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1100, 1200, 1300, 1400, 1500, 1600, 10p, 20p, 25p, 30p, 33p, 40p, 50p, 60p, 66p, 70p, 75p, 80p, 90p, 95p, 100p\n   */\n  collapseSize: { type: String, default: undefined },\n  /** Whether this panel can be resized by dragging. */\n  resizable: { type: Boolean, default: true },\n  /** Whether this panel can be collapsed to zero width. */\n  collapsible: { type: Boolean, default: false },\n  /** Initial collapsed state. */\n  collapsed: { type: Boolean, default: false },\n  /** Additional CSS classes applied to the panel element. */\n  class: { type: [String, Object, Array], default: '' },\n  /** Additional CSS classes applied to the inner content wrapper element. */\n  contentClass: { type: [String, Object, Array], default: '' },\n});\n\nconst SIZE_PROPS = ['initialSize', 'userMinSize', 'userMaxSize', 'systemMinSize', 'systemMaxSize', 'collapseSize'];\nwatch(\n  () => SIZE_PROPS.map(n => props[n]),\n  vals => vals.forEach((v, i) => {\n    if (v !== undefined && !isValidSizing(v)) {\n      console.error(`[DtResizablePanel] Invalid ${SIZE_PROPS[i]}: \"${v}\".`);\n    }\n  }),\n  { immediate: true },\n);\n\nconst ctx = inject(RESIZABLE_CONTEXT_KEY, null);\nconst layoutRef = ctx?.layout ?? computed(() => ({ panels: new Map(), handles: [] }));\nconst isResizing = ctx?.isResizing ?? computed(() => false);\nconst offsetContentStyles = ctx?.offsetContentStyles ?? computed(() => ({}));\n\nconst registerPanel = ctx?.registerPanel ?? null;\nconst unregisterPanel = ctx?.unregisterPanel ?? null;\n\nconst panelConfig = computed(() => ({\n  id: props.id,\n  initialSize: props.initialSize,\n  userMinSize: props.userMinSize,\n  userMaxSize: props.userMaxSize,\n  systemMinSize: props.systemMinSize,\n  systemMaxSize: props.systemMaxSize,\n  collapseSize: props.collapseSize,\n  resizable: props.resizable ?? true,\n  collapsible: props.collapsible ?? false,\n  collapsed: props.collapsed ?? false,\n}));\n\nonMounted(() => {\n  if (registerPanel) {\n    registerPanel(panelConfig.value);\n  }\n});\n\nonUnmounted(() => {\n  if (unregisterPanel) {\n    unregisterPanel(props.id);\n  }\n});\n\n// Re-register on config change (watch each config field explicitly)\nwatch(panelConfig, () => {\n  if (registerPanel) registerPanel(panelConfig.value);\n}, { deep: true });\n\nconst collapsePanel = ctx?.collapsePanel ?? null;\nconst isInitializing = ctx?.isInitializing ?? computed(() => false);\n\nwatch(\n  () => props.collapsed,\n  newCollapsed => {\n    if (isInitializing.value) return;\n    if (collapsePanel && newCollapsed !== undefined) {\n      collapsePanel(props.id, newCollapsed);\n    }\n  },\n  { immediate: true },\n);\n\nconst panelMap = ctx?.panelMap ?? computed(() => new Map());\nconst panel = computed(() => panelMap.value.get(props.id));\n\nconst panelStyles = computed(() => {\n  const position = layoutRef.value.panels.get(props.id);\n\n  if (!position) {\n    return { insetInlineStart: '0px', inlineSize: '0px', pointerEvents: 'none' };\n  }\n\n  if (position.collapsed) {\n    return {\n      insetInlineStart: `${position.left}px`,\n      inlineSize: '0px',\n      overflow: 'hidden',\n      pointerEvents: 'none',\n    };\n  }\n\n  return {\n    insetInlineStart: `${position.left}px`,\n    insetInlineEnd: `${position.right}px`,\n  };\n});\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkCA,IAAM,IAAQ,GAoDR,IAAa;GAAC;GAAe;GAAe;GAAe;GAAiB;GAAiB;GAAe;AAClH,UACQ,EAAW,KAAI,MAAK,EAAM,GAAG,GACnC,MAAQ,EAAK,SAAS,GAAG,MAAM;AAC7B,GAAI,MAAM,KAAA,KAAa,CAAC,EAAc,EAAE,IACtC,QAAQ,MAAM,8BAA8B,EAAW,GAAG,KAAK,EAAE,IAAI;IAEvE,EACF,EAAE,WAAW,IAAM,CACpB;EAED,IAAM,IAAM,EAAO,GAAuB,KAAK,EACzC,IAAY,GAAK,UAAU,SAAgB;GAAE,wBAAQ,IAAI,KAAK;GAAE,SAAS,EAAE;GAAE,EAAE,EAC/E,IAAa,GAAK,cAAc,QAAe,GAAM,EACrD,IAAsB,GAAK,uBAAuB,SAAgB,EAAE,EAAE,EAEtE,IAAgB,GAAK,iBAAiB,MACtC,IAAkB,GAAK,mBAAmB,MAE1C,IAAc,SAAgB;GAClC,IAAI,EAAM;GACV,aAAa,EAAM;GACnB,aAAa,EAAM;GACnB,aAAa,EAAM;GACnB,eAAe,EAAM;GACrB,eAAe,EAAM;GACrB,cAAc,EAAM;GACpB,WAAW,EAAM,aAAa;GAC9B,aAAa,EAAM,eAAe;GAClC,WAAW,EAAM,aAAa;GAC/B,EAAE;AAeH,EAbA,QAAgB;AACd,GAAI,KACF,EAAc,EAAY,MAAM;IAElC,EAEF,QAAkB;AAChB,GAAI,KACF,EAAgB,EAAM,GAAG;IAE3B,EAGF,EAAM,SAAmB;AACvB,GAAI,KAAe,EAAc,EAAY,MAAM;KAClD,EAAE,MAAM,IAAM,CAAC;EAElB,IAAM,IAAgB,GAAK,iBAAiB,MACtC,IAAiB,GAAK,kBAAkB,QAAe,GAAM;AAEnE,UACQ,EAAM,YACZ,MAAgB;AACV,KAAe,SACf,KAAiB,MAAiB,KAAA,KACpC,EAAc,EAAM,IAAI,EAAa;KAGzC,EAAE,WAAW,IAAM,CACpB;EAED,IAAM,IAAW,GAAK,YAAY,wBAAe,IAAI,KAAK,CAAC,EACrD,IAAQ,QAAe,EAAS,MAAM,IAAI,EAAM,GAAG,CAAC,EAEpD,IAAc,QAAe;GACjC,IAAM,IAAW,EAAU,MAAM,OAAO,IAAI,EAAM,GAAG;AAerD,UAbK,IAID,EAAS,YACJ;IACL,kBAAkB,GAAG,EAAS,KAAK;IACnC,YAAY;IACZ,UAAU;IACV,eAAe;IAChB,GAGI;IACL,kBAAkB,GAAG,EAAS,KAAK;IACnC,gBAAgB,GAAG,EAAS,MAAM;IACnC,GAfQ;IAAE,kBAAkB;IAAO,YAAY;IAAO,eAAe;IAAQ;IAgB9E;yBA3KA,EAyBM,OAAA;GAxBH,IAAE,sBAAwB,EAAM;GACjC,OAAK,EAAA,CAAC,qBAAmB,CACT,EAAM,OAAA;oCAAuD,EAAA,SAAS,EAAA,MAAM,cAAS;gCAA+C,EAAA,SAAS,EAAA,MAAM,cAAS;;GAO3K,OAAK,EAAE,EAAA,MAAW;GAClB,iBAAe,EAAM;GACtB,WAAQ;MAER,EAUM,OAAA;GATH,OAAK,EAAA,CAAA,8BAAiC,EAAA,aAAY,CAAA;GAClD,OAAK,EAAE,EAAA,EAAmB,CAAA;MAG3B,EAIE,EAAA,QAAA,WAAA;GAHC,OAAO,EAAA;GACP,aAAc,EAAA,OAAO;GACrB,YAAa,EAAA,EAAU"}
+{"version":3,"file":"resizable-panel.js","names":[],"sources":["../../../components/resizable/resizable_panel.vue"],"sourcesContent":["<template>\n  <div\n    :id=\"`dt-resizable-panel-${props.id}`\"\n    class=\"d-resizable-panel\"\n    :class=\"[\n      props.class,\n      {\n        'd-resizable-panel--collapsed': panel && panel.collapsed === true,\n        'd-resizable-panel--fixed': panel && panel.resizable === false,\n      },\n    ]\"\n    :style=\"panelStyles\"\n    :data-panel-id=\"props.id\"\n    data-qa=\"d-resizable-panel\"\n  >\n    <div\n      class=\"d-resizable-panel__content\"\n      :style=\"offsetContentStyles\"\n    >\n      <!-- @slot Panel content. Provides panel state and collapsed/resizing flags. -->\n      <slot\n        :panel=\"panel\"\n        :is-collapsed=\"panel?.collapsed\"\n        :is-resizing=\"isResizing\"\n      />\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { computed, inject, onMounted, onUnmounted, watch } from 'vue';\nimport { RESIZABLE_CONTEXT_KEY } from './resizable_constants';\nimport { isValidSizing } from './resizable_utils';\n\nconst props = defineProps({\n  /** Unique panel identifier. Must be unique within its DtResizable parent. */\n  id: { type: String, required: true },\n  /** Initial size as a percentage token (e.g., '25p' for 25%) or Dialtone size token. */\n  initialSize: { type: String, default: undefined },\n  /** Minimum size for user drag interactions (hard floor). */\n  userMinSize: { type: String, default: undefined },\n  /** Maximum size for user drag interactions (hard ceiling). */\n  userMaxSize: { type: String, default: undefined },\n  /** Minimum size for system viewport scaling. Falls back to userMinSize. */\n  systemMinSize: { type: String, default: undefined },\n  /** Maximum size for system viewport scaling. Falls back to userMaxSize. */\n  systemMaxSize: { type: String, default: undefined },\n  /** Container width threshold that triggers auto-collapse. */\n  collapseSize: { type: String, default: undefined },\n  /** Whether this panel can be resized by dragging. */\n  resizable: { type: Boolean, default: true },\n  /** Whether this panel can be collapsed to zero width. */\n  collapsible: { type: Boolean, default: false },\n  /** Initial collapsed state. */\n  collapsed: { type: Boolean, default: false },\n  /** Additional CSS classes applied to the panel element. */\n  class: { type: [String, Object, Array], default: '' },\n});\n\nconst SIZE_PROPS = ['initialSize', 'userMinSize', 'userMaxSize', 'systemMinSize', 'systemMaxSize', 'collapseSize'];\nwatch(\n  () => SIZE_PROPS.map(n => props[n]),\n  vals => vals.forEach((v, i) => {\n    if (v !== undefined && !isValidSizing(v)) {\n      console.error(`[DtResizablePanel] Invalid ${SIZE_PROPS[i]}: \"${v}\".`);\n    }\n  }),\n  { immediate: true },\n);\n\nconst ctx = inject(RESIZABLE_CONTEXT_KEY, null);\nconst layoutRef = ctx?.layout ?? computed(() => ({ panels: new Map(), handles: [] }));\nconst isResizing = ctx?.isResizing ?? computed(() => false);\nconst offsetContentStyles = ctx?.offsetContentStyles ?? computed(() => ({}));\n\nconst registerPanel = ctx?.registerPanel ?? null;\nconst unregisterPanel = ctx?.unregisterPanel ?? null;\n\nconst panelConfig = computed(() => ({\n  id: props.id,\n  initialSize: props.initialSize,\n  userMinSize: props.userMinSize,\n  userMaxSize: props.userMaxSize,\n  systemMinSize: props.systemMinSize,\n  systemMaxSize: props.systemMaxSize,\n  collapseSize: props.collapseSize,\n  resizable: props.resizable ?? true,\n  collapsible: props.collapsible ?? false,\n  collapsed: props.collapsed ?? false,\n}));\n\nonMounted(() => {\n  if (registerPanel) {\n    registerPanel(panelConfig.value);\n  }\n});\n\nonUnmounted(() => {\n  if (unregisterPanel) {\n    unregisterPanel(props.id);\n  }\n});\n\n// Re-register on config change (watch each config field explicitly)\nwatch(panelConfig, () => {\n  if (registerPanel) registerPanel(panelConfig.value);\n}, { deep: true });\n\nconst collapsePanel = ctx?.collapsePanel ?? null;\nconst isInitializing = ctx?.isInitializing ?? computed(() => false);\n\nwatch(\n  () => props.collapsed,\n  newCollapsed => {\n    if (isInitializing.value) return;\n    if (collapsePanel && newCollapsed !== undefined) {\n      collapsePanel(props.id, newCollapsed);\n    }\n  },\n  { immediate: true },\n);\n\nconst panelMap = ctx?.panelMap ?? computed(() => new Map());\nconst panel = computed(() => panelMap.value.get(props.id));\n\nconst panelStyles = computed(() => {\n  const position = layoutRef.value.panels.get(props.id);\n\n  if (!position) {\n    return { insetInlineStart: '0px', inlineSize: '0px', pointerEvents: 'none' };\n  }\n\n  if (position.collapsed) {\n    return {\n      insetInlineStart: `${position.left}px`,\n      inlineSize: '0px',\n      overflow: 'hidden',\n      pointerEvents: 'none',\n    };\n  }\n\n  return {\n    insetInlineStart: `${position.left}px`,\n    insetInlineEnd: `${position.right}px`,\n  };\n});\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkCA,IAAM,IAAQ,GAyBR,IAAa;GAAC;GAAe;GAAe;GAAe;GAAiB;GAAiB;GAAe;AAClH,UACQ,EAAW,KAAI,MAAK,EAAM,GAAG,GACnC,MAAQ,EAAK,SAAS,GAAG,MAAM;AAC7B,GAAI,MAAM,KAAA,KAAa,CAAC,EAAc,EAAE,IACtC,QAAQ,MAAM,8BAA8B,EAAW,GAAG,KAAK,EAAE,IAAI;IAEvE,EACF,EAAE,WAAW,IAAM,CACpB;EAED,IAAM,IAAM,EAAO,GAAuB,KAAK,EACzC,IAAY,GAAK,UAAU,SAAgB;GAAE,wBAAQ,IAAI,KAAK;GAAE,SAAS,EAAE;GAAE,EAAE,EAC/E,IAAa,GAAK,cAAc,QAAe,GAAM,EACrD,IAAsB,GAAK,uBAAuB,SAAgB,EAAE,EAAE,EAEtE,IAAgB,GAAK,iBAAiB,MACtC,IAAkB,GAAK,mBAAmB,MAE1C,IAAc,SAAgB;GAClC,IAAI,EAAM;GACV,aAAa,EAAM;GACnB,aAAa,EAAM;GACnB,aAAa,EAAM;GACnB,eAAe,EAAM;GACrB,eAAe,EAAM;GACrB,cAAc,EAAM;GACpB,WAAW,EAAM,aAAa;GAC9B,aAAa,EAAM,eAAe;GAClC,WAAW,EAAM,aAAa;GAC/B,EAAE;AAeH,EAbA,QAAgB;AACd,GAAI,KACF,EAAc,EAAY,MAAM;IAElC,EAEF,QAAkB;AAChB,GAAI,KACF,EAAgB,EAAM,GAAG;IAE3B,EAGF,EAAM,SAAmB;AACvB,GAAI,KAAe,EAAc,EAAY,MAAM;KAClD,EAAE,MAAM,IAAM,CAAC;EAElB,IAAM,IAAgB,GAAK,iBAAiB,MACtC,IAAiB,GAAK,kBAAkB,QAAe,GAAM;AAEnE,UACQ,EAAM,YACZ,MAAgB;AACV,KAAe,SACf,KAAiB,MAAiB,KAAA,KACpC,EAAc,EAAM,IAAI,EAAa;KAGzC,EAAE,WAAW,IAAM,CACpB;EAED,IAAM,IAAW,GAAK,YAAY,wBAAe,IAAI,KAAK,CAAC,EACrD,IAAQ,QAAe,EAAS,MAAM,IAAI,EAAM,GAAG,CAAC,EAEpD,IAAc,QAAe;GACjC,IAAM,IAAW,EAAU,MAAM,OAAO,IAAI,EAAM,GAAG;AAerD,UAbK,IAID,EAAS,YACJ;IACL,kBAAkB,GAAG,EAAS,KAAK;IACnC,YAAY;IACZ,UAAU;IACV,eAAe;IAChB,GAGI;IACL,kBAAkB,GAAG,EAAS,KAAK;IACnC,gBAAgB,GAAG,EAAS,MAAM;IACnC,GAfQ;IAAE,kBAAkB;IAAO,YAAY;IAAO,eAAe;IAAQ;IAgB9E;yBAhJA,EAyBM,OAAA;GAxBH,IAAE,sBAAwB,EAAM;GACjC,OAAK,EAAA,CAAC,qBAAmB,CACT,EAAM,OAAA;oCAAuD,EAAA,SAAS,EAAA,MAAM,cAAS;gCAA+C,EAAA,SAAS,EAAA,MAAM,cAAS;;GAO3K,OAAK,EAAE,EAAA,MAAW;GAClB,iBAAe,EAAM;GACtB,WAAQ;MAER,EAUM,OAAA;GATJ,OAAM;GACL,OAAK,EAAE,EAAA,EAAmB,CAAA;MAG3B,EAIE,EAAA,QAAA,WAAA;GAHC,OAAO,EAAA;GACP,aAAc,EAAA,OAAO;GACrB,YAAa,EAAA,EAAU"}

package/dist/lib/resizable/resizable.cjs

@@ -1 +1 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require(`../../resizable-DdPrpKvD.cjs`);exports.default=e.t;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require(`../../resizable-aOVGO_Os.cjs`);exports.default=e.t;

package/dist/lib/resizable/resizable.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../resizable-CcxS3dH7.js";
+import { t as e } from "../../resizable-D4-peBOl.js";
 export { e as default };

package/dist/lib/rich-text-editor/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../rich_text_editor-TolFmwK_.cjs`),t=require(`./rich-text-editor-constants.cjs`);exports.DtRichTextEditor=e.t,exports.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES=t.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES,exports.RICH_TEXT_EDITOR_OUTPUT_FORMATS=t.RICH_TEXT_EDITOR_OUTPUT_FORMATS;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../rich_text_editor-FduHYl-G.cjs`),t=require(`./rich-text-editor-constants.cjs`);exports.DtRichTextEditor=e.t,exports.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES=t.RICH_TEXT_EDITOR_AUTOFOCUS_TYPES,exports.RICH_TEXT_EDITOR_OUTPUT_FORMATS=t.RICH_TEXT_EDITOR_OUTPUT_FORMATS;

package/dist/lib/rich-text-editor/index.js

@@ -1,3 +1,3 @@
-import { t as e } from "../../rich_text_editor-DRwU4mUa.js";
+import { t as e } from "../../rich_text_editor-DYu2R0kw.js";
 import { RICH_TEXT_EDITOR_AUTOFOCUS_TYPES as t, RICH_TEXT_EDITOR_OUTPUT_FORMATS as n } from "./rich-text-editor-constants.js";
 export { e as DtRichTextEditor, t as RICH_TEXT_EDITOR_AUTOFOCUS_TYPES, n as RICH_TEXT_EDITOR_OUTPUT_FORMATS };

package/dist/lib/rich-text-editor/markdownRenderer.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../markdownRenderer-Dsq-CiH9.cjs`);exports.renderEditorToMarkdown=e.t;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../../markdownRenderer-DCgGQseq.cjs`);exports.renderEditorToMarkdown=e.t;

package/dist/lib/rich-text-editor/markdownRenderer.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../markdownRenderer-k7_rQkox.js";
+import { t as e } from "../../markdownRenderer-D_P94RyM.js";
 export { e as renderEditorToMarkdown };

package/dist/lib/rich-text-editor/rich-text-editor.cjs

@@ -1 +1 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require(`../../rich_text_editor-TolFmwK_.cjs`);exports.default=e.t;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require(`../../rich_text_editor-FduHYl-G.cjs`);exports.default=e.t;

package/dist/lib/rich-text-editor/rich-text-editor.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../rich_text_editor-DRwU4mUa.js";
+import { t as e } from "../../rich_text_editor-DYu2R0kw.js";
 export { e as default };

package/dist/lib/root-layout/root-layout-constants.cjs

@@ -1,2 +1,2 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e={START:`start`,END:`end`,LEFT:`left`,RIGHT:`right`},t=[`sm`,`md`,`lg`,null],n={ROOT_LAYOUT_SIDEBAR_POSITIONS:e,ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS:t};exports.ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS=t,exports.ROOT_LAYOUT_SIDEBAR_POSITIONS=e,exports.default=n;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e={LEFT:`left`,RIGHT:`right`},t=[`sm`,`md`,`lg`,null],n={ROOT_LAYOUT_SIDEBAR_POSITIONS:e,ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS:t};exports.ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS=t,exports.ROOT_LAYOUT_SIDEBAR_POSITIONS=e,exports.default=n;
 //# sourceMappingURL=root-layout-constants.cjs.map

package/dist/lib/root-layout/root-layout-constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"root-layout-constants.cjs","names":[],"sources":["../../../components/root_layout/root_layout_constants.js"],"sourcesContent":["export const ROOT_LAYOUT_SIDEBAR_POSITIONS = {\n  START: 'start',\n  END: 'end',\n  LEFT: 'left',\n  RIGHT: 'right',\n};\n\nexport const ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS = ['sm', 'md', 'lg', null];\n\nexport default {\n  ROOT_LAYOUT_SIDEBAR_POSITIONS,\n  ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS,\n};\n"],"mappings":"+FAAA,IAAa,EAAgC,CAC3C,MAAO,QACP,IAAK,MACL,KAAM,OACN,MAAO,QACR,CAEY,EAAqC,CAAC,KAAM,KAAM,KAAM,KAAK,CAE1E,EAAe,CACb,gCACA,qCACD"}
+{"version":3,"file":"root-layout-constants.cjs","names":[],"sources":["../../../components/root_layout/root_layout_constants.js"],"sourcesContent":["export const ROOT_LAYOUT_SIDEBAR_POSITIONS = {\n  LEFT: 'left',\n  RIGHT: 'right',\n};\n\nexport const ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS = ['sm', 'md', 'lg', null];\n\nexport default {\n  ROOT_LAYOUT_SIDEBAR_POSITIONS,\n  ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS,\n};\n"],"mappings":"+FAAA,IAAa,EAAgC,CAC3C,KAAM,OACN,MAAO,QACR,CAEY,EAAqC,CAAC,KAAM,KAAM,KAAM,KAAK,CAE1E,EAAe,CACb,gCACA,qCACD"}

package/dist/lib/root-layout/root-layout-constants.js

@@ -1,7 +1,5 @@
 //#region components/root_layout/root_layout_constants.js
 var e = {
-	START: "start",
-	END: "end",
 	LEFT: "left",
 	RIGHT: "right"
 }, t = [

package/dist/lib/root-layout/root-layout-constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"root-layout-constants.js","names":[],"sources":["../../../components/root_layout/root_layout_constants.js"],"sourcesContent":["export const ROOT_LAYOUT_SIDEBAR_POSITIONS = {\n  START: 'start',\n  END: 'end',\n  LEFT: 'left',\n  RIGHT: 'right',\n};\n\nexport const ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS = ['sm', 'md', 'lg', null];\n\nexport default {\n  ROOT_LAYOUT_SIDEBAR_POSITIONS,\n  ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS,\n};\n"],"mappings":";AAAA,IAAa,IAAgC;CAC3C,OAAO;CACP,KAAK;CACL,MAAM;CACN,OAAO;CACR,EAEY,IAAqC;CAAC;CAAM;CAAM;CAAM;CAAK,EAE1E,IAAe;CACb;CACA;CACD"}
+{"version":3,"file":"root-layout-constants.js","names":[],"sources":["../../../components/root_layout/root_layout_constants.js"],"sourcesContent":["export const ROOT_LAYOUT_SIDEBAR_POSITIONS = {\n  LEFT: 'left',\n  RIGHT: 'right',\n};\n\nexport const ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS = ['sm', 'md', 'lg', null];\n\nexport default {\n  ROOT_LAYOUT_SIDEBAR_POSITIONS,\n  ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS,\n};\n"],"mappings":";AAAA,IAAa,IAAgC;CAC3C,MAAM;CACN,OAAO;CACR,EAEY,IAAqC;CAAC;CAAM;CAAM;CAAM;CAAK,EAE1E,IAAe;CACb;CACA;CACD"}

package/dist/lib/root-layout/root-layout.cjs

@@ -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(`./root-layout-constants.cjs`);let n=require(`vue`);var r={compatConfig:{MODE:3},name:`DtRootLayout`,props:{fixed:{type:Boolean,default:!0},headerClass:{type:[String,Array,Object],default:``},headerHeight:{type:String,default:`64px`},headerSticky:{type:Boolean,default:!1},bodyClass:{type:[String,Array,Object],default:``},contentClass:{type:[String,Array,Object],default:``},sidebarClass:{type:[String,Array,Object],default:``},sidebarWidth:{type:String,default:`256px`},sidebarPosition:{type:String,default:`start`,validator:e=>Object.values(t.ROOT_LAYOUT_SIDEBAR_POSITIONS).includes(e)},footerClass:{type:[String,Array,Object],default:``},footerHeight:{type:String,default:`64px`},responsiveBreakpoint:{type:String,default:null,validator:e=>t.ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS.includes(e)}},computed:{isInverted(){return this.sidebarPosition===t.ROOT_LAYOUT_SIDEBAR_POSITIONS.END||this.sidebarPosition===t.ROOT_LAYOUT_SIDEBAR_POSITIONS.RIGHT},responsiveBreakpointClass(){return this.responsiveBreakpoint?`d-root-layout__responsive--${this.responsiveBreakpoint}`:`d-root-layout__responsive--default`}}};function i(e,t,r,i,a,o){return(0,n.openBlock)(),(0,n.createElementBlock)(`div`,{class:(0,n.normalizeClass)([`root-layout`,`d-root-layout`,{"d-root-layout--fixed":r.fixed,"d-root-layout--inverted":o.isInverted},o.responsiveBreakpointClass]),"data-qa":`dt-root-layout`},[(0,n.createElementVNode)(`header`,{class:(0,n.normalizeClass)([`d-root-layout__header`,{"d-root-layout__header--sticky":r.headerSticky},r.headerClass]),"data-qa":`dt-root-layout-header`},[(0,n.renderSlot)(e.$slots,`header`)],2),(0,n.createElementVNode)(`aside`,{ref:`root-layout-sidebar`,tabindex:`0`,class:(0,n.normalizeClass)([`d-root-layout__sidebar`,r.sidebarClass]),"data-qa":`dt-root-layout-sidebar`},[(0,n.renderSlot)(e.$slots,`sidebar`)],2),(0,n.createElementVNode)(`main`,{ref:`root-layout-content`,class:(0,n.normalizeClass)([`d-root-layout__content`,r.contentClass]),"data-qa":`dt-root-layout-content`,tabindex:`0`},[(0,n.renderSlot)(e.$slots,`default`)],2),(0,n.createElementVNode)(`footer`,{class:(0,n.normalizeClass)([`d-root-layout__footer`,r.footerClass]),"data-qa":`dt-root-layout-footer`},[(0,n.renderSlot)(e.$slots,`footer`)],2)],2)}var a=e.t(r,[[`render`,i]]);exports.default=a;
+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(`./root-layout-constants.cjs`);let n=require(`vue`);var r={compatConfig:{MODE:3},name:`DtRootLayout`,props:{fixed:{type:Boolean,default:!0},headerClass:{type:[String,Array,Object],default:``},headerHeight:{type:String,default:`64px`},headerSticky:{type:Boolean,default:!1},bodyClass:{type:[String,Array,Object],default:``},contentClass:{type:[String,Array,Object],default:``},sidebarClass:{type:[String,Array,Object],default:``},sidebarWidth:{type:String,default:`256px`},sidebarPosition:{type:String,default:`left`,validator:e=>Object.values(t.ROOT_LAYOUT_SIDEBAR_POSITIONS).includes(e)},footerClass:{type:[String,Array,Object],default:``},footerHeight:{type:String,default:`64px`},responsiveBreakpoint:{type:String,default:null,validator:e=>t.ROOT_LAYOUT_RESPONSIVE_BREAKPOINTS.includes(e)}},computed:{isInverted(){return this.sidebarPosition===t.ROOT_LAYOUT_SIDEBAR_POSITIONS.RIGHT},responsiveBreakpointClass(){return this.responsiveBreakpoint?`d-root-layout__responsive--${this.responsiveBreakpoint}`:`d-root-layout__responsive--default`}}};function i(e,t,r,i,a,o){return(0,n.openBlock)(),(0,n.createElementBlock)(`div`,{class:(0,n.normalizeClass)([`root-layout`,`d-root-layout`,{"d-root-layout--fixed":r.fixed,"d-root-layout--inverted":o.isInverted},o.responsiveBreakpointClass]),"data-qa":`dt-root-layout`},[(0,n.createElementVNode)(`header`,{class:(0,n.normalizeClass)([`d-root-layout__header`,{"d-root-layout__header--sticky":r.headerSticky},r.headerClass]),"data-qa":`dt-root-layout-header`},[(0,n.renderSlot)(e.$slots,`header`)],2),(0,n.createElementVNode)(`aside`,{ref:`root-layout-sidebar`,tabindex:`0`,class:(0,n.normalizeClass)([`d-root-layout__sidebar`,r.sidebarClass]),"data-qa":`dt-root-layout-sidebar`},[(0,n.renderSlot)(e.$slots,`sidebar`)],2),(0,n.createElementVNode)(`main`,{ref:`root-layout-content`,class:(0,n.normalizeClass)([`d-root-layout__content`,r.contentClass]),"data-qa":`dt-root-layout-content`,tabindex:`0`},[(0,n.renderSlot)(e.$slots,`default`)],2),(0,n.createElementVNode)(`footer`,{class:(0,n.normalizeClass)([`d-root-layout__footer`,r.footerClass]),"data-qa":`dt-root-layout-footer`},[(0,n.renderSlot)(e.$slots,`footer`)],2)],2)}var a=e.t(r,[[`render`,i]]);exports.default=a;
 //# sourceMappingURL=root-layout.cjs.map