bootstrap-vue-next
Version:
Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development
203 lines (202 loc) • 6.94 kB
JavaScript
require("./chunk-CoQrYLCe.js");
const require_dist = require("./dist-BJ15ThEs.js");
const require_dom = require("./dom-Bs6DzM72.js");
const require_useDefaults = require("./useDefaults-DsLf4iRY.js");
const require_useFormInput = require("./useFormInput-CsR38QR6.js");
let vue = require("vue");
//#region src/composables/useTextareaResize.ts
var useTextareaResize = (input, { maxRows, noAutoShrink, rows }) => {
const height = (0, vue.ref)(0);
const maxRowsNumber = require_dist.useToNumber((0, vue.computed)(() => (0, vue.toValue)(maxRows) || NaN), {
method: "parseInt",
nanToZero: true
});
const rowsNumber = require_dist.useToNumber(rows, {
method: "parseInt",
nanToZero: true
});
const computedMinRows = (0, vue.computed)(() => Math.max(rowsNumber.value || 2, 2));
const computedMaxRows = (0, vue.computed)(() => Math.max(computedMinRows.value, maxRowsNumber.value || 0));
const computedRows = (0, vue.computed)(() => computedMinRows.value === computedMaxRows.value ? computedMinRows.value : null);
const handleHeightChange = async () => {
if (!input.value || !require_dom.isVisible(input.value)) {
height.value = null;
return;
}
const computedStyle = getComputedStyle(input.value);
const lineHeight = Number.parseFloat(computedStyle.lineHeight) || 1;
const border = (Number.parseFloat(computedStyle.borderTopWidth) || 0) + (Number.parseFloat(computedStyle.borderBottomWidth) || 0);
const padding = (Number.parseFloat(computedStyle.paddingTop) || 0) + (Number.parseFloat(computedStyle.paddingBottom) || 0);
const offset = border + padding;
const minHeight = lineHeight * computedMinRows.value + offset;
const oldHeight = input.value.style.height || computedStyle.height;
height.value = "auto";
await (0, vue.nextTick)();
if (!input.value) return;
const { scrollHeight } = input.value;
height.value = oldHeight;
await (0, vue.nextTick)();
if (!input.value) return;
const contentRows = Math.max((scrollHeight - padding) / lineHeight, 2);
const rows = Math.min(Math.max(contentRows, computedMinRows.value), computedMaxRows.value);
const newHeight = Math.max(Math.ceil(rows * lineHeight + offset), minHeight);
if ((0, vue.toValue)(noAutoShrink) && (Number.parseFloat(oldHeight.toString()) || 0) > newHeight) {
height.value = oldHeight;
return;
}
height.value = `${newHeight}px`;
};
(0, vue.onMounted)(handleHeightChange);
return {
onInput: handleHeightChange,
computedStyles: (0, vue.computed)(() => ({
resize: "none",
height: typeof height.value === "string" ? height.value : height.value ? `${height.value}px` : void 0
})),
computedRows
};
};
//#endregion
//#region src/components/BFormTextarea/BFormTextarea.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1 = [
"id",
"name",
"form",
"value",
"disabled",
"placeholder",
"required",
"autocomplete",
"readonly",
"aria-required",
"aria-invalid",
"rows",
"wrap"
];
//#endregion
//#region src/components/BFormTextarea/BFormTextarea.vue
var BFormTextarea_default = /* @__PURE__ */ (0, vue.defineComponent)({
__name: "BFormTextarea",
props: /* @__PURE__ */ (0, vue.mergeModels)({
noResize: {
type: Boolean,
default: false
},
rows: { default: 2 },
wrap: { default: "soft" },
noAutoShrink: {
type: Boolean,
default: false
},
maxRows: { default: void 0 },
ariaInvalid: {
type: [Boolean, String],
default: void 0
},
autocomplete: { default: void 0 },
autofocus: {
type: Boolean,
default: false
},
disabled: {
type: Boolean,
default: false
},
form: { default: void 0 },
formatter: {
type: Function,
default: void 0
},
id: { default: void 0 },
lazyFormatter: {
type: Boolean,
default: false
},
list: { default: void 0 },
name: { default: void 0 },
placeholder: { default: void 0 },
plaintext: {
type: Boolean,
default: false
},
readonly: {
type: Boolean,
default: false
},
required: {
type: Boolean,
default: false
},
size: { default: void 0 },
state: {
type: [Boolean, null],
default: void 0
},
debounce: { default: 0 },
debounceMaxWait: { default: NaN }
}, {
"modelValue": { default: "" },
"modelModifiers": {}
}),
emits: ["update:modelValue"],
setup(__props, { expose: __expose }) {
const props = require_useDefaults.useDefaults(__props, "BFormTextarea");
const [modelValue, modelModifiers] = (0, vue.useModel)(__props, "modelValue", { set: (v) => require_useFormInput.normalizeInput(v, modelModifiers) });
const input = (0, vue.useTemplateRef)("_input");
const { computedId, computedAriaInvalid, onInput, stateClass, onChange, onBlur, focus, blur, isDisabled } = require_useFormInput.useFormInput(props, input, modelValue, modelModifiers);
const computedClasses = (0, vue.computed)(() => [
stateClass.value,
props.plaintext ? "form-control-plaintext" : "form-control",
{ [`form-control-${props.size}`]: !!props.size }
]);
const { computedStyles: resizeStyles, onInput: handleHeightChange, computedRows } = useTextareaResize(input, {
maxRows: () => props.maxRows,
rows: () => props.rows,
noAutoShrink: () => props.noAutoShrink
});
const computedStyles = (0, vue.computed)(() => ({
resize: props.noResize ? "none" : void 0,
...props.maxRows || props.noAutoShrink ? resizeStyles.value : void 0
}));
__expose({
blur,
element: input,
flushDebounce: onBlur,
focus
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("textarea", {
id: (0, vue.unref)(computedId),
ref: "_input",
class: (0, vue.normalizeClass)(computedClasses.value),
name: (0, vue.unref)(props).name || void 0,
form: (0, vue.unref)(props).form || void 0,
value: (0, vue.unref)(modelValue) ?? void 0,
disabled: (0, vue.unref)(isDisabled),
placeholder: (0, vue.unref)(props).placeholder,
required: (0, vue.unref)(props).required || void 0,
autocomplete: (0, vue.unref)(props).autocomplete || void 0,
readonly: (0, vue.unref)(props).readonly || (0, vue.unref)(props).plaintext,
"aria-required": (0, vue.unref)(props).required || void 0,
"aria-invalid": (0, vue.unref)(computedAriaInvalid),
rows: (0, vue.unref)(computedRows) || 2,
style: (0, vue.normalizeStyle)(computedStyles.value),
wrap: (0, vue.unref)(props).wrap || void 0,
onInput: _cache[0] || (_cache[0] = (e) => {
(0, vue.unref)(onInput)(e);
(0, vue.unref)(handleHeightChange)();
}),
onChange: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(onChange) && (0, vue.unref)(onChange)(...args)),
onBlur: _cache[2] || (_cache[2] = (...args) => (0, vue.unref)(onBlur) && (0, vue.unref)(onBlur)(...args))
}, null, 46, _hoisted_1);
};
}
});
//#endregion
Object.defineProperty(exports, "BFormTextarea_default", {
enumerable: true,
get: function() {
return BFormTextarea_default;
}
});
//# sourceMappingURL=BFormTextarea-8c3B3kAI.js.map