bootstrap-vue-next 0.46.4 → 1.0.1

package/dist/{BFormFile-BVrDprWL.js → BFormFile-C2DnrbK7.js}

@@ -3,7 +3,33 @@ import { o as isEmptySlot } from "./dom-BdUQrX99.js";
 import { t as useDefaults } from "./useDefaults-BzP4qZBu.js";
 import { t as useId$1 } from "./useId-Fh-Arhb7.js";
 import { t as useStateClass } from "./useStateClass-BF7kf2zK.js";
-import { computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, mergeModels, mergeProps, nextTick, normalizeClass, onMounted, openBlock, ref, renderSlot, toDisplayString, unref, useAttrs, useModel, useSlots, useTemplateRef, watch, withModifiers } from "vue";
+import { computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, mergeModels, mergeProps, nextTick, normalizeClass, onMounted, openBlock, readonly, ref, renderSlot, toDisplayString, unref, useAttrs, useModel, useSlots, useTemplateRef, watch, withModifiers } from "vue";
+//#region src/components/BFormFile/useAriaLiveMessage.ts
+/**
+* Manages an ARIA live region message with a clear-then-set pattern.
+*
+* Screen readers only announce `aria-live` content on a transition from empty
+* to non-empty text. By clearing the message first and then setting it in the
+* next tick we guarantee that every file selection produces that empty→non-empty
+* transition, even when the same file is selected again.
+*/
+var useAriaLiveMessage = (selectedFiles, formatter) => {
+	const ariaLiveMessage = ref("");
+	const buildMessage = (files) => {
+		if (files.length === 0) return "";
+		const fn = unref(formatter);
+		if (fn) return fn(files);
+		if (files.length === 1) return `File selected: ${files[0]?.name}`;
+		return `${files.length} files selected`;
+	};
+	watch(selectedFiles, async (files) => {
+		ariaLiveMessage.value = "";
+		await nextTick();
+		ariaLiveMessage.value = buildMessage(files);
+	});
+	return readonly(ariaLiveMessage);
+};
+//#endregion
 //#region src/components/BFormFile/BFormFile.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["for"];
 var _hoisted_2 = ["aria-disabled"];
@@ -204,13 +230,7 @@ var BFormFile_default = /* @__PURE__ */ defineComponent({
 			return `${names.length} files selected`;
 		});
 		const showExternalDisplay = computed(() => !props.plain && props.showFileNames && (hasFiles.value || props.placeholder));
-		const ariaLiveMessage = computed(() => {
-			if (!hasFiles.value) return "";
-			if (props.ariaLiveFormatter) return props.ariaLiveFormatter(selectedFiles.value);
-			const count = selectedFiles.value.length;
-			if (count === 1) return `File selected: ${selectedFiles.value[0]?.name}`;
-			return `${count} files selected`;
-		});
+		const ariaLiveMessage = useAriaLiveMessage(selectedFiles, computed(() => props.ariaLiveFormatter));
 		const effectiveBrowseText = computed(() => props.browseText ?? "Browse");
 		const effectiveDropPlaceholder = computed(() => props.dropPlaceholder ?? "Drop files here...");
 		const isFileAccepted = (file) => {
@@ -406,7 +426,7 @@ var BFormFile_default = /* @__PURE__ */ defineComponent({
 					files: selectedFiles.value,
 					names: fileNames.value
 				}, () => [hasFiles.value ? (openBlock(), createElementBlock("div", _hoisted_12, toDisplayString(formattedFileNames.value), 1)) : hasPlaceholderSlot.value || unref(props).placeholder ? (openBlock(), createElementBlock("div", _hoisted_13, [renderSlot(_ctx.$slots, "placeholder", {}, () => [createTextVNode(toDisplayString(unref(props).placeholder), 1)])])) : createCommentVNode("", true)])])) : createCommentVNode("", true),
-				!unref(props).plain ? (openBlock(), createElementBlock("div", _hoisted_14, toDisplayString(ariaLiveMessage.value), 1)) : createCommentVNode("", true)
+				!unref(props).plain ? (openBlock(), createElementBlock("div", _hoisted_14, toDisplayString(unref(ariaLiveMessage)), 1)) : createCommentVNode("", true)
 			], 16);
 		};
 	}
