bootstrap-vue-next
Version:
Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development
417 lines (416 loc) • 12.5 kB
JavaScript
import { d as formGroupKey, y as radioGroupKey } from "./keys-CQKrwmvN.mjs";
import { h as useFocus } from "./dist-Dn5blevd.mjs";
import { o as isEmptySlot } from "./dom-AhkaSoh8.mjs";
import { t as useDefaults } from "./useDefaults-BKgBaqOV.mjs";
import { t as useId$1 } from "./useId-BKZFSYm8.mjs";
import { t as ConditionalWrapper_default } from "./ConditionalWrapper-BjjQWNtR.mjs";
import { a as getLabelClasses, i as getInputClasses, n as getGroupAttr, r as getGroupClasses, t as getClasses } from "./useFormCheck-9Ne69Sw9.mjs";
import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, guardReactiveProps, inject, mergeModels, mergeProps, normalizeClass, normalizeProps, openBlock, provide, renderList, renderSlot, toDisplayString, toRef, unref, useModel, useSlots, useTemplateRef, vModelRadio, withCtx, withDirectives } from "vue";
//#region src/components/BFormRadio/BFormRadio.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1$1 = [
"id",
"disabled",
"required",
"name",
"form",
"aria-label",
"aria-labelledby",
"value",
"aria-required"
];
var _hoisted_2 = ["for"];
//#endregion
//#region src/components/BFormRadio/BFormRadio.vue
var BFormRadio_default = /* @__PURE__ */ defineComponent({
inheritAttrs: false,
__name: "BFormRadio",
props: /* @__PURE__ */ mergeModels({
ariaLabel: { default: void 0 },
ariaLabelledby: { default: void 0 },
autofocus: {
type: Boolean,
default: false
},
button: {
type: Boolean,
default: void 0
},
buttonGroup: {
type: Boolean,
default: false
},
buttonVariant: { default: void 0 },
disabled: {
type: Boolean,
default: false
},
form: { default: void 0 },
id: { default: void 0 },
inline: {
type: Boolean,
default: void 0
},
name: { default: void 0 },
plain: {
type: Boolean,
default: void 0
},
required: {
type: Boolean,
default: false
},
reverse: {
type: Boolean,
default: void 0
},
size: { default: void 0 },
state: {
type: [Boolean, null],
default: void 0
},
value: {
type: [
Boolean,
String,
Array,
Object,
Number,
null
],
default: true
}
}, {
"modelValue": {
type: [
Boolean,
String,
Array,
Object,
Number,
null
],
default: void 0
},
"modelModifiers": {}
}),
emits: ["update:modelValue"],
setup(__props, { expose: __expose }) {
const props = useDefaults(__props, "BFormRadio");
const slots = useSlots();
const modelValue = useModel(__props, "modelValue");
const computedId = useId$1(() => props.id, "form-check");
const parentData = inject(radioGroupKey, null);
const formGroupData = inject(formGroupKey, null)?.(computedId);
const input = useTemplateRef("_input");
const { focused } = useFocus(input, { initialValue: props.autofocus });
const hasDefaultSlot = computed(() => !isEmptySlot(slots.default));
const propDefaults = {
plain: false,
button: false,
inline: false,
reverse: false,
size: "md",
buttonVariant: "secondary",
state: null
};
const resolvedProps = computed(() => ({
plain: props.plain ?? parentData?.plain.value ?? propDefaults.plain,
button: props.button ?? parentData?.buttons.value ?? propDefaults.button,
inline: props.inline ?? parentData?.inline.value ?? propDefaults.inline,
reverse: props.reverse ?? parentData?.reverse.value ?? propDefaults.reverse,
state: props.state ?? parentData?.state.value ?? propDefaults.state,
size: props.size ?? parentData?.size.value ?? propDefaults.size,
buttonVariant: props.buttonVariant ?? parentData?.buttonVariant.value ?? propDefaults.buttonVariant
}));
const resolvedPlain = computed(() => resolvedProps.value.plain);
const localValue = computed({
get: () => parentData ? parentData.modelValue.value : modelValue.value,
set: (newValue) => {
if (newValue === void 0) return;
if (parentData !== null) {
parentData.modelValue.value = newValue;
return;
}
modelValue.value = newValue;
}
});
const computedRequired = computed(() => !!(props.name ?? parentData?.name.value) && (props.required || parentData?.required.value));
const isButtonGroup = computed(() => props.buttonGroup || (parentData?.buttons.value ?? false));
const classesObject = computed(() => ({
...resolvedProps.value,
hasDefaultSlot: hasDefaultSlot.value
}));
const computedClasses = getClasses(classesObject);
const inputClasses = getInputClasses(classesObject);
const labelClasses = getLabelClasses(classesObject);
__expose({
blur: () => {
focused.value = false;
},
element: input,
focus: () => {
focused.value = true;
}
});
return (_ctx, _cache) => {
return openBlock(), createBlock(ConditionalWrapper_default, {
skip: isButtonGroup.value,
class: normalizeClass(unref(computedClasses))
}, {
default: withCtx(() => [withDirectives(createElementVNode("input", mergeProps({ id: unref(computedId) }, _ctx.$attrs, {
ref: "_input",
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => localValue.value = $event),
class: unref(inputClasses),
type: "radio",
disabled: unref(props).disabled || unref(parentData)?.disabled.value || unref(formGroupData)?.disabled.value,
required: computedRequired.value || void 0,
name: unref(props).name || unref(parentData)?.name.value,
form: unref(props).form || unref(parentData)?.form.value,
"aria-label": unref(props).ariaLabel,
"aria-labelledby": unref(props).ariaLabelledby,
value: unref(props).value,
"aria-required": computedRequired.value || void 0
}), null, 16, _hoisted_1$1), [[vModelRadio, localValue.value]]), hasDefaultSlot.value || !resolvedPlain.value ? (openBlock(), createElementBlock("label", {
key: 0,
for: unref(computedId),
class: normalizeClass(unref(labelClasses))
}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_2)) : createCommentVNode("", true)]),
_: 3
}, 8, ["skip", "class"]);
};
}
});
//#endregion
//#region src/components/BFormRadio/BFormRadioGroupBase.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1 = ["id"];
//#endregion
//#region src/components/BFormRadio/BFormRadioGroupBase.vue
var BFormRadioGroupBase_default = /* @__PURE__ */ defineComponent({
__name: "BFormRadioGroupBase",
props: /* @__PURE__ */ mergeModels({
ariaInvalid: {
type: [Boolean, String],
default: void 0
},
autofocus: {
type: Boolean,
default: false
},
buttonVariant: { default: "secondary" },
buttons: {
type: Boolean,
default: false
},
disabled: {
type: Boolean,
default: false
},
form: { default: void 0 },
id: { default: void 0 },
name: { default: void 0 },
options: { default: () => [] },
plain: {
type: Boolean,
default: false
},
required: {
type: Boolean,
default: false
},
reverse: {
type: Boolean,
default: false
},
size: { default: "md" },
stacked: {
type: Boolean,
default: false
},
state: {
type: [Boolean, null],
default: null
},
validated: {
type: Boolean,
default: false
}
}, {
"modelValue": { default: null },
"modelModifiers": {}
}),
emits: ["update:modelValue"],
setup(__props, { expose: __expose }) {
const props = useDefaults(__props, "BFormRadioGroup");
const modelValue = useModel(__props, "modelValue");
const computedId = useId$1(() => props.id, "radio");
const computedName = useId$1(() => props.name, "radio");
const { focused } = useFocus(useTemplateRef("_element"), { initialValue: props.autofocus });
const normalizedOptions = computed(() => props.options.map((option) => {
if (typeof option === "object" && option !== null) return {
...option,
disabled: props.disabled ? true : option.disabled ?? false
};
return {
text: String(option),
value: option,
disabled: props.disabled ? true : false
};
}));
provide(radioGroupKey, {
modelValue,
buttonVariant: toRef(() => props.buttonVariant),
form: toRef(() => props.form),
name: computedName,
buttons: toRef(() => props.buttons),
state: toRef(() => props.state),
plain: toRef(() => props.plain),
size: toRef(() => props.size),
inline: toRef(() => !props.stacked),
reverse: toRef(() => props.reverse),
required: toRef(() => props.required),
disabled: toRef(() => props.disabled)
});
const classesObject = computed(() => ({
required: props.required,
ariaInvalid: props.ariaInvalid,
state: props.state,
validated: props.validated,
buttons: props.buttons,
stacked: props.stacked,
size: props.size
}));
const computedAttrs = getGroupAttr(classesObject);
const computedClasses = getGroupClasses(classesObject);
__expose({
blur: () => {
focused.value = false;
},
focus: () => {
focused.value = true;
}
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", mergeProps(unref(computedAttrs), {
id: unref(computedId),
ref: "_element",
role: "radiogroup",
class: [unref(computedClasses), "bv-no-focus-ring"],
tabindex: "-1"
}), [
renderSlot(_ctx.$slots, "first"),
(openBlock(true), createElementBlock(Fragment, null, renderList(normalizedOptions.value, (item, index) => {
return openBlock(), createBlock(BFormRadio_default, mergeProps({ key: index }, { ref_for: true }, item), {
default: withCtx(() => [renderSlot(_ctx.$slots, "option", mergeProps({ ref_for: true }, item), () => [createTextVNode(toDisplayString(item.text), 1)])]),
_: 2
}, 1040);
}), 128)),
renderSlot(_ctx.$slots, "default")
], 16, _hoisted_1);
};
}
});
//#endregion
//#region src/components/BFormRadio/BFormRadioGroup.vue
var BFormRadioGroup_default = /* @__PURE__ */ defineComponent({
__name: "BFormRadioGroup",
props: /* @__PURE__ */ mergeModels({
ariaInvalid: {
type: [Boolean, String],
default: void 0
},
autofocus: {
type: Boolean,
default: false
},
buttonVariant: { default: "secondary" },
buttons: {
type: Boolean,
default: false
},
disabled: {
type: Boolean,
default: false
},
disabledField: { default: "disabled" },
form: { default: void 0 },
id: { default: void 0 },
name: { default: void 0 },
options: { default: () => [] },
plain: {
type: Boolean,
default: false
},
required: {
type: Boolean,
default: false
},
reverse: {
type: Boolean,
default: false
},
size: { default: "md" },
stacked: {
type: Boolean,
default: false
},
state: {
type: [Boolean, null],
default: null
},
textField: { default: "text" },
validated: {
type: Boolean,
default: false
},
valueField: { default: "value" }
}, {
"modelValue": { default: void 0 },
"modelModifiers": {}
}),
emits: ["update:modelValue"],
setup(__props) {
const props = __props;
const modelValue = useModel(__props, "modelValue");
const normalizedOptions = computed(() => (props.options ?? []).map((el) => typeof el === "string" || typeof el === "number" || typeof el === "boolean" ? {
value: el,
disabled: props.disabled,
text: el.toString()
} : {
value: el[props.valueField],
disabled: props.disabled || (el[props.disabledField] ?? false),
text: el[props.textField] ?? ""
}));
const forwardedProps = computed(() => ({
id: props.id,
name: props.name,
size: props.size,
state: props.state,
buttonVariant: props.buttonVariant,
buttons: props.buttons,
stacked: props.stacked,
disabled: props.disabled,
required: props.required,
validated: props.validated,
autofocus: props.autofocus,
form: props.form,
ariaInvalid: props.ariaInvalid,
plain: props.plain,
reverse: props.reverse
}));
return (_ctx, _cache) => {
return openBlock(), createBlock(BFormRadioGroupBase_default, mergeProps(forwardedProps.value, {
modelValue: modelValue.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
options: normalizedOptions.value
}), {
first: withCtx(() => [renderSlot(_ctx.$slots, "first")]),
option: withCtx((slotProps) => [renderSlot(_ctx.$slots, "option", normalizeProps(guardReactiveProps(slotProps)))]),
default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
_: 3
}, 16, ["modelValue", "options"]);
};
}
});
//#endregion
export { BFormRadio_default as n, BFormRadioGroup_default as t };
//# sourceMappingURL=BFormRadio-B7fL16AZ.mjs.map