@shopware-ag/meteor-component-library
Version:
The meteor component library is a Vue component library developed by Shopware. It is based on the [Meteor Design System](https://shopware.design/).
109 lines (108 loc) • 4.08 kB
JavaScript
import '../mt-radio-group-root.css';
import { defineComponent, computed, provide, readonly, openBlock, createElementBlock, createBlock, withCtx, createTextVNode, toDisplayString, createCommentVNode, createElementVNode, renderSlot, createVNode } from "vue";
import { u as useId } from "../useId-90f9ff46.mjs";
import MtFieldLabel from "./MtFieldLabel.js";
import MtFieldError from "./MtFieldError.js";
import MtHelpText from "./MtHelpText.js";
import { _ as _export_sfc } from "../_plugin-vue_export-helper-cc2b3d55.mjs";
import "../id-1e5b8276.mjs";
import "./MtInheritanceSwitch.js";
import "../mt-icon.vue_vue_type_style_index_0_lang-2cc5f73e.mjs";
import "./MtTooltip.js";
import "../floating-ui.vue-fe27ebef.mjs";
import "../floating-ui.dom-f450fda4.mjs";
import "../useIsInsideTooltip-0c3bd290.mjs";
import "../index-221bad05.mjs";
import "vue-i18n";
import "./MtText.js";
const _hoisted_1 = { class: "mt-radio-group-root" };
const _hoisted_2 = ["aria-disabled", "aria-describedby"];
const _hoisted_3 = {
key: 2,
class: "mt-radio-group-root__hint",
style: { gridArea: "hint" }
};
const _sfc_main = /* @__PURE__ */ defineComponent({
__name: "mt-radio-group-root",
props: {
modelValue: { type: [String, Number, Boolean, null], default: null },
disabled: { type: Boolean, default: false },
ariaDescribedBy: { default: void 0 },
label: { default: "" },
helpText: { default: "" },
name: { default: void 0 },
error: { default: void 0 }
},
emits: ["update:modelValue"],
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const id = useId();
const identification = computed(() => {
if (props.name) {
return props.name;
}
return `mt-field--${id.value}`;
});
const selectedValue = computed({
get: () => props.modelValue,
set: (val) => emit("update:modelValue", val)
});
const selectOption = (value) => {
selectedValue.value = value;
};
provide("radioGroupContext", {
selectedValue: readonly(selectedValue),
selectOption,
disabled: computed(() => props.disabled),
name: computed(() => props.name || identification.value)
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1, [
_ctx.label ? (openBlock(), createBlock(MtFieldLabel, {
key: 0,
class: "mt-radio-group-root__label",
for: identification.value,
disabled: _ctx.disabled,
"has-error": !!_ctx.error,
style: { gridArea: "label" }
}, {
default: withCtx(() => [
createTextVNode(toDisplayString(_ctx.label), 1)
]),
_: 1
}, 8, ["for", "disabled", "has-error"])) : createCommentVNode("", true),
_ctx.helpText ? (openBlock(), createBlock(MtHelpText, {
key: 1,
text: _ctx.helpText,
style: { gridArea: "help-text" }
}, null, 8, ["text"])) : createCommentVNode("", true),
createElementVNode("div", {
class: "mt-radio-group-root__options",
role: "radiogroup",
"aria-disabled": _ctx.disabled || void 0,
"aria-describedby": _ctx.ariaDescribedBy,
style: { gridArea: "options" }
}, [
renderSlot(_ctx.$slots, "default", {
disabled: _ctx.disabled,
identification: identification.value
}, void 0, true)
], 8, _hoisted_2),
createVNode(MtFieldError, {
error: _ctx.error,
style: { gridArea: "error" }
}, null, 8, ["error"]),
_ctx.$slots.hint ? (openBlock(), createElementBlock("div", _hoisted_3, [
renderSlot(_ctx.$slots, "hint", {}, void 0, true)
])) : createCommentVNode("", true)
]);
};
}
});
const mtRadioGroupRoot_vue_vue_type_style_index_0_scoped_65c8ac58_lang = "";
const mtRadioGroupRoot = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-65c8ac58"]]);
export {
mtRadioGroupRoot as default
};
//# sourceMappingURL=MtRadioGroupRoot.js.map