@@ -414,4 +434,4 @@ var BFormFile_default = /* @__PURE__ */ defineComponent({
 //#endregion
 export { BFormFile_default as t };
 
-//# sourceMappingURL=BFormFile-BVrDprWL.js.map
+//# sourceMappingURL=BFormFile-C2DnrbK7.js.map

package/dist/BFormFile-C2DnrbK7.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BFormFile-C2DnrbK7.js","names":[],"sources":["../src/components/BFormFile/useAriaLiveMessage.ts","../src/components/BFormFile/BFormFile.vue","../src/components/BFormFile/BFormFile.vue"],"sourcesContent":["import {nextTick, readonly, ref, unref, watch, type MaybeRef, type Ref} from 'vue'\n\n/**\n * Manages an ARIA live region message with a clear-then-set pattern.\n *\n * Screen readers only announce `aria-live` content on a transition from empty\n * to non-empty text. By clearing the message first and then setting it in the\n * next tick we guarantee that every file selection produces that empty→non-empty\n * transition, even when the same file is selected again.\n */\nexport const useAriaLiveMessage = (\n  selectedFiles: Ref<readonly File[]>,\n  formatter: MaybeRef<((files: readonly File[]) => string) | undefined>\n) => {\n  const ariaLiveMessage = ref('')\n\n  const buildMessage = (files: readonly File[]): string => {\n    if (files.length === 0) return ''\n    const fn = unref(formatter)\n    if (fn) {\n      return fn(files)\n    }\n    if (files.length === 1) {\n      return `File selected: ${files[0]?.name}`\n    }\n    return `${files.length} files selected`\n  }\n\n  watch(selectedFiles, async (files) => {\n    ariaLiveMessage.value = ''\n    await nextTick()\n    ariaLiveMessage.value = buildMessage(files)\n  })\n\n  return readonly(ariaLiveMessage)\n}\n","<template>\n  <div ref=\"rootRef\" v-bind=\"processedAttrs.rootAttrs\" class=\"b-form-file-root\">\n    <!-- Optional label -->\n    <label\n      v-if=\"hasLabelSlot || props.label\"\n      class=\"form-label\"\n      :class=\"props.labelClass\"\n      :for=\"computedId\"\n    >\n      <slot name=\"label\">\n        {{ props.label }}\n      </slot>\n    </label>\n\n    <!-- Drop zone wrapper -->\n    <div\n      v-if=\"!props.plain\"\n      ref=\"dropZoneRef\"\n      v-bind=\"processedAttrs.dropZoneAttrs\"\n      class=\"b-form-file-wrapper\"\n      :class=\"{\n        'b-form-file-dragging': isOverDropZone && !props.noDrop,\n        'b-form-file-has-files': hasFiles,\n      }\"\n    >\n      <!-- Custom file control (mimics Bootstrap native input) -->\n      <div\n        class=\"b-form-file-control\"\n        :class=\"computedClasses\"\n        :aria-disabled=\"props.disabled\"\n        @click=\"handleControlClick\"\n      >\n        <!-- Custom browse button (now on LEFT to match Bootstrap v5) -->\n        <button\n          v-if=\"!props.noButton\"\n          :id=\"computedId\"\n          ref=\"browseButtonRef\"\n          type=\"button\"\n          class=\"b-form-file-button\"\n          :disabled=\"props.disabled\"\n          :aria-label=\"props.ariaLabel\"\n          :aria-labelledby=\"props.ariaLabelledby\"\n          @click.stop=\"openFileDialog\"\n        >\n          {{ effectiveBrowseText }}\n        </button>\n\n        <!-- File name display -->\n        <div class=\"b-form-file-text\">\n          <slot name=\"file-name\" :files=\"selectedFiles\" :names=\"fileNames\">\n            <span v-if=\"hasFiles\">{{ formattedFileNames }}</span>\n            <span v-else-if=\"hasPlaceholderSlot || props.placeholder\" class=\"text-muted\">\n              <slot name=\"placeholder\">{{ props.placeholder }}</slot>\n            </span>\n          </slot>\n        </div>\n      </div>\n\n      <!-- Drag overlay (only shown when dragging) -->\n      <div v-if=\"isOverDropZone && !props.noDrop\" class=\"b-form-file-drag-overlay\">\n        <slot name=\"drop-placeholder\">\n          <div class=\"b-form-file-drag-text\">\n            {{ effectiveDropPlaceholder }}\n          </div>\n        </slot>\n      </div>\n\n      <!-- Hidden input for form submission (positioned behind UI with z-index) -->\n      <input\n        ref=\"customInputRef\"\n        v-bind=\"processedAttrs.inputAttrs\"\n        type=\"file\"\n        :name=\"props.name\"\n        :form=\"props.form\"\n        :multiple=\"props.multiple || props.directory\"\n        :disabled=\"props.disabled\"\n        :required=\"props.required\"\n        :accept=\"computedAccept || undefined\"\n        :capture=\"props.capture\"\n        :directory=\"props.directory || undefined\"\n        :webkitdirectory=\"props.directory || undefined\"\n        tabindex=\"-1\"\n        aria-hidden=\"true\"\n        style=\"\n          position: absolute;\n          z-index: -5;\n          width: 0;\n          height: 0;\n          opacity: 0;\n          overflow: hidden;\n          pointer-events: none;\n        \"\n      />\n    </div>\n\n    <!-- Plain mode - simple native input -->\n    <input\n      v-else\n      :id=\"computedId\"\n      ref=\"plainInputRef\"\n      v-bind=\"processedAttrs.inputAttrs\"\n      type=\"file\"\n      :class=\"computedPlainClasses\"\n      :form=\"props.form\"\n      :name=\"props.name\"\n      :multiple=\"props.multiple || props.directory\"\n      :disabled=\"props.disabled\"\n      :capture=\"props.capture\"\n      :accept=\"computedAccept || undefined\"\n      :required=\"props.required || undefined\"\n      :aria-label=\"props.ariaLabel\"\n      :aria-labelledby=\"props.ariaLabelledby\"\n      :aria-required=\"props.required || undefined\"\n      :directory=\"props.directory || undefined\"\n      :webkitdirectory=\"props.directory || undefined\"\n      @change=\"onPlainChange\"\n    />\n\n    <!-- External file display (when showFileNames is true and not plain) -->\n    <div v-if=\"showExternalDisplay\" class=\"b-form-file-display mt-2\">\n      <slot name=\"file-name\" :files=\"selectedFiles\" :names=\"fileNames\">\n        <div v-if=\"hasFiles\" class=\"small text-muted\">\n          {{ formattedFileNames }}\n        </div>\n        <div v-else-if=\"hasPlaceholderSlot || props.placeholder\" class=\"small text-muted\">\n          <slot name=\"placeholder\">\n            {{ props.placeholder }}\n          </slot>\n        </div>\n      </slot>\n    </div>\n\n    <!-- ARIA live region for screen reader announcements -->\n    <div v-if=\"!props.plain\" class=\"visually-hidden\" aria-live=\"polite\" aria-atomic=\"true\">\n      {{ ariaLiveMessage }}\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {useDropZone, useFileDialog} from '@vueuse/core'\nimport {computed, nextTick, onMounted, ref, type Ref, useAttrs, useTemplateRef, watch} from 'vue'\nimport {useDefaults} from '../../composables/useDefaults'\nimport {useId} from '../../composables/useId'\nimport {useStateClass} from '../../composables/useStateClass'\nimport {isEmptySlot} from '../../utils/dom'\nimport type {BFormFileProps, BFormFileSlots} from '../../types'\nimport {useAriaLiveMessage} from './useAriaLiveMessage'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst _props = withDefaults(defineProps<Omit<BFormFileProps, 'modelValue'>>(), {\n  ariaLabel: undefined,\n  ariaLabelledby: undefined,\n  accept: '',\n  autofocus: false,\n  browseText: undefined,\n  capture: undefined,\n  directory: false,\n  disabled: false,\n  dropPlaceholder: undefined,\n  fileNameFormatter: undefined,\n  ariaLiveFormatter: undefined,\n  form: undefined,\n  id: undefined,\n  label: '',\n  labelClass: undefined,\n  multiple: false,\n  name: undefined,\n  noButton: false,\n  noDrop: false,\n  plain: false,\n  placeholder: 'No file chosen',\n  required: false,\n  showFileNames: false,\n  size: undefined,\n  state: null,\n})\nconst props = useDefaults(_props, 'BFormFile')\nconst slots = defineSlots<BFormFileSlots>()\n\nconst emit = defineEmits<{\n  change: [value: Event]\n}>()\n\nconst modelValue = defineModel<Exclude<BFormFileProps['modelValue'], undefined>>({\n  default: null,\n})\n\nconst attrs = useAttrs()\n\nconst processedAttrs = computed(() => {\n  // In plain mode, pass all attributes to the input element\n  if (props.plain) {\n    return {\n      rootAttrs: {},\n      dropZoneAttrs: {},\n      inputAttrs: attrs,\n    }\n  }\n  // In custom mode, split attributes:\n  // - class/style go to root (for layout/positioning)\n  // - title goes to drop zone (for tooltip on interactive element)\n  // - everything else goes to hidden input (for form functionality)\n  const {class: rootClass, style: rootStyle, title: dropZoneTitle, ...inputAttrs} = attrs\n  const rootAttrs: Record<string, unknown> = {}\n  const dropZoneAttrs: Record<string, unknown> = {}\n  if (rootClass !== undefined) rootAttrs.class = rootClass\n  if (rootStyle !== undefined) rootAttrs.style = rootStyle\n  if (dropZoneTitle !== undefined) dropZoneAttrs.title = dropZoneTitle\n  return {\n    rootAttrs,\n    dropZoneAttrs,\n    inputAttrs,\n  }\n})\n\nconst computedId = useId(() => props.id)\nconst stateClass = useStateClass(() => props.state)\n\n// Refs\nconst rootRef = useTemplateRef('rootRef')\nconst dropZoneRef = useTemplateRef('dropZoneRef')\nconst browseButtonRef = useTemplateRef('browseButtonRef')\nconst plainInputRef = useTemplateRef<HTMLInputElement>('plainInputRef')\nconst customInputRef = useTemplateRef<HTMLInputElement>('customInputRef')\n\n// Computed accept for file type validation\nconst computedAccept = computed(() =>\n  typeof props.accept === 'string' ? props.accept : props.accept.join(',')\n)\n\n// VueUse file dialog (uses our hidden input element)\nconst {\n  open,\n  reset: resetDialog,\n  onChange: onDialogChange,\n} = useFileDialog({\n  accept: computedAccept.value,\n  multiple: props.multiple || props.directory,\n  directory: props.directory,\n  input: customInputRef as unknown as Ref<HTMLInputElement>,\n})\n\n// VueUse drop zone (replaces manual drag/drop)\n// Note: We don't pass dataTypes because the accept attribute handles validation\n// and there is no reliable way to get MIME types from in all browsers\n// https://github.com/vueuse/vueuse/issues/4523\nconst {isOverDropZone} = useDropZone(dropZoneRef, {\n  onDrop: (files) => {\n    if (files && !props.noDrop) {\n      handleFiles(files)\n    }\n  },\n  multiple: props.multiple || props.directory,\n})\n\n// Computed properties\nconst hasLabelSlot = computed(() => !isEmptySlot(slots.label))\nconst hasPlaceholderSlot = computed(() => !isEmptySlot(slots.placeholder))\n\nconst computedClasses = computed(() => [\n  stateClass.value,\n  {\n    [`form-control-${props.size}`]: props.size !== undefined,\n  },\n])\n\nconst computedPlainClasses = computed(() => [\n  'form-control',\n  stateClass.value,\n  {\n    [`form-control-${props.size}`]: props.size !== undefined,\n  },\n])\n\n// Selected files (from dialog or managed state)\nconst internalFiles = ref<readonly File[]>([])\n\nconst selectedFiles = computed<readonly File[]>(() => internalFiles.value)\n\nconst hasFiles = computed(() => selectedFiles.value.length > 0)\n\nconst fileNames = computed(() => selectedFiles.value.map((file) => file.name))\n\nconst formattedFileNames = computed(() => {\n  if (!hasFiles.value) return ''\n  if (props.fileNameFormatter) {\n    return props.fileNameFormatter(selectedFiles.value)\n  }\n  const names = fileNames.value\n  if (names.length === 1) return names[0]\n  return `${names.length} files selected`\n})\n\nconst showExternalDisplay = computed(\n  () => !props.plain && props.showFileNames && (hasFiles.value || props.placeholder)\n)\n\nconst ariaLiveMessage = useAriaLiveMessage(\n  selectedFiles,\n  computed(() => props.ariaLiveFormatter)\n)\n\nconst effectiveBrowseText = computed(() => props.browseText ?? 'Browse')\nconst effectiveDropPlaceholder = computed(() => props.dropPlaceholder ?? 'Drop files here...')\n\n// Validate file against accept criteria\nconst isFileAccepted = (file: File): boolean => {\n  if (!computedAccept.value) return true\n\n  const acceptTypes = computedAccept.value.split(',').map((type) => type.trim())\n\n  return acceptTypes.some((acceptType) => {\n    // Extension match (e.g., .pdf)\n    if (acceptType.startsWith('.')) {\n      return file.name.toLowerCase().endsWith(acceptType.toLowerCase())\n    }\n    // Exact MIME type match (e.g., image/png)\n    if (!acceptType.includes('*')) {\n      return file.type === acceptType\n    }\n    // Wildcard MIME type match (e.g., image/* or */*)\n    const slashIndex = acceptType.indexOf('/')\n    if (slashIndex === -1) {\n      // Malformed wildcard pattern (no '/'): do not match anything\n      return false\n    }\n    const category = acceptType.slice(0, slashIndex)\n    // */* should match any MIME type\n    if (category === '*') {\n      return true\n    }\n    return file.type.startsWith(`${category}/`)\n  })\n}\n\n// File handling\nconst handleFiles = (files: File[] | FileList, nativeEvent?: Event) => {\n  let fileArray: File[] = []\n\n  if (nativeEvent) {\n    // Plain mode: read from the event target (browser already filtered via accept)\n    const input = nativeEvent.target as HTMLInputElement\n    fileArray = input.files ? Array.from(input.files) : []\n  } else {\n    // Custom mode (drag & drop or file dialog): manually filter and set on hidden input\n    fileArray = Array.from(files).filter((file) => isFileAccepted(file))\n    if (customInputRef.value && typeof DataTransfer !== 'undefined') {\n      try {\n        const dataTransfer = new DataTransfer()\n        fileArray.forEach((file) => dataTransfer.items.add(file))\n        customInputRef.value.files = dataTransfer.files\n      } catch {\n        // In environments where DataTransfer is not fully supported, skip syncing files on the input\n      }\n    }\n  }\n\n  // Update internal state\n  internalFiles.value = fileArray\n\n  // Update model value\n  if (fileArray.length === 0) {\n    modelValue.value = null\n  } else if (props.directory || props.multiple) {\n    modelValue.value = fileArray\n  } else {\n    const [firstFile] = fileArray\n    if (firstFile) {\n      modelValue.value = firstFile\n    }\n  }\n\n  // Emit change event in nextTick to ensure DOM updates\n  // In plain mode: forward the native event (has target.files)\n  // In custom mode: create CustomEvent with files in detail\n  nextTick(() => {\n    if (nativeEvent) {\n      // Plain mode: forward native event\n      emit('change', nativeEvent)\n    } else {\n      // Custom mode: create CustomEvent with files\n      const changeEvent = new CustomEvent('change', {\n        bubbles: true,\n        cancelable: false,\n        detail: {\n          files: fileArray,\n          target: {files: fileArray},\n        },\n      })\n      // Also attach files directly for easier access\n      Object.defineProperty(changeEvent, 'files', {\n        value: fileArray,\n        enumerable: true,\n      })\n      emit('change', changeEvent)\n    }\n  })\n}\n\n// Open file dialog\nconst openFileDialog = () => {\n  if (!props.disabled) {\n    open({\n      accept: computedAccept.value,\n      multiple: props.multiple || props.directory,\n      directory: props.directory,\n    })\n  }\n}\n\n// Handle click on control wrapper (make entire control clickable like Bootstrap v5)\nconst handleControlClick = () => {\n  // Don't trigger if clicking the button itself (button has its own handler with .stop)\n  // Don't trigger if disabled\n  if (!props.disabled) {\n    openFileDialog()\n  }\n}\n\n// Plain mode change handler\nconst onPlainChange = (e: Event) => {\n  const input = e.target as HTMLInputElement\n  if (input.files) {\n    handleFiles(input.files, e) // Pass native event\n  }\n}\n\n// Watch dialog files from useFileDialog\nonDialogChange((files) => {\n  if (files) {\n    handleFiles(files)\n  }\n})\n\n// Reset method\nconst reset = () => {\n  internalFiles.value = []\n  modelValue.value = null\n  resetDialog() // This resets the hidden input in custom mode\n  if (plainInputRef.value) {\n    plainInputRef.value.value = ''\n  }\n}\n\n// Focus management\nconst focus = () => {\n  if (props.plain) {\n    plainInputRef.value?.focus()\n  } else {\n    browseButtonRef.value?.focus()\n  }\n}\n\nconst blur = () => {\n  if (props.plain) {\n    plainInputRef.value?.blur()\n  } else {\n    browseButtonRef.value?.blur()\n  }\n}\n\n// Autofocus support - initial focus on mount\nonMounted(() => {\n  if (props.autofocus) {\n    nextTick(() => {\n      focus()\n    })\n  }\n})\n\n// Autofocus support - runtime prop changes\nwatch(\n  () => props.autofocus,\n  (autofocus) => {\n    if (autofocus) {\n      focus()\n    }\n  }\n)\n\n// Watch modelValue changes from parent\nwatch(modelValue, (newValue) => {\n  if (newValue === null) {\n    internalFiles.value = []\n    if (plainInputRef.value) {\n      plainInputRef.value.value = ''\n    }\n  } else if (Array.isArray(newValue)) {\n    internalFiles.value = newValue as readonly File[]\n  } else {\n    internalFiles.value = [newValue] as readonly File[]\n  }\n})\n\ndefineExpose({\n  blur,\n  element: computed(() => (props.plain ? plainInputRef.value : browseButtonRef.value)),\n  focus,\n  reset,\n})\n</script>\n","<template>\n  <div ref=\"rootRef\" v-bind=\"processedAttrs.rootAttrs\" class=\"b-form-file-root\">\n    <!-- Optional label -->\n    <label\n      v-if=\"hasLabelSlot || props.label\"\n      class=\"form-label\"\n      :class=\"props.labelClass\"\n      :for=\"computedId\"\n    >\n      <slot name=\"label\">\n        {{ props.label }}\n      </slot>\n    </label>\n\n    <!-- Drop zone wrapper -->\n    <div\n      v-if=\"!props.plain\"\n      ref=\"dropZoneRef\"\n      v-bind=\"processedAttrs.dropZoneAttrs\"\n      class=\"b-form-file-wrapper\"\n      :class=\"{\n        'b-form-file-dragging': isOverDropZone && !props.noDrop,\n        'b-form-file-has-files': hasFiles,\n      }\"\n    >\n      <!-- Custom file control (mimics Bootstrap native input) -->\n      <div\n        class=\"b-form-file-control\"\n        :class=\"computedClasses\"\n        :aria-disabled=\"props.disabled\"\n        @click=\"handleControlClick\"\n      >\n        <!-- Custom browse button (now on LEFT to match Bootstrap v5) -->\n        <button\n          v-if=\"!props.noButton\"\n          :id=\"computedId\"\n          ref=\"browseButtonRef\"\n          type=\"button\"\n          class=\"b-form-file-button\"\n          :disabled=\"props.disabled\"\n          :aria-label=\"props.ariaLabel\"\n          :aria-labelledby=\"props.ariaLabelledby\"\n          @click.stop=\"openFileDialog\"\n        >\n          {{ effectiveBrowseText }}\n        </button>\n\n        <!-- File name display -->\n        <div class=\"b-form-file-text\">\n          <slot name=\"file-name\" :files=\"selectedFiles\" :names=\"fileNames\">\n            <span v-if=\"hasFiles\">{{ formattedFileNames }}</span>\n            <span v-else-if=\"hasPlaceholderSlot || props.placeholder\" class=\"text-muted\">\n              <slot name=\"placeholder\">{{ props.placeholder }}</slot>\n            </span>\n          </slot>\n        </div>\n      </div>\n\n      <!-- Drag overlay (only shown when dragging) -->\n      <div v-if=\"isOverDropZone && !props.noDrop\" class=\"b-form-file-drag-overlay\">\n        <slot name=\"drop-placeholder\">\n          <div class=\"b-form-file-drag-text\">\n            {{ effectiveDropPlaceholder }}\n          </div>\n        </slot>\n      </div>\n\n      <!-- Hidden input for form submission (positioned behind UI with z-index) -->\n      <input\n        ref=\"customInputRef\"\n        v-bind=\"processedAttrs.inputAttrs\"\n        type=\"file\"\n        :name=\"props.name\"\n        :form=\"props.form\"\n        :multiple=\"props.multiple || props.directory\"\n        :disabled=\"props.disabled\"\n        :required=\"props.required\"\n        :accept=\"computedAccept || undefined\"\n        :capture=\"props.capture\"\n        :directory=\"props.directory || undefined\"\n        :webkitdirectory=\"props.directory || undefined\"\n        tabindex=\"-1\"\n        aria-hidden=\"true\"\n        style=\"\n          position: absolute;\n          z-index: -5;\n          width: 0;\n          height: 0;\n          opacity: 0;\n          overflow: hidden;\n          pointer-events: none;\n        \"\n      />\n    </div>\n\n    <!-- Plain mode - simple native input -->\n    <input\n      v-else\n      :id=\"computedId\"\n      ref=\"plainInputRef\"\n      v-bind=\"processedAttrs.inputAttrs\"\n      type=\"file\"\n      :class=\"computedPlainClasses\"\n      :form=\"props.form\"\n      :name=\"props.name\"\n      :multiple=\"props.multiple || props.directory\"\n      :disabled=\"props.disabled\"\n      :capture=\"props.capture\"\n      :accept=\"computedAccept || undefined\"\n      :required=\"props.required || undefined\"\n      :aria-label=\"props.ariaLabel\"\n      :aria-labelledby=\"props.ariaLabelledby\"\n      :aria-required=\"props.required || undefined\"\n      :directory=\"props.directory || undefined\"\n      :webkitdirectory=\"props.directory || undefined\"\n      @change=\"onPlainChange\"\n    />\n\n    <!-- External file display (when showFileNames is true and not plain) -->\n    <div v-if=\"showExternalDisplay\" class=\"b-form-file-display mt-2\">\n      <slot name=\"file-name\" :files=\"selectedFiles\" :names=\"fileNames\">\n        <div v-if=\"hasFiles\" class=\"small text-muted\">\n          {{ formattedFileNames }}\n        </div>\n        <div v-else-if=\"hasPlaceholderSlot || props.placeholder\" class=\"small text-muted\">\n          <slot name=\"placeholder\">\n            {{ props.placeholder }}\n          </slot>\n        </div>\n      </slot>\n    </div>\n\n    <!-- ARIA live region for screen reader announcements -->\n    <div v-if=\"!props.plain\" class=\"visually-hidden\" aria-live=\"polite\" aria-atomic=\"true\">\n      {{ ariaLiveMessage }}\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport {useDropZone, useFileDialog} from '@vueuse/core'\nimport {computed, nextTick, onMounted, ref, type Ref, useAttrs, useTemplateRef, watch} from 'vue'\nimport {useDefaults} from '../../composables/useDefaults'\nimport {useId} from '../../composables/useId'\nimport {useStateClass} from '../../composables/useStateClass'\nimport {isEmptySlot} from '../../utils/dom'\nimport type {BFormFileProps, BFormFileSlots} from '../../types'\nimport {useAriaLiveMessage} from './useAriaLiveMessage'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst _props = withDefaults(defineProps<Omit<BFormFileProps, 'modelValue'>>(), {\n  ariaLabel: undefined,\n  ariaLabelledby: undefined,\n  accept: '',\n  autofocus: false,\n  browseText: undefined,\n  capture: undefined,\n  directory: false,\n  disabled: false,\n  dropPlaceholder: undefined,\n  fileNameFormatter: undefined,\n  ariaLiveFormatter: undefined,\n  form: undefined,\n  id: undefined,\n  label: '',\n  labelClass: undefined,\n  multiple: false,\n  name: undefined,\n  noButton: false,\n  noDrop: false,\n  plain: false,\n  placeholder: 'No file chosen',\n  required: false,\n  showFileNames: false,\n  size: undefined,\n  state: null,\n})\nconst props = useDefaults(_props, 'BFormFile')\nconst slots = defineSlots<BFormFileSlots>()\n\nconst emit = defineEmits<{\n  change: [value: Event]\n}>()\n\nconst modelValue = defineModel<Exclude<BFormFileProps['modelValue'], undefined>>({\n  default: null,\n})\n\nconst attrs = useAttrs()\n\nconst processedAttrs = computed(() => {\n  // In plain mode, pass all attributes to the input element\n  if (props.plain) {\n    return {\n      rootAttrs: {},\n      dropZoneAttrs: {},\n      inputAttrs: attrs,\n    }\n  }\n  // In custom mode, split attributes:\n  // - class/style go to root (for layout/positioning)\n  // - title goes to drop zone (for tooltip on interactive element)\n  // - everything else goes to hidden input (for form functionality)\n  const {class: rootClass, style: rootStyle, title: dropZoneTitle, ...inputAttrs} = attrs\n  const rootAttrs: Record<string, unknown> = {}\n  const dropZoneAttrs: Record<string, unknown> = {}\n  if (rootClass !== undefined) rootAttrs.class = rootClass\n  if (rootStyle !== undefined) rootAttrs.style = rootStyle\n  if (dropZoneTitle !== undefined) dropZoneAttrs.title = dropZoneTitle\n  return {\n    rootAttrs,\n    dropZoneAttrs,\n    inputAttrs,\n  }\n})\n\nconst computedId = useId(() => props.id)\nconst stateClass = useStateClass(() => props.state)\n\n// Refs\nconst rootRef = useTemplateRef('rootRef')\nconst dropZoneRef = useTemplateRef('dropZoneRef')\nconst browseButtonRef = useTemplateRef('browseButtonRef')\nconst plainInputRef = useTemplateRef<HTMLInputElement>('plainInputRef')\nconst customInputRef = useTemplateRef<HTMLInputElement>('customInputRef')\n\n// Computed accept for file type validation\nconst computedAccept = computed(() =>\n  typeof props.accept === 'string' ? props.accept : props.accept.join(',')\n)\n\n// VueUse file dialog (uses our hidden input element)\nconst {\n  open,\n  reset: resetDialog,\n  onChange: onDialogChange,\n} = useFileDialog({\n  accept: computedAccept.value,\n  multiple: props.multiple || props.directory,\n  directory: props.directory,\n  input: customInputRef as unknown as Ref<HTMLInputElement>,\n})\n\n// VueUse drop zone (replaces manual drag/drop)\n// Note: We don't pass dataTypes because the accept attribute handles validation\n// and there is no reliable way to get MIME types from in all browsers\n// https://github.com/vueuse/vueuse/issues/4523\nconst {isOverDropZone} = useDropZone(dropZoneRef, {\n  onDrop: (files) => {\n    if (files && !props.noDrop) {\n      handleFiles(files)\n    }\n  },\n  multiple: props.multiple || props.directory,\n})\n\n// Computed properties\nconst hasLabelSlot = computed(() => !isEmptySlot(slots.label))\nconst hasPlaceholderSlot = computed(() => !isEmptySlot(slots.placeholder))\n\nconst computedClasses = computed(() => [\n  stateClass.value,\n  {\n    [`form-control-${props.size}`]: props.size !== undefined,\n  },\n])\n\nconst computedPlainClasses = computed(() => [\n  'form-control',\n  stateClass.value,\n  {\n    [`form-control-${props.size}`]: props.size !== undefined,\n  },\n])\n\n// Selected files (from dialog or managed state)\nconst internalFiles = ref<readonly File[]>([])\n\nconst selectedFiles = computed<readonly File[]>(() => internalFiles.value)\n\nconst hasFiles = computed(() => selectedFiles.value.length > 0)\n\nconst fileNames = computed(() => selectedFiles.value.map((file) => file.name))\n\nconst formattedFileNames = computed(() => {\n  if (!hasFiles.value) return ''\n  if (props.fileNameFormatter) {\n    return props.fileNameFormatter(selectedFiles.value)\n  }\n  const names = fileNames.value\n  if (names.length === 1) return names[0]\n  return `${names.length} files selected`\n})\n\nconst showExternalDisplay = computed(\n  () => !props.plain && props.showFileNames && (hasFiles.value || props.placeholder)\n)\n\nconst ariaLiveMessage = useAriaLiveMessage(\n  selectedFiles,\n  computed(() => props.ariaLiveFormatter)\n)\n\nconst effectiveBrowseText = computed(() => props.browseText ?? 'Browse')\nconst effectiveDropPlaceholder = computed(() => props.dropPlaceholder ?? 'Drop files here...')\n\n// Validate file against accept criteria\nconst isFileAccepted = (file: File): boolean => {\n  if (!computedAccept.value) return true\n\n  const acceptTypes = computedAccept.value.split(',').map((type) => type.trim())\n\n  return acceptTypes.some((acceptType) => {\n    // Extension match (e.g., .pdf)\n    if (acceptType.startsWith('.')) {\n      return file.name.toLowerCase().endsWith(acceptType.toLowerCase())\n    }\n    // Exact MIME type match (e.g., image/png)\n    if (!acceptType.includes('*')) {\n      return file.type === acceptType\n    }\n    // Wildcard MIME type match (e.g., image/* or */*)\n    const slashIndex = acceptType.indexOf('/')\n    if (slashIndex === -1) {\n      // Malformed wildcard pattern (no '/'): do not match anything\n      return false\n    }\n    const category = acceptType.slice(0, slashIndex)\n    // */* should match any MIME type\n    if (category === '*') {\n      return true\n    }\n    return file.type.startsWith(`${category}/`)\n  })\n}\n\n// File handling\nconst handleFiles = (files: File[] | FileList, nativeEvent?: Event) => {\n  let fileArray: File[] = []\n\n  if (nativeEvent) {\n    // Plain mode: read from the event target (browser already filtered via accept)\n    const input = nativeEvent.target as HTMLInputElement\n    fileArray = input.files ? Array.from(input.files) : []\n  } else {\n    // Custom mode (drag & drop or file dialog): manually filter and set on hidden input\n    fileArray = Array.from(files).filter((file) => isFileAccepted(file))\n    if (customInputRef.value && typeof DataTransfer !== 'undefined') {\n      try {\n        const dataTransfer = new DataTransfer()\n        fileArray.forEach((file) => dataTransfer.items.add(file))\n        customInputRef.value.files = dataTransfer.files\n      } catch {\n        // In environments where DataTransfer is not fully supported, skip syncing files on the input\n      }\n    }\n  }\n\n  // Update internal state\n  internalFiles.value = fileArray\n\n  // Update model value\n  if (fileArray.length === 0) {\n    modelValue.value = null\n  } else if (props.directory || props.multiple) {\n    modelValue.value = fileArray\n  } else {\n    const [firstFile] = fileArray\n    if (firstFile) {\n      modelValue.value = firstFile\n    }\n  }\n\n  // Emit change event in nextTick to ensure DOM updates\n  // In plain mode: forward the native event (has target.files)\n  // In custom mode: create CustomEvent with files in detail\n  nextTick(() => {\n    if (nativeEvent) {\n      // Plain mode: forward native event\n      emit('change', nativeEvent)\n    } else {\n      // Custom mode: create CustomEvent with files\n      const changeEvent = new CustomEvent('change', {\n        bubbles: true,\n        cancelable: false,\n        detail: {\n          files: fileArray,\n          target: {files: fileArray},\n        },\n      })\n      // Also attach files directly for easier access\n      Object.defineProperty(changeEvent, 'files', {\n        value: fileArray,\n        enumerable: true,\n      })\n      emit('change', changeEvent)\n    }\n  })\n}\n\n// Open file dialog\nconst openFileDialog = () => {\n  if (!props.disabled) {\n    open({\n      accept: computedAccept.value,\n      multiple: props.multiple || props.directory,\n      directory: props.directory,\n    })\n  }\n}\n\n// Handle click on control wrapper (make entire control clickable like Bootstrap v5)\nconst handleControlClick = () => {\n  // Don't trigger if clicking the button itself (button has its own handler with .stop)\n  // Don't trigger if disabled\n  if (!props.disabled) {\n    openFileDialog()\n  }\n}\n\n// Plain mode change handler\nconst onPlainChange = (e: Event) => {\n  const input = e.target as HTMLInputElement\n  if (input.files) {\n    handleFiles(input.files, e) // Pass native event\n  }\n}\n\n// Watch dialog files from useFileDialog\nonDialogChange((files) => {\n  if (files) {\n    handleFiles(files)\n  }\n})\n\n// Reset method\nconst reset = () => {\n  internalFiles.value = []\n  modelValue.value = null\n  resetDialog() // This resets the hidden input in custom mode\n  if (plainInputRef.value) {\n    plainInputRef.value.value = ''\n  }\n}\n\n// Focus management\nconst focus = () => {\n  if (props.plain) {\n    plainInputRef.value?.focus()\n  } else {\n    browseButtonRef.value?.focus()\n  }\n}\n\nconst blur = () => {\n  if (props.plain) {\n    plainInputRef.value?.blur()\n  } else {\n    browseButtonRef.value?.blur()\n  }\n}\n\n// Autofocus support - initial focus on mount\nonMounted(() => {\n  if (props.autofocus) {\n    nextTick(() => {\n      focus()\n    })\n  }\n})\n\n// Autofocus support - runtime prop changes\nwatch(\n  () => props.autofocus,\n  (autofocus) => {\n    if (autofocus) {\n      focus()\n    }\n  }\n)\n\n// Watch modelValue changes from parent\nwatch(modelValue, (newValue) => {\n  if (newValue === null) {\n    internalFiles.value = []\n    if (plainInputRef.value) {\n      plainInputRef.value.value = ''\n    }\n  } else if (Array.isArray(newValue)) {\n    internalFiles.value = newValue as readonly File[]\n  } else {\n    internalFiles.value = [newValue] as readonly File[]\n  }\n})\n\ndefineExpose({\n  blur,\n  element: computed(() => (props.plain ? plainInputRef.value : browseButtonRef.value)),\n  focus,\n  reset,\n})\n</script>\n"],"mappings":"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"}

