@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/).
108 lines (107 loc) • 4.06 kB
JavaScript
import '../mt-radio-group-root.css';
;
const vue = require("vue");
const useId = require("../useId-31db4781.js");
const MtFieldLabel = require("./MtFieldLabel.js");
const MtFieldError = require("./MtFieldError.js");
const MtHelpText = require("./MtHelpText.js");
const _pluginVue_exportHelper = require("../_plugin-vue_export-helper-9c783a34.js");
require("../id-8e80f112.js");
require("./MtInheritanceSwitch.js");
require("../mt-icon.vue_vue_type_style_index_0_lang-0a28c7b6.js");
require("./MtTooltip.js");
require("../floating-ui.vue-48d5c774.js");
require("../floating-ui.dom-fe395b67.js");
require("../useIsInsideTooltip-f4674e27.js");
require("../index-ab705c2a.js");
require("vue-i18n");
require("./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__ */ vue.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.useId();
const identification = vue.computed(() => {
if (props.name) {
return props.name;
}
return `mt-field--${id.value}`;
});
const selectedValue = vue.computed({
get: () => props.modelValue,
set: (val) => emit("update:modelValue", val)
});
const selectOption = (value) => {
selectedValue.value = value;
};
vue.provide("radioGroupContext", {
selectedValue: vue.readonly(selectedValue),
selectOption,
disabled: vue.computed(() => props.disabled),
name: vue.computed(() => props.name || identification.value)
});
return (_ctx, _cache) => {
return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
_ctx.label ? (vue.openBlock(), vue.createBlock(MtFieldLabel, {
key: 0,
class: "mt-radio-group-root__label",
for: identification.value,
disabled: _ctx.disabled,
"has-error": !!_ctx.error,
style: { gridArea: "label" }
}, {
default: vue.withCtx(() => [
vue.createTextVNode(vue.toDisplayString(_ctx.label), 1)
]),
_: 1
}, 8, ["for", "disabled", "has-error"])) : vue.createCommentVNode("", true),
_ctx.helpText ? (vue.openBlock(), vue.createBlock(MtHelpText, {
key: 1,
text: _ctx.helpText,
style: { gridArea: "help-text" }
}, null, 8, ["text"])) : vue.createCommentVNode("", true),
vue.createElementVNode("div", {
class: "mt-radio-group-root__options",
role: "radiogroup",
"aria-disabled": _ctx.disabled || void 0,
"aria-describedby": _ctx.ariaDescribedBy,
style: { gridArea: "options" }
}, [
vue.renderSlot(_ctx.$slots, "default", {
disabled: _ctx.disabled,
identification: identification.value
}, void 0, true)
], 8, _hoisted_2),
vue.createVNode(MtFieldError, {
error: _ctx.error,
style: { gridArea: "error" }
}, null, 8, ["error"]),
_ctx.$slots.hint ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3, [
vue.renderSlot(_ctx.$slots, "hint", {}, void 0, true)
])) : vue.createCommentVNode("", true)
]);
};
}
});
const mtRadioGroupRoot_vue_vue_type_style_index_0_scoped_65c8ac58_lang = "";
const mtRadioGroupRoot = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["__scopeId", "data-v-65c8ac58"]]);
module.exports = mtRadioGroupRoot;
//# sourceMappingURL=MtRadioGroupRoot.js.map