package/dist/{BFormOtp-C3vmDnzs.js → BFormOtp-ClDACqXM.js}

@@ -493,7 +493,7 @@ var BFormOtp_default = /* @__PURE__ */ defineComponent({
 		const props = useDefaults(__props, "BFormOtp");
 		const emit = __emit;
 		const modelValue = useModel(__props, "modelValue");
-		const computedId = useId$1(() => props.id);
+		const computedId = useId$1(() => props.id, "form-otp");
 		const lengthNumber = useToNumber(() => props.length, {
 			nanToZero: true,
 			method: "parseInt"
@@ -574,4 +574,4 @@ var BFormOtp_default = /* @__PURE__ */ defineComponent({
 //#endregion
 export { BFormOtp_default as t };
 
-//# sourceMappingURL=BFormOtp-C3vmDnzs.js.map
+//# sourceMappingURL=BFormOtp-ClDACqXM.js.map

package/dist/{BFormOtp-C3vmDnzs.js.map → BFormOtp-ClDACqXM.js.map}

@@ -1 +1 @@
-{"version":3,"file":"BFormOtp-C3vmDnzs.js","names":[],"sources":["../../../node_modules/.pnpm/reka-ui@2.10.3_vue@3.5.41_typescript@5.9.3_/node_modules/reka-ui/dist/shared/useArrowNavigation.js","../../../node_modules/.pnpm/reka-ui@2.10.3_vue@3.5.41_typescript@5.9.3_/node_modules/reka-ui/dist/PinInput/PinInputRoot.js","../../../node_modules/.pnpm/reka-ui@2.10.3_vue@3.5.41_typescript@5.9.3_/node_modules/reka-ui/dist/PinInput/PinInputInput.js","../src/components/BFormOtp/BFormOtp.vue","../src/components/BFormOtp/BFormOtp.vue"],"sourcesContent":["//#region src/shared/useArrowNavigation.ts\nconst ignoredElement = [\"INPUT\", \"TEXTAREA\"];\n/**\n* Allow arrow navigation for every html element with data-reka-collection-item tag\n*\n* @param e               Keyboard event\n* @param currentElement  Event initiator element or any element that wants to handle the navigation\n* @param parentElement   Parent element where contains all the collection items, this will collect every item to be used when nav\n* @param options         further options\n* @returns               the navigated html element or null if none\n*/\nfunction useArrowNavigation(e, currentElement, parentElement, options = {}) {\n\tif (!currentElement || options.enableIgnoredElement && ignoredElement.includes(currentElement.nodeName)) return null;\n\tconst { arrowKeyOptions = \"both\", attributeName = \"[data-reka-collection-item]\", itemsArray = [], loop = true, dir = \"ltr\", preventScroll = true, focus = false } = options;\n\tconst [right, left, up, down, home, end] = [\n\t\te.key === \"ArrowRight\",\n\t\te.key === \"ArrowLeft\",\n\t\te.key === \"ArrowUp\",\n\t\te.key === \"ArrowDown\",\n\t\te.key === \"Home\",\n\t\te.key === \"End\"\n\t];\n\tconst goingVertical = up || down;\n\tconst goingHorizontal = right || left;\n\tif (!home && !end && (!goingVertical && !goingHorizontal || arrowKeyOptions === \"vertical\" && goingHorizontal || arrowKeyOptions === \"horizontal\" && goingVertical)) return null;\n\tconst allCollectionItems = parentElement ? Array.from(parentElement.querySelectorAll(attributeName)) : itemsArray;\n\tif (!allCollectionItems.length) return null;\n\tif (preventScroll) e.preventDefault();\n\tlet item = null;\n\tif (goingHorizontal || goingVertical) {\n\t\tconst goForward = goingVertical ? down : dir === \"ltr\" ? right : left;\n\t\titem = findNextFocusableElement(allCollectionItems, currentElement, {\n\t\t\tgoForward,\n\t\t\tloop\n\t\t});\n\t} else if (home) item = allCollectionItems.at(0) || null;\n\telse if (end) item = allCollectionItems.at(-1) || null;\n\tif (focus) item?.focus();\n\treturn item;\n}\n/**\n* Recursive function to find the next focusable element to avoid disabled elements\n*\n* @param elements Elements to navigate\n* @param currentElement Current active element\n* @param options\n* @returns next focusable element\n*/\nfunction findNextFocusableElement(elements, currentElement, options, iterations = !elements.includes(currentElement) ? elements.length + 1 : elements.length) {\n\tif (--iterations === 0) return null;\n\tconst index = elements.indexOf(currentElement);\n\tlet newIndex;\n\tif (index === -1) newIndex = options.goForward ? 0 : elements.length - 1;\n\telse newIndex = options.goForward ? index + 1 : index - 1;\n\tif (!options.loop && (newIndex < 0 || newIndex >= elements.length)) return null;\n\tconst adjustedNewIndex = (newIndex + elements.length) % elements.length;\n\tconst candidate = elements[adjustedNewIndex];\n\tif (!candidate) return null;\n\tconst isDisabled = candidate.hasAttribute(\"disabled\") && candidate.getAttribute(\"disabled\") !== \"false\";\n\tif (isDisabled) return findNextFocusableElement(elements, candidate, options, iterations);\n\treturn candidate;\n}\n\n//#endregion\nexport { useArrowNavigation };\n//# sourceMappingURL=useArrowNavigation.js.map","import { createContext } from \"../shared/createContext.js\";\nimport { useDirection } from \"../shared/useDirection.js\";\nimport { useForwardExpose } from \"../shared/useForwardExpose.js\";\nimport { Primitive } from \"../Primitive/Primitive.js\";\nimport { VisuallyHiddenInput_default } from \"../VisuallyHidden/VisuallyHiddenInput.js\";\nimport { computed, createBlock, createVNode, defineComponent, mergeProps, openBlock, ref, renderSlot, toRefs, unref, watch, withCtx } from \"vue\";\nimport { useVModel } from \"@vueuse/core\";\n\n//#region src/PinInput/PinInputRoot.vue?vue&type=script&setup=true&lang.ts\nconst [injectPinInputRootContext, providePinInputRootContext] = /*#__PURE__*/ createContext(\"PinInputRoot\");\nvar PinInputRoot_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({\n\tinheritAttrs: false,\n\t__name: \"PinInputRoot\",\n\tprops: {\n\t\tmodelValue: {\n\t\t\ttype: null,\n\t\t\trequired: false\n\t\t},\n\t\tdefaultValue: {\n\t\t\ttype: null,\n\t\t\trequired: false\n\t\t},\n\t\tplaceholder: {\n\t\t\ttype: String,\n\t\t\trequired: false,\n\t\t\tdefault: \"\"\n\t\t},\n\t\tmask: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\totp: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\ttype: {\n\t\t\ttype: null,\n\t\t\trequired: false,\n\t\t\tdefault: \"text\"\n\t\t},\n\t\tdir: {\n\t\t\ttype: String,\n\t\t\trequired: false\n\t\t},\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\tid: {\n\t\t\ttype: String,\n\t\t\trequired: false\n\t\t},\n\t\tasChild: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\tas: {\n\t\t\ttype: null,\n\t\t\trequired: false\n\t\t},\n\t\tname: {\n\t\t\ttype: String,\n\t\t\trequired: false\n\t\t},\n\t\trequired: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t}\n\t},\n\temits: [\"update:modelValue\", \"complete\"],\n\tsetup(__props, { emit: __emit }) {\n\t\tconst props = __props;\n\t\tconst emits = __emit;\n\t\tconst { mask, otp, placeholder, type, disabled, dir: propDir } = toRefs(props);\n\t\tconst { forwardRef } = useForwardExpose();\n\t\tconst dir = useDirection(propDir);\n\t\tconst modelValue = useVModel(props, \"modelValue\", emits, {\n\t\t\tdefaultValue: props.defaultValue ?? [],\n\t\t\tpassive: true,\n\t\t\tdeep: true\n\t\t});\n\t\tconst currentModelValue = computed(() => Array.isArray(modelValue.value) ? [...modelValue.value] : []);\n\t\tconst inputElements = ref(/* @__PURE__ */ new Set());\n\t\tfunction onInputElementChange(el) {\n\t\t\tinputElements.value.add(el);\n\t\t}\n\t\tconst isNumericMode = computed(() => props.type === \"number\");\n\t\tconst isCompleted = computed(() => {\n\t\t\tconst modelValues = currentModelValue.value.filter((i) => !!i || isNumericMode.value && i === 0);\n\t\t\treturn modelValues.length === inputElements.value.size;\n\t\t});\n\t\twatch(modelValue, () => {\n\t\t\tif (isCompleted.value) emits(\"complete\", modelValue.value);\n\t\t}, { deep: true });\n\t\tprovidePinInputRootContext({\n\t\t\tmodelValue,\n\t\t\tcurrentModelValue,\n\t\t\tmask,\n\t\t\totp,\n\t\t\tplaceholder,\n\t\t\ttype,\n\t\t\tdir,\n\t\t\tdisabled,\n\t\t\tisCompleted,\n\t\t\tinputElements,\n\t\t\tonInputElementChange,\n\t\t\tisNumericMode\n\t\t});\n\t\treturn (_ctx, _cache) => {\n\t\t\treturn openBlock(), createBlock(unref(Primitive), mergeProps(_ctx.$attrs, {\n\t\t\t\tref: unref(forwardRef),\n\t\t\t\tdir: unref(dir),\n\t\t\t\t\"data-complete\": isCompleted.value ? \"\" : void 0,\n\t\t\t\t\"data-disabled\": unref(disabled) ? \"\" : void 0\n\t\t\t}), {\n\t\t\t\tdefault: withCtx(() => [renderSlot(_ctx.$slots, \"default\", { modelValue: unref(modelValue) }), createVNode(VisuallyHiddenInput_default, {\n\t\t\t\t\tid: _ctx.id,\n\t\t\t\t\tas: \"input\",\n\t\t\t\t\tfeature: \"focusable\",\n\t\t\t\t\ttabindex: \"-1\",\n\t\t\t\t\tvalue: currentModelValue.value.join(\"\"),\n\t\t\t\t\tname: _ctx.name ?? \"\",\n\t\t\t\t\tdisabled: unref(disabled),\n\t\t\t\t\trequired: _ctx.required,\n\t\t\t\t\tonFocus: _cache[0] || (_cache[0] = ($event) => Array.from(inputElements.value)?.[0]?.focus())\n\t\t\t\t}, null, 8, [\n\t\t\t\t\t\"id\",\n\t\t\t\t\t\"value\",\n\t\t\t\t\t\"name\",\n\t\t\t\t\t\"disabled\",\n\t\t\t\t\t\"required\"\n\t\t\t\t])]),\n\t\t\t\t_: 3\n\t\t\t}, 16, [\n\t\t\t\t\"dir\",\n\t\t\t\t\"data-complete\",\n\t\t\t\t\"data-disabled\"\n\t\t\t]);\n\t\t};\n\t}\n});\n\n//#endregion\n//#region src/PinInput/PinInputRoot.vue\nvar PinInputRoot_default = PinInputRoot_vue_vue_type_script_setup_true_lang_default;\n\n//#endregion\nexport { PinInputRoot_default, injectPinInputRootContext };\n//# sourceMappingURL=PinInputRoot.js.map","import { getActiveElement } from \"../shared/getActiveElement.js\";\nimport { useArrowNavigation } from \"../shared/useArrowNavigation.js\";\nimport { useComposing } from \"../shared/useComposing.js\";\nimport { Primitive } from \"../Primitive/Primitive.js\";\nimport { usePrimitiveElement } from \"../Primitive/usePrimitiveElement.js\";\nimport { injectPinInputRootContext } from \"./PinInputRoot.js\";\nimport { computed, createBlock, defineComponent, nextTick, onMounted, onUnmounted, openBlock, renderSlot, unref, watch, withCtx, withKeys } from \"vue\";\n\n//#region src/PinInput/PinInputInput.vue?vue&type=script&setup=true&lang.ts\nvar PinInputInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({\n\t__name: \"PinInputInput\",\n\tprops: {\n\t\tindex: {\n\t\t\ttype: Number,\n\t\t\trequired: true\n\t\t},\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\tasChild: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\tas: {\n\t\t\ttype: null,\n\t\t\trequired: false,\n\t\t\tdefault: \"input\"\n\t\t}\n\t},\n\tsetup(__props) {\n\t\tconst props = __props;\n\t\tconst context = injectPinInputRootContext();\n\t\tconst inputElements = computed(() => [...context.inputElements.value]);\n\t\tconst currentValue = computed(() => context.currentModelValue.value[props.index]);\n\t\tconst disabled = computed(() => props.disabled || context.disabled.value);\n\t\tconst isOtpMode = computed(() => context.otp.value);\n\t\tconst isPasswordMode = computed(() => context.mask.value);\n\t\tconst NUMBER_REG = /^\\d*$/;\n\t\tconst NON_NUMBER_REG = /\\D/g;\n\t\tconst { primitiveElement, currentElement } = usePrimitiveElement();\n\t\tconst { isComposing, handleCompositionStart, handleCompositionEnd } = useComposing((event) => {\n\t\t\tconst target = event.target;\n\t\t\tconst value = event.data || target.value;\n\t\t\tif (context.isNumericMode.value) {\n\t\t\t\tconst filtered = value.replace(NON_NUMBER_REG, \"\");\n\t\t\t\tif (!filtered) {\n\t\t\t\t\ttarget.value = \"\";\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tif (filtered.length > 1) {\n\t\t\t\t\thandleMultipleCharacter(filtered);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\ttarget.value = filtered;\n\t\t\t\tupdateModelValueAt(props.index, filtered);\n\t\t\t\tconst nextEl$1 = inputElements.value[props.index + 1];\n\t\t\t\tif (nextEl$1) nextEl$1.focus();\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (value.length > 1) {\n\t\t\t\thandleMultipleCharacter(value);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\ttarget.value = value;\n\t\t\tupdateModelValueAt(props.index, value);\n\t\t\tconst nextEl = inputElements.value[props.index + 1];\n\t\t\tif (nextEl) nextEl.focus();\n\t\t});\n\t\tfunction handleInput(event) {\n\t\t\tif (isComposing.value || event.isComposing) return;\n\t\t\tconst target = event.target;\n\t\t\tif ((event.data?.length ?? 0) > 1) {\n\t\t\t\thandleMultipleCharacter(target.value);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (context.isNumericMode.value && !NUMBER_REG.test(target.value)) {\n\t\t\t\ttarget.value = target.value.replace(NON_NUMBER_REG, \"\");\n\t\t\t\treturn;\n\t\t\t}\n\t\t\ttarget.value = event.data || target.value.slice(-1);\n\t\t\tupdateModelValueAt(props.index, target.value);\n\t\t\tconst nextEl = inputElements.value[props.index + 1];\n\t\t\tif (nextEl) nextEl.focus();\n\t\t}\n\t\tfunction updatePlaceholder() {\n\t\t\tnextTick(() => {\n\t\t\t\tconst target = currentElement.value;\n\t\t\t\tif (!target) return;\n\t\t\t\tif (!target.value && target === getActiveElement()) target.placeholder = \"\";\n\t\t\t\telse target.placeholder = context.placeholder.value;\n\t\t\t});\n\t\t}\n\t\tfunction handleKeydown(event) {\n\t\t\tif (isComposing.value || event.isComposing) return;\n\t\t\tuseArrowNavigation(event, getActiveElement(), void 0, {\n\t\t\t\titemsArray: inputElements.value,\n\t\t\t\tfocus: true,\n\t\t\t\tloop: false,\n\t\t\t\tarrowKeyOptions: \"horizontal\",\n\t\t\t\tdir: context.dir.value\n\t\t\t});\n\t\t}\n\t\tfunction handleBackspace(event) {\n\t\t\tevent.preventDefault();\n\t\t\tconst target = event.target;\n\t\t\tconst value = target.value;\n\t\t\tif (value) updateModelValueAt(props.index, \"\");\n\t\t\telse {\n\t\t\t\tconst prevEl = inputElements.value[props.index - 1];\n\t\t\t\tif (prevEl) {\n\t\t\t\t\tprevEl.focus();\n\t\t\t\t\tupdateModelValueAt(props.index - 1, \"\");\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tfunction handleDelete(event) {\n\t\t\tif (event.key === \"Delete\") {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tupdateModelValueAt(props.index, \"\");\n\t\t\t}\n\t\t}\n\t\tfunction handleFocus(event) {\n\t\t\tif (context.otp.value) {\n\t\t\t\tconst firstEmptyInputIdx = inputElements.value.findIndex((_, idx) => context.currentModelValue.value[idx] === \"\" || context.currentModelValue.value[idx] === void 0);\n\t\t\t\tif (firstEmptyInputIdx !== -1 && firstEmptyInputIdx < props.index) {\n\t\t\t\t\tinputElements.value[firstEmptyInputIdx].focus();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t}\n\t\t\tconst target = event.target;\n\t\t\ttarget.setSelectionRange(1, 1);\n\t\t\tupdatePlaceholder();\n\t\t}\n\t\tfunction handleBlur(event) {\n\t\t\tupdatePlaceholder();\n\t\t}\n\t\tfunction handlePaste(event) {\n\t\t\tevent.preventDefault();\n\t\t\tconst clipboardData = event.clipboardData;\n\t\t\tif (!clipboardData) return;\n\t\t\tconst rawValues = clipboardData.getData(\"text\");\n\t\t\tconst values = context.isNumericMode.value ? rawValues.replace(NON_NUMBER_REG, \"\") : rawValues;\n\t\t\thandleMultipleCharacter(values);\n\t\t}\n\t\tfunction handleMultipleCharacter(values) {\n\t\t\tconst tempModelValue = [...context.currentModelValue.value];\n\t\t\tconst initialIndex = values.length >= inputElements.value.length ? 0 : props.index;\n\t\t\tconst lastIndex = Math.min(initialIndex + values.length, inputElements.value.length);\n\t\t\tfor (let i = initialIndex; i < lastIndex; i++) {\n\t\t\t\tconst input = inputElements.value[i];\n\t\t\t\tconst value = values[i - initialIndex];\n\t\t\t\tif (context.isNumericMode.value) {\n\t\t\t\t\tconst num = Number.parseInt(value);\n\t\t\t\t\tif (Number.isNaN(num)) continue;\n\t\t\t\t\ttempModelValue[i] = num;\n\t\t\t\t} else tempModelValue[i] = value;\n\t\t\t\tinput.focus();\n\t\t\t}\n\t\t\tcontext.modelValue.value = tempModelValue;\n\t\t\tinputElements.value[lastIndex]?.focus();\n\t\t}\n\t\tfunction removeTrailingEmptyStrings(input) {\n\t\t\tlet i = input.length - 1;\n\t\t\twhile (i >= 0 && input[i] === \"\") {\n\t\t\t\tinput.pop();\n\t\t\t\ti--;\n\t\t\t}\n\t\t\treturn input;\n\t\t}\n\t\tfunction updateModelValueAt(index, value) {\n\t\t\tconst tempModelValue = [...context.currentModelValue.value];\n\t\t\tif (context.isNumericMode.value) {\n\t\t\t\tconst num = +value;\n\t\t\t\tif (value === \"\" || isNaN(num)) delete tempModelValue[index];\n\t\t\t\telse tempModelValue[index] = num;\n\t\t\t} else tempModelValue[index] = value;\n\t\t\tcontext.modelValue.value = removeTrailingEmptyStrings(tempModelValue);\n\t\t}\n\t\twatch(currentValue, updatePlaceholder);\n\t\tonMounted(() => {\n\t\t\tcontext.onInputElementChange(currentElement.value);\n\t\t});\n\t\tonUnmounted(() => {\n\t\t\tcontext.inputElements?.value.delete(currentElement.value);\n\t\t});\n\t\treturn (_ctx, _cache) => {\n\t\t\treturn openBlock(), createBlock(unref(Primitive), {\n\t\t\t\tref_key: \"primitiveElement\",\n\t\t\t\tref: primitiveElement,\n\t\t\t\tautocapitalize: \"none\",\n\t\t\t\tas: _ctx.as,\n\t\t\t\t\"as-child\": _ctx.asChild,\n\t\t\t\tautocomplete: isOtpMode.value ? \"one-time-code\" : \"false\",\n\t\t\t\ttype: isPasswordMode.value ? \"password\" : \"text\",\n\t\t\t\tinputmode: unref(context).isNumericMode.value ? \"numeric\" : \"text\",\n\t\t\t\tpattern: unref(context).isNumericMode.value ? \"[0-9]*\" : void 0,\n\t\t\t\tplaceholder: unref(context).placeholder.value,\n\t\t\t\tvalue: currentValue.value,\n\t\t\t\tdisabled: disabled.value,\n\t\t\t\t\"data-disabled\": disabled.value ? \"\" : void 0,\n\t\t\t\t\"data-complete\": unref(context).isCompleted.value ? \"\" : void 0,\n\t\t\t\t\"aria-label\": `pin input ${_ctx.index + 1} of ${inputElements.value.length}`,\n\t\t\t\tonInput: _cache[0] || (_cache[0] = ($event) => handleInput($event)),\n\t\t\t\tonKeydown: [\n\t\t\t\t\twithKeys(handleKeydown, [\n\t\t\t\t\t\t\"left\",\n\t\t\t\t\t\t\"right\",\n\t\t\t\t\t\t\"up\",\n\t\t\t\t\t\t\"down\",\n\t\t\t\t\t\t\"home\",\n\t\t\t\t\t\t\"end\"\n\t\t\t\t\t]),\n\t\t\t\t\twithKeys(handleBackspace, [\"backspace\"]),\n\t\t\t\t\twithKeys(handleDelete, [\"delete\"])\n\t\t\t\t],\n\t\t\t\tonFocus: handleFocus,\n\t\t\t\tonBlur: handleBlur,\n\t\t\t\tonPaste: handlePaste,\n\t\t\t\tonCompositionstart: unref(handleCompositionStart),\n\t\t\t\tonCompositionend: unref(handleCompositionEnd)\n\t\t\t}, {\n\t\t\t\tdefault: withCtx(() => [renderSlot(_ctx.$slots, \"default\")]),\n\t\t\t\t_: 3\n\t\t\t}, 8, [\n\t\t\t\t\"as\",\n\t\t\t\t\"as-child\",\n\t\t\t\t\"autocomplete\",\n\t\t\t\t\"type\",\n\t\t\t\t\"inputmode\",\n\t\t\t\t\"pattern\",\n\t\t\t\t\"placeholder\",\n\t\t\t\t\"value\",\n\t\t\t\t\"disabled\",\n\t\t\t\t\"data-disabled\",\n\t\t\t\t\"data-complete\",\n\t\t\t\t\"aria-label\",\n\t\t\t\t\"onCompositionstart\",\n\t\t\t\t\"onCompositionend\"\n\t\t\t]);\n\t\t};\n\t}\n});\n\n//#endregion\n//#region src/PinInput/PinInputInput.vue\nvar PinInputInput_default = PinInputInput_vue_vue_type_script_setup_true_lang_default;\n\n//#endregion\nexport { PinInputInput_default };\n//# sourceMappingURL=PinInputInput.js.map","<template>\n  <PinInputRoot\n    :id=\"computedId\"\n    v-model=\"modelValue\"\n    :class=\"rootClasses\"\n    :disabled=\"props.disabled\"\n    :dir=\"props.dir\"\n    :mask=\"props.mask\"\n    :name=\"props.name\"\n    :otp=\"props.otp\"\n    :placeholder=\"props.placeholder\"\n    :required=\"props.required\"\n    :type=\"props.type\"\n    @complete=\"emit('complete', $event)\"\n  >\n    <PinInputInput\n      v-for=\"(_, i) in computedLength\"\n      :key=\"i\"\n      :index=\"i\"\n      :disabled=\"props.disabled\"\n      as-child\n    >\n      <BFormInput\n        class=\"b-form-otp-field\"\n        :aria-label=\"`${props.ariaLabel || 'Pin'} ${i + 1} of ${computedLength}`\"\n        :aria-invalid=\"props.ariaInvalid\"\n        :autofocus=\"props.autofocus && i === 0\"\n        :disabled=\"props.disabled\"\n        :form=\"props.form\"\n        :plaintext=\"props.plaintext\"\n        :readonly=\"props.readonly\"\n        :size=\"props.size\"\n        :state=\"props.state\"\n      />\n    </PinInputInput>\n  </PinInputRoot>\n</template>\n\n<script setup lang=\"ts\">\nimport {computed} from 'vue'\nimport {useToNumber} from '@vueuse/core'\nimport {PinInputInput, PinInputRoot} from 'reka-ui'\nimport type {BFormOtpProps} from '../../types'\nimport {useDefaults} from '../../composables/useDefaults'\nimport {useId} from '../../composables/useId'\nimport BFormInput from '../BFormInput/BFormInput.vue'\n\nconst lengthDefault = 6\nconst _props = withDefaults(defineProps<Omit<BFormOtpProps, 'modelValue'>>(), {\n  ariaInvalid: undefined,\n  ariaLabel: undefined,\n  autofocus: false,\n  dir: undefined,\n  disabled: false,\n  form: undefined,\n  id: undefined,\n  length: lengthDefault,\n  mask: false,\n  name: undefined,\n  otp: false,\n  placeholder: '',\n  plaintext: false,\n  readonly: false,\n  required: false,\n  size: undefined,\n  state: null,\n  type: 'text',\n})\nconst props = useDefaults(_props, 'BFormOtp')\nconst emit = defineEmits<{\n  complete: [value: string[]]\n}>()\n\nconst modelValue = defineModel<BFormOtpProps['modelValue']>({default: () => []})\n\nconst computedId = useId(() => props.id)\nconst lengthNumber = useToNumber(() => props.length, {nanToZero: true, method: 'parseInt'})\nconst computedLength = computed(() => (lengthNumber.value > 0 ? lengthNumber.value : lengthDefault))\n\nconst rootClasses = computed(() => [\n  'b-form-otp',\n  'd-flex',\n  'gap-2',\n  'align-items-center',\n  {\n    [`b-form-otp-${props.size}`]: !!props.size,\n  },\n])\n</script>\n","<template>\n  <PinInputRoot\n    :id=\"computedId\"\n    v-model=\"modelValue\"\n    :class=\"rootClasses\"\n    :disabled=\"props.disabled\"\n    :dir=\"props.dir\"\n    :mask=\"props.mask\"\n    :name=\"props.name\"\n    :otp=\"props.otp\"\n    :placeholder=\"props.placeholder\"\n    :required=\"props.required\"\n    :type=\"props.type\"\n    @complete=\"emit('complete', $event)\"\n  >\n    <PinInputInput\n      v-for=\"(_, i) in computedLength\"\n      :key=\"i\"\n      :index=\"i\"\n      :disabled=\"props.disabled\"\n      as-child\n    >\n      <BFormInput\n        class=\"b-form-otp-field\"\n        :aria-label=\"`${props.ariaLabel || 'Pin'} ${i + 1} of ${computedLength}`\"\n        :aria-invalid=\"props.ariaInvalid\"\n        :autofocus=\"props.autofocus && i === 0\"\n        :disabled=\"props.disabled\"\n        :form=\"props.form\"\n        :plaintext=\"props.plaintext\"\n        :readonly=\"props.readonly\"\n        :size=\"props.size\"\n        :state=\"props.state\"\n      />\n    </PinInputInput>\n  </PinInputRoot>\n</template>\n\n<script setup lang=\"ts\">\nimport {computed} from 'vue'\nimport {useToNumber} from '@vueuse/core'\nimport {PinInputInput, PinInputRoot} from 'reka-ui'\nimport type {BFormOtpProps} from '../../types'\nimport {useDefaults} from '../../composables/useDefaults'\nimport {useId} from '../../composables/useId'\nimport BFormInput from '../BFormInput/BFormInput.vue'\n\nconst lengthDefault = 6\nconst _props = withDefaults(defineProps<Omit<BFormOtpProps, 'modelValue'>>(), {\n  ariaInvalid: undefined,\n  ariaLabel: undefined,\n  autofocus: false,\n  dir: undefined,\n  disabled: false,\n  form: undefined,\n  id: undefined,\n  length: lengthDefault,\n  mask: false,\n  name: undefined,\n  otp: false,\n  placeholder: '',\n  plaintext: false,\n  readonly: false,\n  required: false,\n  size: undefined,\n  state: null,\n  type: 'text',\n})\nconst props = useDefaults(_props, 'BFormOtp')\nconst emit = defineEmits<{\n  complete: [value: string[]]\n}>()\n\nconst modelValue = defineModel<BFormOtpProps['modelValue']>({default: () => []})\n\nconst computedId = useId(() => props.id)\nconst lengthNumber = useToNumber(() => props.length, {nanToZero: true, method: 'parseInt'})\nconst computedLength = computed(() => (lengthNumber.value > 0 ? lengthNumber.value : lengthDefault))\n\nconst rootClasses = computed(() => [\n  'b-form-otp',\n  'd-flex',\n  'gap-2',\n  'align-items-center',\n  {\n    [`b-form-otp-${props.size}`]: !!props.size,\n  },\n])\n</script>\n"],"x_google_ignoreList":[0,1,2],"mappings":"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"}
+{"version":3,"file":"BFormOtp-ClDACqXM.js","names":[],"sources":["../../../node_modules/.pnpm/reka-ui@2.10.3_vue@3.5.41_typescript@5.9.3_/node_modules/reka-ui/dist/shared/useArrowNavigation.js","../../../node_modules/.pnpm/reka-ui@2.10.3_vue@3.5.41_typescript@5.9.3_/node_modules/reka-ui/dist/PinInput/PinInputRoot.js","../../../node_modules/.pnpm/reka-ui@2.10.3_vue@3.5.41_typescript@5.9.3_/node_modules/reka-ui/dist/PinInput/PinInputInput.js","../src/components/BFormOtp/BFormOtp.vue","../src/components/BFormOtp/BFormOtp.vue"],"sourcesContent":["//#region src/shared/useArrowNavigation.ts\nconst ignoredElement = [\"INPUT\", \"TEXTAREA\"];\n/**\n* Allow arrow navigation for every html element with data-reka-collection-item tag\n*\n* @param e               Keyboard event\n* @param currentElement  Event initiator element or any element that wants to handle the navigation\n* @param parentElement   Parent element where contains all the collection items, this will collect every item to be used when nav\n* @param options         further options\n* @returns               the navigated html element or null if none\n*/\nfunction useArrowNavigation(e, currentElement, parentElement, options = {}) {\n\tif (!currentElement || options.enableIgnoredElement && ignoredElement.includes(currentElement.nodeName)) return null;\n\tconst { arrowKeyOptions = \"both\", attributeName = \"[data-reka-collection-item]\", itemsArray = [], loop = true, dir = \"ltr\", preventScroll = true, focus = false } = options;\n\tconst [right, left, up, down, home, end] = [\n\t\te.key === \"ArrowRight\",\n\t\te.key === \"ArrowLeft\",\n\t\te.key === \"ArrowUp\",\n\t\te.key === \"ArrowDown\",\n\t\te.key === \"Home\",\n\t\te.key === \"End\"\n\t];\n\tconst goingVertical = up || down;\n\tconst goingHorizontal = right || left;\n\tif (!home && !end && (!goingVertical && !goingHorizontal || arrowKeyOptions === \"vertical\" && goingHorizontal || arrowKeyOptions === \"horizontal\" && goingVertical)) return null;\n\tconst allCollectionItems = parentElement ? Array.from(parentElement.querySelectorAll(attributeName)) : itemsArray;\n\tif (!allCollectionItems.length) return null;\n\tif (preventScroll) e.preventDefault();\n\tlet item = null;\n\tif (goingHorizontal || goingVertical) {\n\t\tconst goForward = goingVertical ? down : dir === \"ltr\" ? right : left;\n\t\titem = findNextFocusableElement(allCollectionItems, currentElement, {\n\t\t\tgoForward,\n\t\t\tloop\n\t\t});\n\t} else if (home) item = allCollectionItems.at(0) || null;\n\telse if (end) item = allCollectionItems.at(-1) || null;\n\tif (focus) item?.focus();\n\treturn item;\n}\n/**\n* Recursive function to find the next focusable element to avoid disabled elements\n*\n* @param elements Elements to navigate\n* @param currentElement Current active element\n* @param options\n* @returns next focusable element\n*/\nfunction findNextFocusableElement(elements, currentElement, options, iterations = !elements.includes(currentElement) ? elements.length + 1 : elements.length) {\n\tif (--iterations === 0) return null;\n\tconst index = elements.indexOf(currentElement);\n\tlet newIndex;\n\tif (index === -1) newIndex = options.goForward ? 0 : elements.length - 1;\n\telse newIndex = options.goForward ? index + 1 : index - 1;\n\tif (!options.loop && (newIndex < 0 || newIndex >= elements.length)) return null;\n\tconst adjustedNewIndex = (newIndex + elements.length) % elements.length;\n\tconst candidate = elements[adjustedNewIndex];\n\tif (!candidate) return null;\n\tconst isDisabled = candidate.hasAttribute(\"disabled\") && candidate.getAttribute(\"disabled\") !== \"false\";\n\tif (isDisabled) return findNextFocusableElement(elements, candidate, options, iterations);\n\treturn candidate;\n}\n\n//#endregion\nexport { useArrowNavigation };\n//# sourceMappingURL=useArrowNavigation.js.map","import { createContext } from \"../shared/createContext.js\";\nimport { useDirection } from \"../shared/useDirection.js\";\nimport { useForwardExpose } from \"../shared/useForwardExpose.js\";\nimport { Primitive } from \"../Primitive/Primitive.js\";\nimport { VisuallyHiddenInput_default } from \"../VisuallyHidden/VisuallyHiddenInput.js\";\nimport { computed, createBlock, createVNode, defineComponent, mergeProps, openBlock, ref, renderSlot, toRefs, unref, watch, withCtx } from \"vue\";\nimport { useVModel } from \"@vueuse/core\";\n\n//#region src/PinInput/PinInputRoot.vue?vue&type=script&setup=true&lang.ts\nconst [injectPinInputRootContext, providePinInputRootContext] = /*#__PURE__*/ createContext(\"PinInputRoot\");\nvar PinInputRoot_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({\n\tinheritAttrs: false,\n\t__name: \"PinInputRoot\",\n\tprops: {\n\t\tmodelValue: {\n\t\t\ttype: null,\n\t\t\trequired: false\n\t\t},\n\t\tdefaultValue: {\n\t\t\ttype: null,\n\t\t\trequired: false\n\t\t},\n\t\tplaceholder: {\n\t\t\ttype: String,\n\t\t\trequired: false,\n\t\t\tdefault: \"\"\n\t\t},\n\t\tmask: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\totp: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\ttype: {\n\t\t\ttype: null,\n\t\t\trequired: false,\n\t\t\tdefault: \"text\"\n\t\t},\n\t\tdir: {\n\t\t\ttype: String,\n\t\t\trequired: false\n\t\t},\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\tid: {\n\t\t\ttype: String,\n\t\t\trequired: false\n\t\t},\n\t\tasChild: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\tas: {\n\t\t\ttype: null,\n\t\t\trequired: false\n\t\t},\n\t\tname: {\n\t\t\ttype: String,\n\t\t\trequired: false\n\t\t},\n\t\trequired: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t}\n\t},\n\temits: [\"update:modelValue\", \"complete\"],\n\tsetup(__props, { emit: __emit }) {\n\t\tconst props = __props;\n\t\tconst emits = __emit;\n\t\tconst { mask, otp, placeholder, type, disabled, dir: propDir } = toRefs(props);\n\t\tconst { forwardRef } = useForwardExpose();\n\t\tconst dir = useDirection(propDir);\n\t\tconst modelValue = useVModel(props, \"modelValue\", emits, {\n\t\t\tdefaultValue: props.defaultValue ?? [],\n\t\t\tpassive: true,\n\t\t\tdeep: true\n\t\t});\n\t\tconst currentModelValue = computed(() => Array.isArray(modelValue.value) ? [...modelValue.value] : []);\n\t\tconst inputElements = ref(/* @__PURE__ */ new Set());\n\t\tfunction onInputElementChange(el) {\n\t\t\tinputElements.value.add(el);\n\t\t}\n\t\tconst isNumericMode = computed(() => props.type === \"number\");\n\t\tconst isCompleted = computed(() => {\n\t\t\tconst modelValues = currentModelValue.value.filter((i) => !!i || isNumericMode.value && i === 0);\n\t\t\treturn modelValues.length === inputElements.value.size;\n\t\t});\n\t\twatch(modelValue, () => {\n\t\t\tif (isCompleted.value) emits(\"complete\", modelValue.value);\n\t\t}, { deep: true });\n\t\tprovidePinInputRootContext({\n\t\t\tmodelValue,\n\t\t\tcurrentModelValue,\n\t\t\tmask,\n\t\t\totp,\n\t\t\tplaceholder,\n\t\t\ttype,\n\t\t\tdir,\n\t\t\tdisabled,\n\t\t\tisCompleted,\n\t\t\tinputElements,\n\t\t\tonInputElementChange,\n\t\t\tisNumericMode\n\t\t});\n\t\treturn (_ctx, _cache) => {\n\t\t\treturn openBlock(), createBlock(unref(Primitive), mergeProps(_ctx.$attrs, {\n\t\t\t\tref: unref(forwardRef),\n\t\t\t\tdir: unref(dir),\n\t\t\t\t\"data-complete\": isCompleted.value ? \"\" : void 0,\n\t\t\t\t\"data-disabled\": unref(disabled) ? \"\" : void 0\n\t\t\t}), {\n\t\t\t\tdefault: withCtx(() => [renderSlot(_ctx.$slots, \"default\", { modelValue: unref(modelValue) }), createVNode(VisuallyHiddenInput_default, {\n\t\t\t\t\tid: _ctx.id,\n\t\t\t\t\tas: \"input\",\n\t\t\t\t\tfeature: \"focusable\",\n\t\t\t\t\ttabindex: \"-1\",\n\t\t\t\t\tvalue: currentModelValue.value.join(\"\"),\n\t\t\t\t\tname: _ctx.name ?? \"\",\n\t\t\t\t\tdisabled: unref(disabled),\n\t\t\t\t\trequired: _ctx.required,\n\t\t\t\t\tonFocus: _cache[0] || (_cache[0] = ($event) => Array.from(inputElements.value)?.[0]?.focus())\n\t\t\t\t}, null, 8, [\n\t\t\t\t\t\"id\",\n\t\t\t\t\t\"value\",\n\t\t\t\t\t\"name\",\n\t\t\t\t\t\"disabled\",\n\t\t\t\t\t\"required\"\n\t\t\t\t])]),\n\t\t\t\t_: 3\n\t\t\t}, 16, [\n\t\t\t\t\"dir\",\n\t\t\t\t\"data-complete\",\n\t\t\t\t\"data-disabled\"\n\t\t\t]);\n\t\t};\n\t}\n});\n\n//#endregion\n//#region src/PinInput/PinInputRoot.vue\nvar PinInputRoot_default = PinInputRoot_vue_vue_type_script_setup_true_lang_default;\n\n//#endregion\nexport { PinInputRoot_default, injectPinInputRootContext };\n//# sourceMappingURL=PinInputRoot.js.map","import { getActiveElement } from \"../shared/getActiveElement.js\";\nimport { useArrowNavigation } from \"../shared/useArrowNavigation.js\";\nimport { useComposing } from \"../shared/useComposing.js\";\nimport { Primitive } from \"../Primitive/Primitive.js\";\nimport { usePrimitiveElement } from \"../Primitive/usePrimitiveElement.js\";\nimport { injectPinInputRootContext } from \"./PinInputRoot.js\";\nimport { computed, createBlock, defineComponent, nextTick, onMounted, onUnmounted, openBlock, renderSlot, unref, watch, withCtx, withKeys } from \"vue\";\n\n//#region src/PinInput/PinInputInput.vue?vue&type=script&setup=true&lang.ts\nvar PinInputInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({\n\t__name: \"PinInputInput\",\n\tprops: {\n\t\tindex: {\n\t\t\ttype: Number,\n\t\t\trequired: true\n\t\t},\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\tasChild: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\tas: {\n\t\t\ttype: null,\n\t\t\trequired: false,\n\t\t\tdefault: \"input\"\n\t\t}\n\t},\n\tsetup(__props) {\n\t\tconst props = __props;\n\t\tconst context = injectPinInputRootContext();\n\t\tconst inputElements = computed(() => [...context.inputElements.value]);\n\t\tconst currentValue = computed(() => context.currentModelValue.value[props.index]);\n\t\tconst disabled = computed(() => props.disabled || context.disabled.value);\n\t\tconst isOtpMode = computed(() => context.otp.value);\n\t\tconst isPasswordMode = computed(() => context.mask.value);\n\t\tconst NUMBER_REG = /^\\d*$/;\n\t\tconst NON_NUMBER_REG = /\\D/g;\n\t\tconst { primitiveElement, currentElement } = usePrimitiveElement();\n\t\tconst { isComposing, handleCompositionStart, handleCompositionEnd } = useComposing((event) => {\n\t\t\tconst target = event.target;\n\t\t\tconst value = event.data || target.value;\n\t\t\tif (context.isNumericMode.value) {\n\t\t\t\tconst filtered = value.replace(NON_NUMBER_REG, \"\");\n\t\t\t\tif (!filtered) {\n\t\t\t\t\ttarget.value = \"\";\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tif (filtered.length > 1) {\n\t\t\t\t\thandleMultipleCharacter(filtered);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\ttarget.value = filtered;\n\t\t\t\tupdateModelValueAt(props.index, filtered);\n\t\t\t\tconst nextEl$1 = inputElements.value[props.index + 1];\n\t\t\t\tif (nextEl$1) nextEl$1.focus();\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (value.length > 1) {\n\t\t\t\thandleMultipleCharacter(value);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\ttarget.value = value;\n\t\t\tupdateModelValueAt(props.index, value);\n\t\t\tconst nextEl = inputElements.value[props.index + 1];\n\t\t\tif (nextEl) nextEl.focus();\n\t\t});\n\t\tfunction handleInput(event) {\n\t\t\tif (isComposing.value || event.isComposing) return;\n\t\t\tconst target = event.target;\n\t\t\tif ((event.data?.length ?? 0) > 1) {\n\t\t\t\thandleMultipleCharacter(target.value);\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (context.isNumericMode.value && !NUMBER_REG.test(target.value)) {\n\t\t\t\ttarget.value = target.value.replace(NON_NUMBER_REG, \"\");\n\t\t\t\treturn;\n\t\t\t}\n\t\t\ttarget.value = event.data || target.value.slice(-1);\n\t\t\tupdateModelValueAt(props.index, target.value);\n\t\t\tconst nextEl = inputElements.value[props.index + 1];\n\t\t\tif (nextEl) nextEl.focus();\n\t\t}\n\t\tfunction updatePlaceholder() {\n\t\t\tnextTick(() => {\n\t\t\t\tconst target = currentElement.value;\n\t\t\t\tif (!target) return;\n\t\t\t\tif (!target.value && target === getActiveElement()) target.placeholder = \"\";\n\t\t\t\telse target.placeholder = context.placeholder.value;\n\t\t\t});\n\t\t}\n\t\tfunction handleKeydown(event) {\n\t\t\tif (isComposing.value || event.isComposing) return;\n\t\t\tuseArrowNavigation(event, getActiveElement(), void 0, {\n\t\t\t\titemsArray: inputElements.value,\n\t\t\t\tfocus: true,\n\t\t\t\tloop: false,\n\t\t\t\tarrowKeyOptions: \"horizontal\",\n\t\t\t\tdir: context.dir.value\n\t\t\t});\n\t\t}\n\t\tfunction handleBackspace(event) {\n\t\t\tevent.preventDefault();\n\t\t\tconst target = event.target;\n\t\t\tconst value = target.value;\n\t\t\tif (value) updateModelValueAt(props.index, \"\");\n\t\t\telse {\n\t\t\t\tconst prevEl = inputElements.value[props.index - 1];\n\t\t\t\tif (prevEl) {\n\t\t\t\t\tprevEl.focus();\n\t\t\t\t\tupdateModelValueAt(props.index - 1, \"\");\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tfunction handleDelete(event) {\n\t\t\tif (event.key === \"Delete\") {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tupdateModelValueAt(props.index, \"\");\n\t\t\t}\n\t\t}\n\t\tfunction handleFocus(event) {\n\t\t\tif (context.otp.value) {\n\t\t\t\tconst firstEmptyInputIdx = inputElements.value.findIndex((_, idx) => context.currentModelValue.value[idx] === \"\" || context.currentModelValue.value[idx] === void 0);\n\t\t\t\tif (firstEmptyInputIdx !== -1 && firstEmptyInputIdx < props.index) {\n\t\t\t\t\tinputElements.value[firstEmptyInputIdx].focus();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t}\n\t\t\tconst target = event.target;\n\t\t\ttarget.setSelectionRange(1, 1);\n\t\t\tupdatePlaceholder();\n\t\t}\n\t\tfunction handleBlur(event) {\n\t\t\tupdatePlaceholder();\n\t\t}\n\t\tfunction handlePaste(event) {\n\t\t\tevent.preventDefault();\n\t\t\tconst clipboardData = event.clipboardData;\n\t\t\tif (!clipboardData) return;\n\t\t\tconst rawValues = clipboardData.getData(\"text\");\n\t\t\tconst values = context.isNumericMode.value ? rawValues.replace(NON_NUMBER_REG, \"\") : rawValues;\n\t\t\thandleMultipleCharacter(values);\n\t\t}\n\t\tfunction handleMultipleCharacter(values) {\n\t\t\tconst tempModelValue = [...context.currentModelValue.value];\n\t\t\tconst initialIndex = values.length >= inputElements.value.length ? 0 : props.index;\n\t\t\tconst lastIndex = Math.min(initialIndex + values.length, inputElements.value.length);\n\t\t\tfor (let i = initialIndex; i < lastIndex; i++) {\n\t\t\t\tconst input = inputElements.value[i];\n\t\t\t\tconst value = values[i - initialIndex];\n\t\t\t\tif (context.isNumericMode.value) {\n\t\t\t\t\tconst num = Number.parseInt(value);\n\t\t\t\t\tif (Number.isNaN(num)) continue;\n\t\t\t\t\ttempModelValue[i] = num;\n\t\t\t\t} else tempModelValue[i] = value;\n\t\t\t\tinput.focus();\n\t\t\t}\n\t\t\tcontext.modelValue.value = tempModelValue;\n\t\t\tinputElements.value[lastIndex]?.focus();\n\t\t}\n\t\tfunction removeTrailingEmptyStrings(input) {\n\t\t\tlet i = input.length - 1;\n\t\t\twhile (i >= 0 && input[i] === \"\") {\n\t\t\t\tinput.pop();\n\t\t\t\ti--;\n\t\t\t}\n\t\t\treturn input;\n\t\t}\n\t\tfunction updateModelValueAt(index, value) {\n\t\t\tconst tempModelValue = [...context.currentModelValue.value];\n\t\t\tif (context.isNumericMode.value) {\n\t\t\t\tconst num = +value;\n\t\t\t\tif (value === \"\" || isNaN(num)) delete tempModelValue[index];\n\t\t\t\telse tempModelValue[index] = num;\n\t\t\t} else tempModelValue[index] = value;\n\t\t\tcontext.modelValue.value = removeTrailingEmptyStrings(tempModelValue);\n\t\t}\n\t\twatch(currentValue, updatePlaceholder);\n\t\tonMounted(() => {\n\t\t\tcontext.onInputElementChange(currentElement.value);\n\t\t});\n\t\tonUnmounted(() => {\n\t\t\tcontext.inputElements?.value.delete(currentElement.value);\n\t\t});\n\t\treturn (_ctx, _cache) => {\n\t\t\treturn openBlock(), createBlock(unref(Primitive), {\n\t\t\t\tref_key: \"primitiveElement\",\n\t\t\t\tref: primitiveElement,\n\t\t\t\tautocapitalize: \"none\",\n\t\t\t\tas: _ctx.as,\n\t\t\t\t\"as-child\": _ctx.asChild,\n\t\t\t\tautocomplete: isOtpMode.value ? \"one-time-code\" : \"false\",\n\t\t\t\ttype: isPasswordMode.value ? \"password\" : \"text\",\n\t\t\t\tinputmode: unref(context).isNumericMode.value ? \"numeric\" : \"text\",\n\t\t\t\tpattern: unref(context).isNumericMode.value ? \"[0-9]*\" : void 0,\n\t\t\t\tplaceholder: unref(context).placeholder.value,\n\t\t\t\tvalue: currentValue.value,\n\t\t\t\tdisabled: disabled.value,\n\t\t\t\t\"data-disabled\": disabled.value ? \"\" : void 0,\n\t\t\t\t\"data-complete\": unref(context).isCompleted.value ? \"\" : void 0,\n\t\t\t\t\"aria-label\": `pin input ${_ctx.index + 1} of ${inputElements.value.length}`,\n\t\t\t\tonInput: _cache[0] || (_cache[0] = ($event) => handleInput($event)),\n\t\t\t\tonKeydown: [\n\t\t\t\t\twithKeys(handleKeydown, [\n\t\t\t\t\t\t\"left\",\n\t\t\t\t\t\t\"right\",\n\t\t\t\t\t\t\"up\",\n\t\t\t\t\t\t\"down\",\n\t\t\t\t\t\t\"home\",\n\t\t\t\t\t\t\"end\"\n\t\t\t\t\t]),\n\t\t\t\t\twithKeys(handleBackspace, [\"backspace\"]),\n\t\t\t\t\twithKeys(handleDelete, [\"delete\"])\n\t\t\t\t],\n\t\t\t\tonFocus: handleFocus,\n\t\t\t\tonBlur: handleBlur,\n\t\t\t\tonPaste: handlePaste,\n\t\t\t\tonCompositionstart: unref(handleCompositionStart),\n\t\t\t\tonCompositionend: unref(handleCompositionEnd)\n\t\t\t}, {\n\t\t\t\tdefault: withCtx(() => [renderSlot(_ctx.$slots, \"default\")]),\n\t\t\t\t_: 3\n\t\t\t}, 8, [\n\t\t\t\t\"as\",\n\t\t\t\t\"as-child\",\n\t\t\t\t\"autocomplete\",\n\t\t\t\t\"type\",\n\t\t\t\t\"inputmode\",\n\t\t\t\t\"pattern\",\n\t\t\t\t\"placeholder\",\n\t\t\t\t\"value\",\n\t\t\t\t\"disabled\",\n\t\t\t\t\"data-disabled\",\n\t\t\t\t\"data-complete\",\n\t\t\t\t\"aria-label\",\n\t\t\t\t\"onCompositionstart\",\n\t\t\t\t\"onCompositionend\"\n\t\t\t]);\n\t\t};\n\t}\n});\n\n//#endregion\n//#region src/PinInput/PinInputInput.vue\nvar PinInputInput_default = PinInputInput_vue_vue_type_script_setup_true_lang_default;\n\n//#endregion\nexport { PinInputInput_default };\n//# sourceMappingURL=PinInputInput.js.map","<template>\n  <PinInputRoot\n    :id=\"computedId\"\n    v-model=\"modelValue\"\n    :class=\"rootClasses\"\n    :disabled=\"props.disabled\"\n    :dir=\"props.dir\"\n    :mask=\"props.mask\"\n    :name=\"props.name\"\n    :otp=\"props.otp\"\n    :placeholder=\"props.placeholder\"\n    :required=\"props.required\"\n    :type=\"props.type\"\n    @complete=\"emit('complete', $event)\"\n  >\n    <PinInputInput\n      v-for=\"(_, i) in computedLength\"\n      :key=\"i\"\n      :index=\"i\"\n      :disabled=\"props.disabled\"\n      as-child\n    >\n      <BFormInput\n        class=\"b-form-otp-field\"\n        :aria-label=\"`${props.ariaLabel || 'Pin'} ${i + 1} of ${computedLength}`\"\n        :aria-invalid=\"props.ariaInvalid\"\n        :autofocus=\"props.autofocus && i === 0\"\n        :disabled=\"props.disabled\"\n        :form=\"props.form\"\n        :plaintext=\"props.plaintext\"\n        :readonly=\"props.readonly\"\n        :size=\"props.size\"\n        :state=\"props.state\"\n      />\n    </PinInputInput>\n  </PinInputRoot>\n</template>\n\n<script setup lang=\"ts\">\nimport {computed} from 'vue'\nimport {useToNumber} from '@vueuse/core'\nimport {PinInputInput, PinInputRoot} from 'reka-ui'\nimport type {BFormOtpProps} from '../../types'\nimport {useDefaults} from '../../composables/useDefaults'\nimport {useId} from '../../composables/useId'\nimport BFormInput from '../BFormInput/BFormInput.vue'\n\nconst lengthDefault = 6\nconst _props = withDefaults(defineProps<Omit<BFormOtpProps, 'modelValue'>>(), {\n  ariaInvalid: undefined,\n  ariaLabel: undefined,\n  autofocus: false,\n  dir: undefined,\n  disabled: false,\n  form: undefined,\n  id: undefined,\n  length: lengthDefault,\n  mask: false,\n  name: undefined,\n  otp: false,\n  placeholder: '',\n  plaintext: false,\n  readonly: false,\n  required: false,\n  size: undefined,\n  state: null,\n  type: 'text',\n})\nconst props = useDefaults(_props, 'BFormOtp')\nconst emit = defineEmits<{\n  complete: [value: string[]]\n}>()\n\nconst modelValue = defineModel<BFormOtpProps['modelValue']>({default: () => []})\n\nconst computedId = useId(() => props.id, 'form-otp')\nconst lengthNumber = useToNumber(() => props.length, {nanToZero: true, method: 'parseInt'})\nconst computedLength = computed(() => (lengthNumber.value > 0 ? lengthNumber.value : lengthDefault))\n\nconst rootClasses = computed(() => [\n  'b-form-otp',\n  'd-flex',\n  'gap-2',\n  'align-items-center',\n  {\n    [`b-form-otp-${props.size}`]: !!props.size,\n  },\n])\n</script>\n","<template>\n  <PinInputRoot\n    :id=\"computedId\"\n    v-model=\"modelValue\"\n    :class=\"rootClasses\"\n    :disabled=\"props.disabled\"\n    :dir=\"props.dir\"\n    :mask=\"props.mask\"\n    :name=\"props.name\"\n    :otp=\"props.otp\"\n    :placeholder=\"props.placeholder\"\n    :required=\"props.required\"\n    :type=\"props.type\"\n    @complete=\"emit('complete', $event)\"\n  >\n    <PinInputInput\n      v-for=\"(_, i) in computedLength\"\n      :key=\"i\"\n      :index=\"i\"\n      :disabled=\"props.disabled\"\n      as-child\n    >\n      <BFormInput\n        class=\"b-form-otp-field\"\n        :aria-label=\"`${props.ariaLabel || 'Pin'} ${i + 1} of ${computedLength}`\"\n        :aria-invalid=\"props.ariaInvalid\"\n        :autofocus=\"props.autofocus && i === 0\"\n        :disabled=\"props.disabled\"\n        :form=\"props.form\"\n        :plaintext=\"props.plaintext\"\n        :readonly=\"props.readonly\"\n        :size=\"props.size\"\n        :state=\"props.state\"\n      />\n    </PinInputInput>\n  </PinInputRoot>\n</template>\n\n<script setup lang=\"ts\">\nimport {computed} from 'vue'\nimport {useToNumber} from '@vueuse/core'\nimport {PinInputInput, PinInputRoot} from 'reka-ui'\nimport type {BFormOtpProps} from '../../types'\nimport {useDefaults} from '../../composables/useDefaults'\nimport {useId} from '../../composables/useId'\nimport BFormInput from '../BFormInput/BFormInput.vue'\n\nconst lengthDefault = 6\nconst _props = withDefaults(defineProps<Omit<BFormOtpProps, 'modelValue'>>(), {\n  ariaInvalid: undefined,\n  ariaLabel: undefined,\n  autofocus: false,\n  dir: undefined,\n  disabled: false,\n  form: undefined,\n  id: undefined,\n  length: lengthDefault,\n  mask: false,\n  name: undefined,\n  otp: false,\n  placeholder: '',\n  plaintext: false,\n  readonly: false,\n  required: false,\n  size: undefined,\n  state: null,\n  type: 'text',\n})\nconst props = useDefaults(_props, 'BFormOtp')\nconst emit = defineEmits<{\n  complete: [value: string[]]\n}>()\n\nconst modelValue = defineModel<BFormOtpProps['modelValue']>({default: () => []})\n\nconst computedId = useId(() => props.id, 'form-otp')\nconst lengthNumber = useToNumber(() => props.length, {nanToZero: true, method: 'parseInt'})\nconst computedLength = computed(() => (lengthNumber.value > 0 ? lengthNumber.value : lengthDefault))\n\nconst rootClasses = computed(() => [\n  'b-form-otp',\n  'd-flex',\n  'gap-2',\n  'align-items-center',\n  {\n    [`b-form-otp-${props.size}`]: !!props.size,\n  },\n])\n</script>\n"],"x_google_ignoreList":[0,1,2],"mappings":"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"}

package/dist/{BFormRating-AEiF8K8T.js → BFormRating-iKFgSFet.js}

@@ -1,3 +1,4 @@
+import { S as useToNumber } from "./dist-DKc2ivHS.js";
 import { t as useDefaults } from "./useDefaults-BzP4qZBu.js";
 import { t as useId$1 } from "./useId-Fh-Arhb7.js";
 import { t as useRtl } from "./useRtl-FeLayV4k.js";
@@ -20,21 +21,12 @@ var _hoisted_2 = [
 	"value"
 ];
 var _hoisted_3 = ["aria-label"];
-var _hoisted_4 = ["onClick"];
-var _hoisted_5 = { class: "b-form-rating-star" };
-var _hoisted_6 = ["width", "height"];
-var _hoisted_7 = {
-	key: 0,
-	d: "M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"
-};
-var _hoisted_8 = {
-	key: 1,
-	d: "M5.354 5.119 7.538.792A.52.52 0 0 1 8 .5c.183 0 .366.097.465.292l2.184 4.327 4.898.696A.54.54 0 0 1 16 6.32a.55.55 0 0 1-.17.445l-3.523 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256a.5.5 0 0 1-.146.05c-.342.06-.668-.254-.6-.642l.83-4.73L.173 6.765a.55.55 0 0 1-.172-.403.6.6 0 0 1 .085-.302.51.51 0 0 1 .37-.245zM8 12.027a.5.5 0 0 1 .232.056l3.686 1.894-.694-3.957a.56.56 0 0 1 .162-.505l2.907-2.77-4.052-.576a.53.53 0 0 1-.393-.288L8.001 2.223 8 2.226z"
-};
-var _hoisted_9 = {
-	key: 2,
-	d: "M2.866 14.85c-.078.444.36.791.746.593l4.39-2.256 4.389 2.256c.386.198.824-.149.746-.592l-.83-4.73 3.522-3.356c.33-.314.16-.888-.282-.95l-4.898-.696L8.465.792a.513.513 0 0 0-.927 0L5.354 5.12l-4.898.696c-.441.062-.612.636-.283.95l3.522 3.356-.83 4.73zm4.905-2.767-3.686 1.894.694-3.957a.56.56 0 0 0-.163-.505L1.71 6.745l4.052-.576a.53.53 0 0 0 .393-.288L8 2.223l1.847 3.658a.53.53 0 0 0 .393.288l4.052.575-2.906 2.77a.56.56 0 0 0-.163.506l.694 3.957-3.686-1.894a.5.5 0 0 0-.461 0z"
-};
+var _hoisted_4 = ["d"];
+var _hoisted_5 = ["onClick"];
+var _hoisted_6 = { class: "b-form-rating-item" };
+var _hoisted_7 = ["width", "height"];
+var _hoisted_8 = ["d"];
+var lengthDefault = 5;
 //#endregion
 //#region src/components/BFormRating/BFormRating.vue
 var BFormRating_default = /* @__PURE__ */ defineComponent({
@@ -79,8 +71,8 @@ var BFormRating_default = /* @__PURE__ */ defineComponent({
 			type: Boolean,
 			default: false
 		},
-		size: { default: "1rem" },
-		stars: { default: 5 },
+		size: { default: void 0 },
+		length: { default: lengthDefault },
 		variant: { default: void 0 }
 	}, {
 		"modelValue": { default: 0 },
@@ -104,40 +96,63 @@ var BFormRating_default = /* @__PURE__ */ defineComponent({
 			} catch {}
 			return isRtl?.value ?? false;
 		});
-		const computedClasses = computed(() => ({
-			"form-control": true,
-			"is-readonly": props.readonly,
-			"is-disabled": props.disabled,
-			"no-border": props.noBorder,
-			"b-form-rating": true,
-			"d-inline-flex": props.inline
-		}));
-		function isIconFull(index) {
-			return displayValue.value - index >= 1;
-		}
-		function isIconHalf(index) {
+		const computedClasses = computed(() => [
+			"form-control",
+			"b-form-rating",
+			"align-items-center",
+			{
+				"is-readonly": props.readonly,
+				"is-disabled": props.disabled,
+				"no-border": props.noBorder,
+				"d-flex": !props.inline,
+				"d-inline-flex": props.inline,
+				"b-form-rating-inline": props.inline
+			}
+		]);
+		const isIconFull = (index) => displayValue.value - index >= 1;
+		const isIconHalf = (index) => {
 			const diff = displayValue.value - index;
 			return diff >= .5 && diff < 1;
-		}
+		};
+		const iconPaths = {
+			full: "M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z",
+			half: "M5.354 5.119 7.538.792A.52.52 0 0 1 8 .5c.183 0 .366.097.465.292l2.184 4.327 4.898.696A.54.54 0 0 1 16 6.32a.55.55 0 0 1-.17.445l-3.523 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256a.5.5 0 0 1-.146.05c-.342.06-.668-.254-.6-.642l.83-4.73L.173 6.765a.55.55 0 0 1-.172-.403.6.6 0 0 1 .085-.302.51.51 0 0 1 .37-.245zM8 12.027a.5.5 0 0 1 .232.056l3.686 1.894-.694-3.957a.56.56 0 0 1 .162-.505l2.907-2.77-4.052-.576a.53.53 0 0 1-.393-.288L8.001 2.223 8 2.226z",
+			empty: "M2.866 14.85c-.078.444.36.791.746.593l4.39-2.256 4.389 2.256c.386.198.824-.149.746-.592l-.83-4.73 3.522-3.356c.33-.314.16-.888-.282-.95l-4.898-.696L8.465.792a.513.513 0 0 0-.927 0L5.354 5.12l-4.898.696c-.441.062-.612.636-.283.95l3.522 3.356-.83 4.73zm4.905-2.767-3.686 1.894.694-3.957a.56.56 0 0 0-.163-.505L1.71 6.745l4.052-.576a.53.53 0 0 0 .393-.288L8 2.223l1.847 3.658a.53.53 0 0 0 .393.288l4.052.575-2.906 2.77a.56.56 0 0 0-.163.506l.694 3.957-3.686-1.894a.5.5 0 0 0-.461 0z",
+			clear: "M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708"
+		};
+		const getIcon = (index) => {
+			if (isIconFull(index)) return iconPaths.full;
+			if (isIconHalf(index)) return iconPaths.half;
+			return iconPaths.empty;
+		};
 		const hoverValue = ref(null);
 		const displayValue = computed(() => hoverValue.value !== null ? hoverValue.value : modelValue.value);
-		const clampedStars = computed(() => Math.max(3, props.stars));
+		const lengthNumber = useToNumber(() => props.length, {
+			nanToZero: true,
+			method: "parseInt"
+		});
+		const computedLength = computed(() => lengthNumber.value > 0 ? lengthNumber.value : lengthDefault);
 		const computedSize = computed(() => {
-			if (props.size === "sm") return ".875rem";
-			if (props.size === "lg") return "1.25rem";
-			return props.size;
+			return `${{
+				sm: .875,
+				default: 1,
+				lg: 1.25
+			}[props.size ?? "default"]}rem`;
+		});
+		const computedFormatter = computed(() => {
+			const preciseValue = props.precision > 0 ? props.precision : 0;
+			return new Intl.NumberFormat(computedLocale.value, {
+				style: "decimal",
+				useGrouping: false,
+				minimumFractionDigits: preciseValue,
+				maximumFractionDigits: preciseValue,
+				notation: "standard"
+			});
 		});
-		const computedFormatter = computed(() => new Intl.NumberFormat(computedLocale.value, {
-			style: "decimal",
-			useGrouping: false,
-			minimumFractionDigits: props.precision > 0 ? props.precision : 0,
-			maximumFractionDigits: props.precision > 0 ? props.precision : 0,
-			notation: "standard"
-		}));
 		const displayValueText = computed(() => {
 			const val = props.precision > 0 ? roundedValue.value : displayValue.value;
 			const formattedValue = computedFormatter.value.format(val);
-			if (props.showValueMax) return `${formattedValue}/${computedFormatter.value.format(clampedStars.value)}`;
+			if (props.showValueMax) return `${formattedValue}/${computedFormatter.value.format(computedLength.value)}`;
 			if (props.showValue) return formattedValue;
 			return "";
 		});
@@ -146,7 +161,7 @@ var BFormRating_default = /* @__PURE__ */ defineComponent({
 			const factor = 10 ** props.precision;
 			return Math.round((val + Number.EPSILON) * factor) / factor;
 		});
-		const iconColors = computed(() => Array.from({ length: clampedStars.value }, () => {
+		const iconColors = computed(() => Array.from({ length: computedLength.value }, () => {
 			if (props.disabled) return {
 				class: "is-disabled",
 				style: {}
@@ -164,19 +179,19 @@ var BFormRating_default = /* @__PURE__ */ defineComponent({
 				style: {}
 			};
 		}));
-		function onKeydown(e) {
+		const onKeydown = (e) => {
 			if (props.readonly || props.disabled) return;
 			let newValue = modelValue.value;
 			const isRtlMode = computedRtl.value;
 			switch (e.key) {
 				case "ArrowRight":
-					newValue = isRtlMode ? Math.max(newValue - 1, 0) : Math.min(newValue + 1, clampedStars.value);
+					newValue = isRtlMode ? Math.max(newValue - 1, 0) : Math.min(newValue + 1, computedLength.value);
 					break;
 				case "ArrowUp":
-					newValue = Math.min(newValue + 1, clampedStars.value);
+					newValue = Math.min(newValue + 1, computedLength.value);
 					break;
 				case "ArrowLeft":
-					newValue = isRtlMode ? Math.min(newValue + 1, clampedStars.value) : Math.max(newValue - 1, 0);
+					newValue = isRtlMode ? Math.min(newValue + 1, computedLength.value) : Math.max(newValue - 1, 0);
 					break;
 				case "ArrowDown":
 					newValue = Math.max(newValue - 1, 0);
@@ -185,15 +200,15 @@ var BFormRating_default = /* @__PURE__ */ defineComponent({
 			}
 			e.preventDefault();
 			modelValue.value = newValue;
-		}
-		function selectRating(starIndex) {
+		};
+		const selectRating = (itemIndex) => {
 			if (props.readonly || props.disabled) return;
-			modelValue.value = hoverValue.value !== null ? hoverValue.value : starIndex;
-		}
-		function clearRating() {
+			modelValue.value = hoverValue.value !== null ? hoverValue.value : itemIndex;
+		};
+		const clearRating = () => {
 			hoverValue.value = null;
 			modelValue.value = 0;
-		}
+		};
 		__expose({ hoverValue });
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("output", {
@@ -203,9 +218,9 @@ var BFormRating_default = /* @__PURE__ */ defineComponent({
 				form: unref(props).form ? unref(props).form : void 0,
 				role: "slider",
 				"aria-valuemin": 0,
-				"aria-valuemax": clampedStars.value,
+				"aria-valuemax": computedLength.value,
 				"aria-valuenow": displayValue.value,
-				"aria-valuetext": unref(props).labelValueCurrent(displayValue.value, clampedStars.value),
+				"aria-valuetext": unref(props).labelValueCurrent(displayValue.value, computedLength.value),
 				"aria-disabled": unref(props).disabled ? true : void 0,
 				"aria-readonly": unref(props).readonly ? true : void 0,
 				tabindex: unref(props).disabled ? void 0 : "0",
@@ -220,7 +235,7 @@ var BFormRating_default = /* @__PURE__ */ defineComponent({
 				}, null, 8, _hoisted_2)) : createCommentVNode("", true),
 				unref(props).showClear && !unref(props).readonly && !unref(props).disabled ? (openBlock(), createElementBlock("span", {
 					key: 1,
-					class: "clear-button-spacing",
+					class: "rating-clear-button",
 					onClick: clearRating
 				}, [renderSlot(_ctx.$slots, "icon-clear", {}, () => [(openBlock(), createElementBlock("svg", {
 					viewBox: "0 0 16 16",
@@ -228,25 +243,25 @@ var BFormRating_default = /* @__PURE__ */ defineComponent({
 					"aria-label": unref(props).clearLabel,
 					xmlns: "http://www.w3.org/2000/svg",
 					class: "clear-icon"
-				}, [..._cache[0] || (_cache[0] = [createElementVNode("g", null, [createElementVNode("path", { d: "M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708" })], -1)])], 8, _hoisted_3))])])) : createCommentVNode("", true),
-				(openBlock(true), createElementBlock(Fragment, null, renderList(clampedStars.value, (starIndex, index) => {
+				}, [createElementVNode("g", null, [createElementVNode("path", { d: iconPaths.clear }, null, 8, _hoisted_4)])], 8, _hoisted_3))])])) : createCommentVNode("", true),
+				(openBlock(true), createElementBlock(Fragment, null, renderList(computedLength.value, (itemIndex, index) => {
 					return openBlock(), createElementBlock("span", {
-						key: starIndex,
-						class: "star",
-						onClick: ($event) => selectRating(starIndex)
+						key: itemIndex,
+						class: "rating-item flex-grow-1",
+						onClick: ($event) => selectRating(itemIndex)
 					}, [renderSlot(_ctx.$slots, "default", {
-						starIndex,
+						itemIndex,
 						isFilled: isIconFull(index),
 						isHalf: isIconHalf(index)
-					}, () => [createElementVNode("span", _hoisted_5, [(openBlock(), createElementBlock("svg", {
+					}, () => [createElementVNode("span", _hoisted_6, [(openBlock(), createElementBlock("svg", {
 						xmlns: "http://www.w3.org/2000/svg",
 						width: computedSize.value,
 						height: computedSize.value,
 						fill: "currentColor",
-						class: normalizeClass([[iconColors.value[index]?.class], "star-spacing"]),
+						class: normalizeClass([iconColors.value[index]?.class]),
 						style: normalizeStyle(iconColors.value[index]?.style),
 						viewBox: "0 0 16 16"
-					}, [isIconFull(index) ? (openBlock(), createElementBlock("path", _hoisted_7)) : isIconHalf(index) ? (openBlock(), createElementBlock("path", _hoisted_8)) : (openBlock(), createElementBlock("path", _hoisted_9))], 14, _hoisted_6))])])], 8, _hoisted_4);
+					}, [createElementVNode("path", { d: getIcon(index) }, null, 8, _hoisted_8)], 14, _hoisted_7))])])], 8, _hoisted_5);
 				}), 128)),
 				unref(props).showValue || unref(props).showValueMax ? (openBlock(), createElementBlock("span", {
 					key: 2,
@@ -260,4 +275,4 @@ var BFormRating_default = /* @__PURE__ */ defineComponent({
 //#endregion
 export { BFormRating_default as t };
 
-//# sourceMappingURL=BFormRating-AEiF8K8T.js.map
+//# sourceMappingURL=BFormRating-iKFgSFet.js.map