@rotki/ui-library 3.0.0-beta.2 → 3.0.0-beta.4

package/dist/components/forms/file-upload/RuiFileUpload.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiFileUpload.js","names":[],"sources":["../../../../src/components/forms/file-upload/RuiFileUpload.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { RuiIcons } from '@/icons';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiProgress from '@/components/progress/RuiProgress.vue';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { formatFileSize, getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\n\nexport interface FileUploadProps {\n  /** File type filter (HTML accept attribute syntax). e.g. '.csv', 'image/*', '.png,.jpg' */\n  accept?: string;\n  /** Allow multiple file selection. */\n  multiple?: boolean;\n  disabled?: boolean;\n  /** Shows a loading overlay (consumer-driven, e.g. while uploading). */\n  loading?: boolean;\n  /** Upload progress 0-100. When provided alongside `loading`, the overlay shows a determinate progress bar with percentage. */\n  progress?: number;\n  /** Renders the success state border/icon. Consumer toggles back to false. */\n  uploaded?: boolean;\n  /** Optional max size per file in bytes; failures emit `error` and set internal error state. */\n  maxSize?: number;\n  /** External error messages (e.g. from Vuelidate). Shown via the standard form detail block. */\n  errorMessages?: string | string[];\n  /** Hint text below the dropzone. */\n  hint?: string;\n  /** Disable drag-and-drop; the dropzone becomes click-only (matches rotki.com use case). */\n  noDrop?: boolean;\n  /** Replace the default \"Drag and drop or \\{button\\}\" copy. With `noDrop` the default is empty, so only the button shows. */\n  uploadText?: string;\n  /** Label shown on the inline button when no file is selected. */\n  clickToUploadText?: string;\n  /** Label shown on the inline button when one or more files are already selected. */\n  replaceText?: string;\n  /** Hide the bottom hint/error details strip. */\n  hideDetails?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiFileUpload',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<File | File[] | undefined>({ required: true });\n\nconst {\n  accept = '*',\n  multiple = false,\n  disabled = false,\n  loading = false,\n  progress = undefined,\n  uploaded = false,\n  maxSize = undefined,\n  errorMessages = [],\n  hint = '',\n  noDrop = false,\n  uploadText = undefined,\n  clickToUploadText = 'click to upload',\n  replaceText = 'replace file',\n  hideDetails = false,\n} = defineProps<FileUploadProps>();\n\nconst emit = defineEmits<{\n  error: [message: string];\n}>();\n\ndefineSlots<{\n  preview?: (props: { files: File[]; remove: () => void }) => any;\n  icon?: () => any;\n  description?: () => any;\n}>();\n\nconst wrapper = useTemplateRef<HTMLDivElement>('wrapper');\nconst input = useTemplateRef<HTMLInputElement>('input');\nconst internalError = ref<string>('');\n\nconst files = computed<File[]>(() => {\n  const value = get(modelValue);\n  if (!value)\n    return [];\n  return Array.isArray(value) ? value : [value];\n});\n\nconst hasFiles = computed<boolean>(() => get(files).length > 0);\n\nconst progressLabel = computed<string | undefined>(() => {\n  const value = progress;\n  return value === undefined ? undefined : `${Math.round(value)}%`;\n});\n\nconst combinedErrorMessages = computed<string[]>(() => {\n  const external = Array.isArray(errorMessages) ? errorMessages : [errorMessages];\n  const internal = get(internalError);\n  return [...external.filter(Boolean), ...(internal ? [internal] : [])];\n});\n\nconst { hasError } = useFormTextDetail(combinedErrorMessages, () => []);\n\n// a click-only dropzone does not offer dragging\nconst resolvedUploadText = computed<string>(() => uploadText ?? (noDrop ? '' : 'Drag and drop or'));\n\ntype WellTone = 'primary' | 'error' | 'success';\n\n// the icon well follows the dropzone's state, like its border\nconst wellTone = computed<WellTone>(() => {\n  if (get(hasError))\n    return 'error';\n  if (uploaded)\n    return 'success';\n  return 'primary';\n});\n\nconst wellIcon = computed<RuiIcons>(() => {\n  const tone = get(wellTone);\n  if (tone === 'error')\n    return 'lu-circle-alert';\n  if (tone === 'success')\n    return 'lu-circle-check';\n  return 'lu-file-up';\n});\n\n// the 10% tint vanishes on a dark page, so dark doubles it\nconst wellClasses: Record<WellTone, string> = {\n  primary: 'bg-rui-primary-soft dark:bg-rui-primary/20',\n  error: 'bg-rui-error-soft dark:bg-rui-error/20',\n  success: 'bg-rui-success-soft dark:bg-rui-success/20',\n};\n\nfunction matchesAccept(file: File, acceptString: string): boolean {\n  if (!acceptString || acceptString === '*' || acceptString === '*/*')\n    return true;\n\n  const fileName = file.name.toLowerCase();\n  const fileExtension = fileName.includes('.') ? fileName.slice(fileName.lastIndexOf('.')) : '';\n  const fileType = file.type.toLowerCase();\n  const acceptTypes = acceptString.split(',').map(value => value.trim().toLowerCase()).filter(Boolean);\n\n  return acceptTypes.some((type) => {\n    if (type.startsWith('.'))\n      return type === fileExtension;\n    if (type.endsWith('/*'))\n      return fileType.startsWith(type.slice(0, -1));\n    return type === fileType;\n  });\n}\n\nfunction reportError(message: string): void {\n  set(internalError, message);\n  emit('error', message);\n}\n\nfunction clearInternalError(): void {\n  set(internalError, '');\n}\n\nfunction validate(candidates: File[]): File[] | undefined {\n  if (candidates.length === 0)\n    return undefined;\n\n  if (!multiple && candidates.length > 1) {\n    reportError('Only one file can be uploaded');\n    return undefined;\n  }\n\n  for (const file of candidates) {\n    if (!matchesAccept(file, accept)) {\n      reportError(`Only ${accept} files are allowed`);\n      return undefined;\n    }\n    if (maxSize !== undefined && file.size > maxSize) {\n      reportError(`${file.name} exceeds the maximum size of ${formatFileSize(maxSize)}`);\n      return undefined;\n    }\n  }\n\n  return candidates;\n}\n\nfunction setFiles(candidates: File[]): void {\n  const validated = validate(candidates);\n  if (!validated)\n    return;\n  clearInternalError();\n  set(modelValue, multiple ? validated : validated[0]);\n}\n\nfunction removeFile(target?: File): void {\n  clearInternalError();\n  const inputEl = get(input);\n  if (inputEl)\n    inputEl.value = '';\n\n  if (!target || !multiple) {\n    set(modelValue, multiple ? [] : undefined);\n    return;\n  }\n\n  const remaining = get(files).filter(file => file !== target);\n  set(modelValue, remaining);\n}\n\nfunction onSelect(event: Event): void {\n  const target = event.target;\n  if (!(target instanceof HTMLInputElement) || !target.files)\n    return;\n  const picked = Array.from(target.files);\n  // the model owns the selection; a cleared input fires `change` for the same file again\n  target.value = '';\n  setFiles(picked);\n}\n\nfunction onDrop(dropped: File[] | null): void {\n  if (disabled || noDrop || !dropped || dropped.length === 0)\n    return;\n  setFiles(dropped);\n}\n\nconst { isOverDropZone } = useDropZone(wrapper, {\n  onDrop,\n});\n\nfunction openPicker(): void {\n  if (disabled)\n    return;\n  get(input)?.click();\n}\n\nwatch(() => errorMessages, () => clearInternalError());\n\ndefineExpose({\n  removeFile: () => removeFile(),\n  openPicker,\n});\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <div\n      ref=\"wrapper\"\n      class=\"p-4 border border-rui-outline dark:border-rui-neutral-400 rounded-rui-panel w-full relative border-dashed transition\"\n      :class=\"{\n        'border-rui-primary! bg-rui-primary-subtle': isOverDropZone && !disabled && !noDrop,\n        'border-rui-error! border-solid! bg-rui-error-subtle': hasError,\n        'border-rui-success! border-solid! bg-rui-success-subtle': uploaded,\n        'opacity-60 pointer-events-none': disabled,\n      }\"\n      :data-disabled=\"disabled || undefined\"\n      :data-uploaded=\"uploaded || undefined\"\n      :data-error=\"hasError ? '' : undefined\"\n      :data-drop-active=\"isOverDropZone || undefined\"\n    >\n      <div\n        class=\"flex flex-col items-center justify-center gap-3\"\n        :class=\"{ 'opacity-0': loading }\"\n      >\n        <slot\n          name=\"preview\"\n          :files=\"files\"\n          :remove=\"() => removeFile()\"\n        >\n          <div\n            v-if=\"hasFiles\"\n            class=\"flex flex-col gap-1 w-full\"\n            data-id=\"file-list\"\n          >\n            <div\n              v-for=\"file in files\"\n              :key=\"`${file.name}-${file.lastModified}`\"\n              class=\"flex items-center gap-2 bg-rui-primary-soft dark:bg-rui-primary/20 rounded-full pl-3 pr-1 py-1\"\n              data-id=\"file-item\"\n            >\n              <RuiIcon\n                name=\"lu-file\"\n                color=\"primary\"\n                size=\"20\"\n              />\n              <div class=\"flex-1 overflow-hidden min-w-0\">\n                <div\n                  class=\"text-sm leading-5 truncate\"\n                  :title=\"file.name\"\n                >\n                  {{ file.name }}\n                </div>\n                <div class=\"text-rui-text-secondary text-xs leading-3\">\n                  {{ formatFileSize(file.size) }}\n                </div>\n              </div>\n              <button\n                type=\"button\"\n                class=\"p-1 rounded-full hover:bg-rui-hover transition focus-visible:focus-ring outline-hidden\"\n                :disabled=\"disabled\"\n                :aria-label=\"`Remove ${file.name}`\"\n                data-id=\"remove-file\"\n                @click=\"removeFile(file)\"\n              >\n                <RuiIcon\n                  name=\"lu-x\"\n                  size=\"16\"\n                />\n              </button>\n            </div>\n          </div>\n          <div\n            v-else\n            class=\"h-10 w-10 rounded-full flex items-center justify-center\"\n            :class=\"wellClasses[wellTone]\"\n            data-id=\"icon-well\"\n          >\n            <slot name=\"icon\">\n              <RuiIcon\n                :name=\"wellIcon\"\n                :color=\"wellTone\"\n              />\n            </slot>\n          </div>\n        </slot>\n\n        <div class=\"text-center text-sm\">\n          <slot name=\"description\">\n            <div class=\"flex items-center justify-center gap-1 flex-wrap\">\n              <span v-if=\"resolvedUploadText\">{{ resolvedUploadText }}</span>\n              <button\n                type=\"button\"\n                class=\"text-rui-primary underline disabled:no-underline disabled:text-rui-text-disabled\"\n                :class=\"{ 'first-letter:uppercase': !resolvedUploadText }\"\n                :disabled=\"disabled\"\n                data-id=\"open-picker\"\n                @click=\"openPicker()\"\n              >\n                {{ hasFiles ? replaceText : clickToUploadText }}\n              </button>\n            </div>\n          </slot>\n        </div>\n\n        <input\n          ref=\"input\"\n          type=\"file\"\n          :accept=\"accept\"\n          :multiple=\"multiple\"\n          :disabled=\"disabled\"\n          hidden\n          data-id=\"file-input\"\n          v-bind=\"getNonRootAttrs($attrs, ['class', 'onChange'])\"\n          @change=\"onSelect($event)\"\n        />\n      </div>\n\n      <div\n        v-if=\"loading\"\n        class=\"flex flex-col items-center justify-center absolute h-full w-full top-0 left-0 gap-2\"\n        data-id=\"loading\"\n      >\n        <RuiProgress\n          circular\n          :variant=\"progress === undefined ? 'indeterminate' : 'determinate'\"\n          :value=\"progress\"\n          color=\"primary\"\n          size=\"40\"\n        />\n        <div\n          v-if=\"progressLabel\"\n          class=\"text-xs text-rui-text-secondary\"\n          data-id=\"progress-label\"\n          v-text=\"progressLabel\"\n        />\n      </div>\n    </div>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      :error-messages=\"combinedErrorMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiFileUpload.js","names":["_sfc_main"],"sources":["../../../../src/components/forms/file-upload/RuiFileUpload.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { RuiIcons } from '@/icons';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiProgress from '@/components/progress/RuiProgress.vue';\nimport { useRuiI8n } from '@/composables/use-rui-i18n';\nimport { RUI_I18N_KEYS } from '@/i18n/keys';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { formatFileSize, getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\n\nexport interface FileUploadProps {\n  /** File type filter (HTML accept attribute syntax). e.g. '.csv', 'image/*', '.png,.jpg' */\n  accept?: string;\n  /** Allow multiple file selection. */\n  multiple?: boolean;\n  disabled?: boolean;\n  /** Shows a loading overlay (consumer-driven, e.g. while uploading). */\n  loading?: boolean;\n  /** Upload progress 0-100. When provided alongside `loading`, the overlay shows a determinate progress bar with percentage. */\n  progress?: number;\n  /** Renders the success state border/icon. Consumer toggles back to false. */\n  uploaded?: boolean;\n  /** Optional max size per file in bytes; failures emit `error` and set internal error state. */\n  maxSize?: number;\n  /** External error messages (e.g. from Vuelidate). Shown via the standard form detail block. */\n  errorMessages?: string | string[];\n  /** Hint text below the dropzone. */\n  hint?: string;\n  /** Disable drag-and-drop; the dropzone becomes click-only (matches rotki.com use case). */\n  noDrop?: boolean;\n  /**\n   * Replace the default \"Drag and drop or \\{button\\}\" copy. With `noDrop` the default is empty, so only the button shows.\n   * The defaults of this and the other texts, error messages included, come from the `rui.file_upload.*` translation keys.\n   */\n  uploadText?: string;\n  /** Label shown on the inline button when no file is selected. */\n  clickToUploadText?: string;\n  /** Label shown on the inline button when one or more files are already selected. */\n  replaceText?: string;\n  /** Hide the bottom hint/error details strip. */\n  hideDetails?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiFileUpload',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<File | File[] | undefined>({ required: true });\n\nconst {\n  accept = '*',\n  multiple = false,\n  disabled = false,\n  loading = false,\n  progress = undefined,\n  uploaded = false,\n  maxSize = undefined,\n  errorMessages = [],\n  hint = '',\n  noDrop = false,\n  uploadText = undefined,\n  clickToUploadText = undefined,\n  replaceText = undefined,\n  hideDetails = false,\n} = defineProps<FileUploadProps>();\n\nconst emit = defineEmits<{\n  error: [message: string];\n}>();\n\ndefineSlots<{\n  preview?: (props: { files: File[]; remove: () => void }) => any;\n  icon?: () => any;\n  description?: () => any;\n}>();\n\nconst { t } = useRuiI8n();\n\nconst wrapper = useTemplateRef<HTMLDivElement>('wrapper');\nconst input = useTemplateRef<HTMLInputElement>('input');\nconst internalError = ref<string>('');\n\nconst files = computed<File[]>(() => {\n  const value = get(modelValue);\n  if (!value)\n    return [];\n  return Array.isArray(value) ? value : [value];\n});\n\nconst hasFiles = computed<boolean>(() => get(files).length > 0);\n\nconst progressLabel = computed<string | undefined>(() => {\n  const value = progress;\n  return value === undefined ? undefined : `${Math.round(value)}%`;\n});\n\nconst combinedErrorMessages = computed<string[]>(() => {\n  const external = Array.isArray(errorMessages) ? errorMessages : [errorMessages];\n  const internal = get(internalError);\n  return [...external.filter(Boolean), ...(internal ? [internal] : [])];\n});\n\nconst { hasError } = useFormTextDetail(combinedErrorMessages, () => []);\n\n// a click-only dropzone does not offer dragging\nconst resolvedUploadText = computed<string>(() => uploadText ?? (noDrop ? '' : t(RUI_I18N_KEYS.fileUpload.dropPrefix, 'Drag and drop or')));\nconst resolvedClickToUploadText = computed<string>(() => clickToUploadText ?? t(RUI_I18N_KEYS.fileUpload.clickToUpload, 'click to upload'));\nconst resolvedReplaceText = computed<string>(() => replaceText ?? t(RUI_I18N_KEYS.fileUpload.replace, 'replace file'));\n\ntype WellTone = 'primary' | 'error' | 'success';\n\n// the icon well follows the dropzone's state, like its border\nconst wellTone = computed<WellTone>(() => {\n  if (get(hasError))\n    return 'error';\n  if (uploaded)\n    return 'success';\n  return 'primary';\n});\n\nconst wellIcon = computed<RuiIcons>(() => {\n  const tone = get(wellTone);\n  if (tone === 'error')\n    return 'lu-circle-alert';\n  if (tone === 'success')\n    return 'lu-circle-check';\n  return 'lu-file-up';\n});\n\n// the 10% tint vanishes on a dark page, so dark doubles it\nconst wellClasses: Record<WellTone, string> = {\n  primary: 'bg-rui-primary-soft dark:bg-rui-primary/20',\n  error: 'bg-rui-error-soft dark:bg-rui-error/20',\n  success: 'bg-rui-success-soft dark:bg-rui-success/20',\n};\n\nfunction matchesAccept(file: File, acceptString: string): boolean {\n  if (!acceptString || acceptString === '*' || acceptString === '*/*')\n    return true;\n\n  const fileName = file.name.toLowerCase();\n  const fileExtension = fileName.includes('.') ? fileName.slice(fileName.lastIndexOf('.')) : '';\n  const fileType = file.type.toLowerCase();\n  const acceptTypes = acceptString.split(',').map(value => value.trim().toLowerCase()).filter(Boolean);\n\n  return acceptTypes.some((type) => {\n    if (type.startsWith('.'))\n      return type === fileExtension;\n    if (type.endsWith('/*'))\n      return fileType.startsWith(type.slice(0, -1));\n    return type === fileType;\n  });\n}\n\nfunction reportError(message: string): void {\n  set(internalError, message);\n  emit('error', message);\n}\n\nfunction clearInternalError(): void {\n  set(internalError, '');\n}\n\nfunction validate(candidates: File[]): File[] | undefined {\n  if (candidates.length === 0)\n    return undefined;\n\n  if (!multiple && candidates.length > 1) {\n    reportError(t(RUI_I18N_KEYS.fileUpload.tooMany, 'Only one file can be uploaded'));\n    return undefined;\n  }\n\n  for (const file of candidates) {\n    if (!matchesAccept(file, accept)) {\n      reportError(t(RUI_I18N_KEYS.fileUpload.wrongType, { accept }, `Only ${accept} files are allowed`));\n      return undefined;\n    }\n    if (maxSize !== undefined && file.size > maxSize) {\n      const size = formatFileSize(maxSize);\n      reportError(t(RUI_I18N_KEYS.fileUpload.tooLarge, { name: file.name, size }, `${file.name} exceeds the maximum size of ${size}`));\n      return undefined;\n    }\n  }\n\n  return candidates;\n}\n\nfunction setFiles(candidates: File[]): void {\n  const validated = validate(candidates);\n  if (!validated)\n    return;\n  clearInternalError();\n  set(modelValue, multiple ? validated : validated[0]);\n}\n\nfunction removeFile(target?: File): void {\n  clearInternalError();\n  const inputEl = get(input);\n  if (inputEl)\n    inputEl.value = '';\n\n  if (!target || !multiple) {\n    set(modelValue, multiple ? [] : undefined);\n    return;\n  }\n\n  const remaining = get(files).filter(file => file !== target);\n  set(modelValue, remaining);\n}\n\nfunction onSelect(event: Event): void {\n  const target = event.target;\n  if (!(target instanceof HTMLInputElement) || !target.files)\n    return;\n  const picked = Array.from(target.files);\n  // the model owns the selection; a cleared input fires `change` for the same file again\n  target.value = '';\n  setFiles(picked);\n}\n\nfunction onDrop(dropped: File[] | null): void {\n  if (disabled || noDrop || !dropped || dropped.length === 0)\n    return;\n  setFiles(dropped);\n}\n\nconst { isOverDropZone } = useDropZone(wrapper, {\n  onDrop,\n});\n\nfunction openPicker(): void {\n  if (disabled)\n    return;\n  get(input)?.click();\n}\n\nwatch(() => errorMessages, () => clearInternalError());\n\ndefineExpose({\n  removeFile: () => removeFile(),\n  openPicker,\n});\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <div\n      ref=\"wrapper\"\n      class=\"p-4 border border-rui-outline dark:border-rui-neutral-400 rounded-rui-panel w-full relative border-dashed transition\"\n      :class=\"{\n        'border-rui-primary! bg-rui-primary-subtle': isOverDropZone && !disabled && !noDrop,\n        'border-rui-error! border-solid! bg-rui-error-subtle': hasError,\n        'border-rui-success! border-solid! bg-rui-success-subtle': uploaded,\n        'opacity-60 pointer-events-none': disabled,\n      }\"\n      :data-disabled=\"disabled || undefined\"\n      :data-uploaded=\"uploaded || undefined\"\n      :data-error=\"hasError ? '' : undefined\"\n      :data-drop-active=\"isOverDropZone || undefined\"\n    >\n      <div\n        class=\"flex flex-col items-center justify-center gap-3\"\n        :class=\"{ 'opacity-0': loading }\"\n      >\n        <slot\n          name=\"preview\"\n          :files=\"files\"\n          :remove=\"() => removeFile()\"\n        >\n          <div\n            v-if=\"hasFiles\"\n            class=\"flex flex-col gap-1 w-full\"\n            data-id=\"file-list\"\n          >\n            <div\n              v-for=\"file in files\"\n              :key=\"`${file.name}-${file.lastModified}`\"\n              class=\"flex items-center gap-2 bg-rui-primary-soft dark:bg-rui-primary/20 rounded-full pl-3 pr-1 py-1\"\n              data-id=\"file-item\"\n            >\n              <RuiIcon\n                name=\"lu-file\"\n                color=\"primary\"\n                size=\"20\"\n              />\n              <div class=\"flex-1 overflow-hidden min-w-0\">\n                <div\n                  class=\"text-sm leading-5 truncate\"\n                  :title=\"file.name\"\n                >\n                  {{ file.name }}\n                </div>\n                <div class=\"text-rui-text-secondary text-xs leading-3\">\n                  {{ formatFileSize(file.size) }}\n                </div>\n              </div>\n              <button\n                type=\"button\"\n                class=\"p-1 rounded-full hover:bg-rui-hover transition focus-visible:focus-ring outline-hidden\"\n                :disabled=\"disabled\"\n                :aria-label=\"t(RUI_I18N_KEYS.fileUpload.remove, { name: file.name }, `Remove ${file.name}`)\"\n                data-id=\"remove-file\"\n                @click=\"removeFile(file)\"\n              >\n                <RuiIcon\n                  name=\"lu-x\"\n                  size=\"16\"\n                />\n              </button>\n            </div>\n          </div>\n          <div\n            v-else\n            class=\"h-10 w-10 rounded-full flex items-center justify-center\"\n            :class=\"wellClasses[wellTone]\"\n            data-id=\"icon-well\"\n          >\n            <slot name=\"icon\">\n              <RuiIcon\n                :name=\"wellIcon\"\n                :color=\"wellTone\"\n              />\n            </slot>\n          </div>\n        </slot>\n\n        <div class=\"text-center text-sm\">\n          <slot name=\"description\">\n            <div class=\"flex items-center justify-center gap-1 flex-wrap\">\n              <span v-if=\"resolvedUploadText\">{{ resolvedUploadText }}</span>\n              <button\n                type=\"button\"\n                class=\"text-rui-primary underline disabled:no-underline disabled:text-rui-text-disabled\"\n                :class=\"{ 'first-letter:uppercase': !resolvedUploadText }\"\n                :disabled=\"disabled\"\n                data-id=\"open-picker\"\n                @click=\"openPicker()\"\n              >\n                {{ hasFiles ? resolvedReplaceText : resolvedClickToUploadText }}\n              </button>\n            </div>\n          </slot>\n        </div>\n\n        <input\n          ref=\"input\"\n          type=\"file\"\n          :accept=\"accept\"\n          :multiple=\"multiple\"\n          :disabled=\"disabled\"\n          hidden\n          data-id=\"file-input\"\n          v-bind=\"getNonRootAttrs($attrs, ['class', 'onChange'])\"\n          @change=\"onSelect($event)\"\n        />\n      </div>\n\n      <div\n        v-if=\"loading\"\n        class=\"flex flex-col items-center justify-center absolute h-full w-full top-0 left-0 gap-2\"\n        data-id=\"loading\"\n      >\n        <RuiProgress\n          circular\n          :variant=\"progress === undefined ? 'indeterminate' : 'determinate'\"\n          :value=\"progress\"\n          color=\"primary\"\n          size=\"40\"\n        />\n        <div\n          v-if=\"progressLabel\"\n          class=\"text-xs text-rui-text-secondary\"\n          data-id=\"progress-label\"\n          v-text=\"progressLabel\"\n        />\n      </div>\n    </div>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      :error-messages=\"combinedErrorMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/forms/file-upload/RuiFileUpload.vue.d.ts

@@ -18,7 +18,10 @@ export interface FileUploadProps {
     hint?: string;
     /** Disable drag-and-drop; the dropzone becomes click-only (matches rotki.com use case). */
     noDrop?: boolean;
-    /** Replace the default "Drag and drop or \{button\}" copy. With `noDrop` the default is empty, so only the button shows. */
+    /**
+     * Replace the default "Drag and drop or \{button\}" copy. With `noDrop` the default is empty, so only the button shows.
+     * The defaults of this and the other texts, error messages included, come from the `rui.file_upload.*` translation keys.
+     */
     uploadText?: string;
     /** Label shown on the inline button when no file is selected. */
     clickToUploadText?: string;

package/dist/components/forms/file-upload/RuiFileUpload.vue_vue_type_script_setup_true_lang.js

@@ -1,10 +1,12 @@
 import { get, set } from "../../../vendor/@vueuse/shared/dist/index.js";
 import { useDropZone } from "../../../vendor/@vueuse/core/dist/index.js";
+import { useRuiI8n } from "../../../composables/use-rui-i18n.js";
 import RuiIcon_default from "../../icons/RuiIcon.js";
 import RuiProgress_default from "../../progress/RuiProgress.js";
 import { useFormTextDetail } from "../../../utils/form-text-detail.js";
 import RuiFormTextDetail_default from "../../helpers/RuiFormTextDetail.js";
 import { formatFileSize, getNonRootAttrs, getRootAttrs } from "../../../utils/helpers.js";
+import { RUI_I18N_KEYS } from "../../../i18n/keys.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, guardReactiveProps, mergeModels, mergeProps, normalizeClass, normalizeProps, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useModel, useTemplateRef, watch } from "vue";
 //#region src/components/forms/file-upload/RuiFileUpload.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [
@@ -72,8 +74,8 @@ var RuiFileUpload_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 			default: false
 		},
 		uploadText: { default: () => void 0 },
-		clickToUploadText: { default: "click to upload" },
-		replaceText: { default: "replace file" },
+		clickToUploadText: { default: () => void 0 },
+		replaceText: { default: () => void 0 },
 		hideDetails: {
 			type: Boolean,
 			default: false
@@ -86,6 +88,7 @@ var RuiFileUpload_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 	setup(__props, { expose: __expose, emit: __emit }) {
 		const modelValue = useModel(__props, "modelValue");
 		const emit = __emit;
+		const { t } = useRuiI8n();
 		const wrapper = useTemplateRef("wrapper");
 		const input = useTemplateRef("input");
 		const internalError = ref("");
@@ -105,7 +108,9 @@ var RuiFileUpload_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 			return [...external.filter(Boolean), ...internal ? [internal] : []];
 		});
 		const { hasError } = useFormTextDetail(combinedErrorMessages, () => []);
-		const resolvedUploadText = computed(() => __props.uploadText ?? (__props.noDrop ? "" : "Drag and drop or"));
+		const resolvedUploadText = computed(() => __props.uploadText ?? (__props.noDrop ? "" : t(RUI_I18N_KEYS.fileUpload.dropPrefix, "Drag and drop or")));
+		const resolvedClickToUploadText = computed(() => __props.clickToUploadText ?? t(RUI_I18N_KEYS.fileUpload.clickToUpload, "click to upload"));
+		const resolvedReplaceText = computed(() => __props.replaceText ?? t(RUI_I18N_KEYS.fileUpload.replace, "replace file"));
 		const wellTone = computed(() => {
 			if (get(hasError)) return "error";
 			if (__props.uploaded) return "success";
@@ -143,16 +148,20 @@ var RuiFileUpload_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 		function validate(candidates) {
 			if (candidates.length === 0) return void 0;
 			if (!__props.multiple && candidates.length > 1) {
-				reportError("Only one file can be uploaded");
+				reportError(t(RUI_I18N_KEYS.fileUpload.tooMany, "Only one file can be uploaded"));
 				return;
 			}
 			for (const file of candidates) {
 				if (!matchesAccept(file, __props.accept)) {
-					reportError(`Only ${__props.accept} files are allowed`);
+					reportError(t(RUI_I18N_KEYS.fileUpload.wrongType, { accept: __props.accept }, `Only ${__props.accept} files are allowed`));
 					return;
 				}
 				if (__props.maxSize !== void 0 && file.size > __props.maxSize) {
-					reportError(`${file.name} exceeds the maximum size of ${formatFileSize(__props.maxSize)}`);
+					const size = formatFileSize(__props.maxSize);
+					reportError(t(RUI_I18N_KEYS.fileUpload.tooLarge, {
+						name: file.name,
+						size
+					}, `${file.name} exceeds the maximum size of ${size}`));
 					return;
 				}
 			}
@@ -233,7 +242,7 @@ var RuiFileUpload_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 							type: "button",
 							class: "p-1 rounded-full hover:bg-rui-hover transition focus-visible:focus-ring outline-hidden",
 							disabled: __props.disabled,
-							"aria-label": `Remove ${file.name}`,
+							"aria-label": unref(t)(unref(RUI_I18N_KEYS).fileUpload.remove, { name: file.name }, `Remove ${file.name}`),
 							"data-id": "remove-file",
 							onClick: ($event) => removeFile(file)
 						}, [createVNode(RuiIcon_default, {
@@ -255,7 +264,7 @@ var RuiFileUpload_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 					disabled: __props.disabled,
 					"data-id": "open-picker",
 					onClick: _cache[0] || (_cache[0] = ($event) => openPicker())
-				}, toDisplayString(unref(hasFiles) ? __props.replaceText : __props.clickToUploadText), 11, _hoisted_10)])])]),
+				}, toDisplayString(unref(hasFiles) ? unref(resolvedReplaceText) : unref(resolvedClickToUploadText)), 11, _hoisted_10)])])]),
 				createElementVNode("input", mergeProps({
 					ref_key: "input",
 					ref: input,

package/dist/components/forms/file-upload/RuiFileUpload.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiFileUpload.vue_vue_type_script_setup_true_lang.js","names":["$attrs"],"sources":["../../../../src/components/forms/file-upload/RuiFileUpload.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { RuiIcons } from '@/icons';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiProgress from '@/components/progress/RuiProgress.vue';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { formatFileSize, getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\n\nexport interface FileUploadProps {\n  /** File type filter (HTML accept attribute syntax). e.g. '.csv', 'image/*', '.png,.jpg' */\n  accept?: string;\n  /** Allow multiple file selection. */\n  multiple?: boolean;\n  disabled?: boolean;\n  /** Shows a loading overlay (consumer-driven, e.g. while uploading). */\n  loading?: boolean;\n  /** Upload progress 0-100. When provided alongside `loading`, the overlay shows a determinate progress bar with percentage. */\n  progress?: number;\n  /** Renders the success state border/icon. Consumer toggles back to false. */\n  uploaded?: boolean;\n  /** Optional max size per file in bytes; failures emit `error` and set internal error state. */\n  maxSize?: number;\n  /** External error messages (e.g. from Vuelidate). Shown via the standard form detail block. */\n  errorMessages?: string | string[];\n  /** Hint text below the dropzone. */\n  hint?: string;\n  /** Disable drag-and-drop; the dropzone becomes click-only (matches rotki.com use case). */\n  noDrop?: boolean;\n  /** Replace the default \"Drag and drop or \\{button\\}\" copy. With `noDrop` the default is empty, so only the button shows. */\n  uploadText?: string;\n  /** Label shown on the inline button when no file is selected. */\n  clickToUploadText?: string;\n  /** Label shown on the inline button when one or more files are already selected. */\n  replaceText?: string;\n  /** Hide the bottom hint/error details strip. */\n  hideDetails?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiFileUpload',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<File | File[] | undefined>({ required: true });\n\nconst {\n  accept = '*',\n  multiple = false,\n  disabled = false,\n  loading = false,\n  progress = undefined,\n  uploaded = false,\n  maxSize = undefined,\n  errorMessages = [],\n  hint = '',\n  noDrop = false,\n  uploadText = undefined,\n  clickToUploadText = 'click to upload',\n  replaceText = 'replace file',\n  hideDetails = false,\n} = defineProps<FileUploadProps>();\n\nconst emit = defineEmits<{\n  error: [message: string];\n}>();\n\ndefineSlots<{\n  preview?: (props: { files: File[]; remove: () => void }) => any;\n  icon?: () => any;\n  description?: () => any;\n}>();\n\nconst wrapper = useTemplateRef<HTMLDivElement>('wrapper');\nconst input = useTemplateRef<HTMLInputElement>('input');\nconst internalError = ref<string>('');\n\nconst files = computed<File[]>(() => {\n  const value = get(modelValue);\n  if (!value)\n    return [];\n  return Array.isArray(value) ? value : [value];\n});\n\nconst hasFiles = computed<boolean>(() => get(files).length > 0);\n\nconst progressLabel = computed<string | undefined>(() => {\n  const value = progress;\n  return value === undefined ? undefined : `${Math.round(value)}%`;\n});\n\nconst combinedErrorMessages = computed<string[]>(() => {\n  const external = Array.isArray(errorMessages) ? errorMessages : [errorMessages];\n  const internal = get(internalError);\n  return [...external.filter(Boolean), ...(internal ? [internal] : [])];\n});\n\nconst { hasError } = useFormTextDetail(combinedErrorMessages, () => []);\n\n// a click-only dropzone does not offer dragging\nconst resolvedUploadText = computed<string>(() => uploadText ?? (noDrop ? '' : 'Drag and drop or'));\n\ntype WellTone = 'primary' | 'error' | 'success';\n\n// the icon well follows the dropzone's state, like its border\nconst wellTone = computed<WellTone>(() => {\n  if (get(hasError))\n    return 'error';\n  if (uploaded)\n    return 'success';\n  return 'primary';\n});\n\nconst wellIcon = computed<RuiIcons>(() => {\n  const tone = get(wellTone);\n  if (tone === 'error')\n    return 'lu-circle-alert';\n  if (tone === 'success')\n    return 'lu-circle-check';\n  return 'lu-file-up';\n});\n\n// the 10% tint vanishes on a dark page, so dark doubles it\nconst wellClasses: Record<WellTone, string> = {\n  primary: 'bg-rui-primary-soft dark:bg-rui-primary/20',\n  error: 'bg-rui-error-soft dark:bg-rui-error/20',\n  success: 'bg-rui-success-soft dark:bg-rui-success/20',\n};\n\nfunction matchesAccept(file: File, acceptString: string): boolean {\n  if (!acceptString || acceptString === '*' || acceptString === '*/*')\n    return true;\n\n  const fileName = file.name.toLowerCase();\n  const fileExtension = fileName.includes('.') ? fileName.slice(fileName.lastIndexOf('.')) : '';\n  const fileType = file.type.toLowerCase();\n  const acceptTypes = acceptString.split(',').map(value => value.trim().toLowerCase()).filter(Boolean);\n\n  return acceptTypes.some((type) => {\n    if (type.startsWith('.'))\n      return type === fileExtension;\n    if (type.endsWith('/*'))\n      return fileType.startsWith(type.slice(0, -1));\n    return type === fileType;\n  });\n}\n\nfunction reportError(message: string): void {\n  set(internalError, message);\n  emit('error', message);\n}\n\nfunction clearInternalError(): void {\n  set(internalError, '');\n}\n\nfunction validate(candidates: File[]): File[] | undefined {\n  if (candidates.length === 0)\n    return undefined;\n\n  if (!multiple && candidates.length > 1) {\n    reportError('Only one file can be uploaded');\n    return undefined;\n  }\n\n  for (const file of candidates) {\n    if (!matchesAccept(file, accept)) {\n      reportError(`Only ${accept} files are allowed`);\n      return undefined;\n    }\n    if (maxSize !== undefined && file.size > maxSize) {\n      reportError(`${file.name} exceeds the maximum size of ${formatFileSize(maxSize)}`);\n      return undefined;\n    }\n  }\n\n  return candidates;\n}\n\nfunction setFiles(candidates: File[]): void {\n  const validated = validate(candidates);\n  if (!validated)\n    return;\n  clearInternalError();\n  set(modelValue, multiple ? validated : validated[0]);\n}\n\nfunction removeFile(target?: File): void {\n  clearInternalError();\n  const inputEl = get(input);\n  if (inputEl)\n    inputEl.value = '';\n\n  if (!target || !multiple) {\n    set(modelValue, multiple ? [] : undefined);\n    return;\n  }\n\n  const remaining = get(files).filter(file => file !== target);\n  set(modelValue, remaining);\n}\n\nfunction onSelect(event: Event): void {\n  const target = event.target;\n  if (!(target instanceof HTMLInputElement) || !target.files)\n    return;\n  const picked = Array.from(target.files);\n  // the model owns the selection; a cleared input fires `change` for the same file again\n  target.value = '';\n  setFiles(picked);\n}\n\nfunction onDrop(dropped: File[] | null): void {\n  if (disabled || noDrop || !dropped || dropped.length === 0)\n    return;\n  setFiles(dropped);\n}\n\nconst { isOverDropZone } = useDropZone(wrapper, {\n  onDrop,\n});\n\nfunction openPicker(): void {\n  if (disabled)\n    return;\n  get(input)?.click();\n}\n\nwatch(() => errorMessages, () => clearInternalError());\n\ndefineExpose({\n  removeFile: () => removeFile(),\n  openPicker,\n});\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <div\n      ref=\"wrapper\"\n      class=\"p-4 border border-rui-outline dark:border-rui-neutral-400 rounded-rui-panel w-full relative border-dashed transition\"\n      :class=\"{\n        'border-rui-primary! bg-rui-primary-subtle': isOverDropZone && !disabled && !noDrop,\n        'border-rui-error! border-solid! bg-rui-error-subtle': hasError,\n        'border-rui-success! border-solid! bg-rui-success-subtle': uploaded,\n        'opacity-60 pointer-events-none': disabled,\n      }\"\n      :data-disabled=\"disabled || undefined\"\n      :data-uploaded=\"uploaded || undefined\"\n      :data-error=\"hasError ? '' : undefined\"\n      :data-drop-active=\"isOverDropZone || undefined\"\n    >\n      <div\n        class=\"flex flex-col items-center justify-center gap-3\"\n        :class=\"{ 'opacity-0': loading }\"\n      >\n        <slot\n          name=\"preview\"\n          :files=\"files\"\n          :remove=\"() => removeFile()\"\n        >\n          <div\n            v-if=\"hasFiles\"\n            class=\"flex flex-col gap-1 w-full\"\n            data-id=\"file-list\"\n          >\n            <div\n              v-for=\"file in files\"\n              :key=\"`${file.name}-${file.lastModified}`\"\n              class=\"flex items-center gap-2 bg-rui-primary-soft dark:bg-rui-primary/20 rounded-full pl-3 pr-1 py-1\"\n              data-id=\"file-item\"\n            >\n              <RuiIcon\n                name=\"lu-file\"\n                color=\"primary\"\n                size=\"20\"\n              />\n              <div class=\"flex-1 overflow-hidden min-w-0\">\n                <div\n                  class=\"text-sm leading-5 truncate\"\n                  :title=\"file.name\"\n                >\n                  {{ file.name }}\n                </div>\n                <div class=\"text-rui-text-secondary text-xs leading-3\">\n                  {{ formatFileSize(file.size) }}\n                </div>\n              </div>\n              <button\n                type=\"button\"\n                class=\"p-1 rounded-full hover:bg-rui-hover transition focus-visible:focus-ring outline-hidden\"\n                :disabled=\"disabled\"\n                :aria-label=\"`Remove ${file.name}`\"\n                data-id=\"remove-file\"\n                @click=\"removeFile(file)\"\n              >\n                <RuiIcon\n                  name=\"lu-x\"\n                  size=\"16\"\n                />\n              </button>\n            </div>\n          </div>\n          <div\n            v-else\n            class=\"h-10 w-10 rounded-full flex items-center justify-center\"\n            :class=\"wellClasses[wellTone]\"\n            data-id=\"icon-well\"\n          >\n            <slot name=\"icon\">\n              <RuiIcon\n                :name=\"wellIcon\"\n                :color=\"wellTone\"\n              />\n            </slot>\n          </div>\n        </slot>\n\n        <div class=\"text-center text-sm\">\n          <slot name=\"description\">\n            <div class=\"flex items-center justify-center gap-1 flex-wrap\">\n              <span v-if=\"resolvedUploadText\">{{ resolvedUploadText }}</span>\n              <button\n                type=\"button\"\n                class=\"text-rui-primary underline disabled:no-underline disabled:text-rui-text-disabled\"\n                :class=\"{ 'first-letter:uppercase': !resolvedUploadText }\"\n                :disabled=\"disabled\"\n                data-id=\"open-picker\"\n                @click=\"openPicker()\"\n              >\n                {{ hasFiles ? replaceText : clickToUploadText }}\n              </button>\n            </div>\n          </slot>\n        </div>\n\n        <input\n          ref=\"input\"\n          type=\"file\"\n          :accept=\"accept\"\n          :multiple=\"multiple\"\n          :disabled=\"disabled\"\n          hidden\n          data-id=\"file-input\"\n          v-bind=\"getNonRootAttrs($attrs, ['class', 'onChange'])\"\n          @change=\"onSelect($event)\"\n        />\n      </div>\n\n      <div\n        v-if=\"loading\"\n        class=\"flex flex-col items-center justify-center absolute h-full w-full top-0 left-0 gap-2\"\n        data-id=\"loading\"\n      >\n        <RuiProgress\n          circular\n          :variant=\"progress === undefined ? 'indeterminate' : 'determinate'\"\n          :value=\"progress\"\n          color=\"primary\"\n          size=\"40\"\n        />\n        <div\n          v-if=\"progressLabel\"\n          class=\"text-xs text-rui-text-secondary\"\n          data-id=\"progress-label\"\n          v-text=\"progressLabel\"\n        />\n      </div>\n    </div>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      :error-messages=\"combinedErrorMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"RuiFileUpload.vue_vue_type_script_setup_true_lang.js","names":["$attrs","_useModel","_openBlock","_createElementBlock","_normalizeProps","_guardReactiveProps","_unref","_createElementVNode","_normalizeClass","_renderSlot","_Fragment","_renderList","_createVNode","RuiIcon","_toDisplayString","_createCommentVNode","_mergeProps","RuiProgress","_createBlock","RuiFormTextDetail"],"sources":["../../../../src/components/forms/file-upload/RuiFileUpload.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { RuiIcons } from '@/icons';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiProgress from '@/components/progress/RuiProgress.vue';\nimport { useRuiI8n } from '@/composables/use-rui-i18n';\nimport { RUI_I18N_KEYS } from '@/i18n/keys';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { formatFileSize, getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\n\nexport interface FileUploadProps {\n  /** File type filter (HTML accept attribute syntax). e.g. '.csv', 'image/*', '.png,.jpg' */\n  accept?: string;\n  /** Allow multiple file selection. */\n  multiple?: boolean;\n  disabled?: boolean;\n  /** Shows a loading overlay (consumer-driven, e.g. while uploading). */\n  loading?: boolean;\n  /** Upload progress 0-100. When provided alongside `loading`, the overlay shows a determinate progress bar with percentage. */\n  progress?: number;\n  /** Renders the success state border/icon. Consumer toggles back to false. */\n  uploaded?: boolean;\n  /** Optional max size per file in bytes; failures emit `error` and set internal error state. */\n  maxSize?: number;\n  /** External error messages (e.g. from Vuelidate). Shown via the standard form detail block. */\n  errorMessages?: string | string[];\n  /** Hint text below the dropzone. */\n  hint?: string;\n  /** Disable drag-and-drop; the dropzone becomes click-only (matches rotki.com use case). */\n  noDrop?: boolean;\n  /**\n   * Replace the default \"Drag and drop or \\{button\\}\" copy. With `noDrop` the default is empty, so only the button shows.\n   * The defaults of this and the other texts, error messages included, come from the `rui.file_upload.*` translation keys.\n   */\n  uploadText?: string;\n  /** Label shown on the inline button when no file is selected. */\n  clickToUploadText?: string;\n  /** Label shown on the inline button when one or more files are already selected. */\n  replaceText?: string;\n  /** Hide the bottom hint/error details strip. */\n  hideDetails?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiFileUpload',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<File | File[] | undefined>({ required: true });\n\nconst {\n  accept = '*',\n  multiple = false,\n  disabled = false,\n  loading = false,\n  progress = undefined,\n  uploaded = false,\n  maxSize = undefined,\n  errorMessages = [],\n  hint = '',\n  noDrop = false,\n  uploadText = undefined,\n  clickToUploadText = undefined,\n  replaceText = undefined,\n  hideDetails = false,\n} = defineProps<FileUploadProps>();\n\nconst emit = defineEmits<{\n  error: [message: string];\n}>();\n\ndefineSlots<{\n  preview?: (props: { files: File[]; remove: () => void }) => any;\n  icon?: () => any;\n  description?: () => any;\n}>();\n\nconst { t } = useRuiI8n();\n\nconst wrapper = useTemplateRef<HTMLDivElement>('wrapper');\nconst input = useTemplateRef<HTMLInputElement>('input');\nconst internalError = ref<string>('');\n\nconst files = computed<File[]>(() => {\n  const value = get(modelValue);\n  if (!value)\n    return [];\n  return Array.isArray(value) ? value : [value];\n});\n\nconst hasFiles = computed<boolean>(() => get(files).length > 0);\n\nconst progressLabel = computed<string | undefined>(() => {\n  const value = progress;\n  return value === undefined ? undefined : `${Math.round(value)}%`;\n});\n\nconst combinedErrorMessages = computed<string[]>(() => {\n  const external = Array.isArray(errorMessages) ? errorMessages : [errorMessages];\n  const internal = get(internalError);\n  return [...external.filter(Boolean), ...(internal ? [internal] : [])];\n});\n\nconst { hasError } = useFormTextDetail(combinedErrorMessages, () => []);\n\n// a click-only dropzone does not offer dragging\nconst resolvedUploadText = computed<string>(() => uploadText ?? (noDrop ? '' : t(RUI_I18N_KEYS.fileUpload.dropPrefix, 'Drag and drop or')));\nconst resolvedClickToUploadText = computed<string>(() => clickToUploadText ?? t(RUI_I18N_KEYS.fileUpload.clickToUpload, 'click to upload'));\nconst resolvedReplaceText = computed<string>(() => replaceText ?? t(RUI_I18N_KEYS.fileUpload.replace, 'replace file'));\n\ntype WellTone = 'primary' | 'error' | 'success';\n\n// the icon well follows the dropzone's state, like its border\nconst wellTone = computed<WellTone>(() => {\n  if (get(hasError))\n    return 'error';\n  if (uploaded)\n    return 'success';\n  return 'primary';\n});\n\nconst wellIcon = computed<RuiIcons>(() => {\n  const tone = get(wellTone);\n  if (tone === 'error')\n    return 'lu-circle-alert';\n  if (tone === 'success')\n    return 'lu-circle-check';\n  return 'lu-file-up';\n});\n\n// the 10% tint vanishes on a dark page, so dark doubles it\nconst wellClasses: Record<WellTone, string> = {\n  primary: 'bg-rui-primary-soft dark:bg-rui-primary/20',\n  error: 'bg-rui-error-soft dark:bg-rui-error/20',\n  success: 'bg-rui-success-soft dark:bg-rui-success/20',\n};\n\nfunction matchesAccept(file: File, acceptString: string): boolean {\n  if (!acceptString || acceptString === '*' || acceptString === '*/*')\n    return true;\n\n  const fileName = file.name.toLowerCase();\n  const fileExtension = fileName.includes('.') ? fileName.slice(fileName.lastIndexOf('.')) : '';\n  const fileType = file.type.toLowerCase();\n  const acceptTypes = acceptString.split(',').map(value => value.trim().toLowerCase()).filter(Boolean);\n\n  return acceptTypes.some((type) => {\n    if (type.startsWith('.'))\n      return type === fileExtension;\n    if (type.endsWith('/*'))\n      return fileType.startsWith(type.slice(0, -1));\n    return type === fileType;\n  });\n}\n\nfunction reportError(message: string): void {\n  set(internalError, message);\n  emit('error', message);\n}\n\nfunction clearInternalError(): void {\n  set(internalError, '');\n}\n\nfunction validate(candidates: File[]): File[] | undefined {\n  if (candidates.length === 0)\n    return undefined;\n\n  if (!multiple && candidates.length > 1) {\n    reportError(t(RUI_I18N_KEYS.fileUpload.tooMany, 'Only one file can be uploaded'));\n    return undefined;\n  }\n\n  for (const file of candidates) {\n    if (!matchesAccept(file, accept)) {\n      reportError(t(RUI_I18N_KEYS.fileUpload.wrongType, { accept }, `Only ${accept} files are allowed`));\n      return undefined;\n    }\n    if (maxSize !== undefined && file.size > maxSize) {\n      const size = formatFileSize(maxSize);\n      reportError(t(RUI_I18N_KEYS.fileUpload.tooLarge, { name: file.name, size }, `${file.name} exceeds the maximum size of ${size}`));\n      return undefined;\n    }\n  }\n\n  return candidates;\n}\n\nfunction setFiles(candidates: File[]): void {\n  const validated = validate(candidates);\n  if (!validated)\n    return;\n  clearInternalError();\n  set(modelValue, multiple ? validated : validated[0]);\n}\n\nfunction removeFile(target?: File): void {\n  clearInternalError();\n  const inputEl = get(input);\n  if (inputEl)\n    inputEl.value = '';\n\n  if (!target || !multiple) {\n    set(modelValue, multiple ? [] : undefined);\n    return;\n  }\n\n  const remaining = get(files).filter(file => file !== target);\n  set(modelValue, remaining);\n}\n\nfunction onSelect(event: Event): void {\n  const target = event.target;\n  if (!(target instanceof HTMLInputElement) || !target.files)\n    return;\n  const picked = Array.from(target.files);\n  // the model owns the selection; a cleared input fires `change` for the same file again\n  target.value = '';\n  setFiles(picked);\n}\n\nfunction onDrop(dropped: File[] | null): void {\n  if (disabled || noDrop || !dropped || dropped.length === 0)\n    return;\n  setFiles(dropped);\n}\n\nconst { isOverDropZone } = useDropZone(wrapper, {\n  onDrop,\n});\n\nfunction openPicker(): void {\n  if (disabled)\n    return;\n  get(input)?.click();\n}\n\nwatch(() => errorMessages, () => clearInternalError());\n\ndefineExpose({\n  removeFile: () => removeFile(),\n  openPicker,\n});\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <div\n      ref=\"wrapper\"\n      class=\"p-4 border border-rui-outline dark:border-rui-neutral-400 rounded-rui-panel w-full relative border-dashed transition\"\n      :class=\"{\n        'border-rui-primary! bg-rui-primary-subtle': isOverDropZone && !disabled && !noDrop,\n        'border-rui-error! border-solid! bg-rui-error-subtle': hasError,\n        'border-rui-success! border-solid! bg-rui-success-subtle': uploaded,\n        'opacity-60 pointer-events-none': disabled,\n      }\"\n      :data-disabled=\"disabled || undefined\"\n      :data-uploaded=\"uploaded || undefined\"\n      :data-error=\"hasError ? '' : undefined\"\n      :data-drop-active=\"isOverDropZone || undefined\"\n    >\n      <div\n        class=\"flex flex-col items-center justify-center gap-3\"\n        :class=\"{ 'opacity-0': loading }\"\n      >\n        <slot\n          name=\"preview\"\n          :files=\"files\"\n          :remove=\"() => removeFile()\"\n        >\n          <div\n            v-if=\"hasFiles\"\n            class=\"flex flex-col gap-1 w-full\"\n            data-id=\"file-list\"\n          >\n            <div\n              v-for=\"file in files\"\n              :key=\"`${file.name}-${file.lastModified}`\"\n              class=\"flex items-center gap-2 bg-rui-primary-soft dark:bg-rui-primary/20 rounded-full pl-3 pr-1 py-1\"\n              data-id=\"file-item\"\n            >\n              <RuiIcon\n                name=\"lu-file\"\n                color=\"primary\"\n                size=\"20\"\n              />\n              <div class=\"flex-1 overflow-hidden min-w-0\">\n                <div\n                  class=\"text-sm leading-5 truncate\"\n                  :title=\"file.name\"\n                >\n                  {{ file.name }}\n                </div>\n                <div class=\"text-rui-text-secondary text-xs leading-3\">\n                  {{ formatFileSize(file.size) }}\n                </div>\n              </div>\n              <button\n                type=\"button\"\n                class=\"p-1 rounded-full hover:bg-rui-hover transition focus-visible:focus-ring outline-hidden\"\n                :disabled=\"disabled\"\n                :aria-label=\"t(RUI_I18N_KEYS.fileUpload.remove, { name: file.name }, `Remove ${file.name}`)\"\n                data-id=\"remove-file\"\n                @click=\"removeFile(file)\"\n              >\n                <RuiIcon\n                  name=\"lu-x\"\n                  size=\"16\"\n                />\n              </button>\n            </div>\n          </div>\n          <div\n            v-else\n            class=\"h-10 w-10 rounded-full flex items-center justify-center\"\n            :class=\"wellClasses[wellTone]\"\n            data-id=\"icon-well\"\n          >\n            <slot name=\"icon\">\n              <RuiIcon\n                :name=\"wellIcon\"\n                :color=\"wellTone\"\n              />\n            </slot>\n          </div>\n        </slot>\n\n        <div class=\"text-center text-sm\">\n          <slot name=\"description\">\n            <div class=\"flex items-center justify-center gap-1 flex-wrap\">\n              <span v-if=\"resolvedUploadText\">{{ resolvedUploadText }}</span>\n              <button\n                type=\"button\"\n                class=\"text-rui-primary underline disabled:no-underline disabled:text-rui-text-disabled\"\n                :class=\"{ 'first-letter:uppercase': !resolvedUploadText }\"\n                :disabled=\"disabled\"\n                data-id=\"open-picker\"\n                @click=\"openPicker()\"\n              >\n                {{ hasFiles ? resolvedReplaceText : resolvedClickToUploadText }}\n              </button>\n            </div>\n          </slot>\n        </div>\n\n        <input\n          ref=\"input\"\n          type=\"file\"\n          :accept=\"accept\"\n          :multiple=\"multiple\"\n          :disabled=\"disabled\"\n          hidden\n          data-id=\"file-input\"\n          v-bind=\"getNonRootAttrs($attrs, ['class', 'onChange'])\"\n          @change=\"onSelect($event)\"\n        />\n      </div>\n\n      <div\n        v-if=\"loading\"\n        class=\"flex flex-col items-center justify-center absolute h-full w-full top-0 left-0 gap-2\"\n        data-id=\"loading\"\n      >\n        <RuiProgress\n          circular\n          :variant=\"progress === undefined ? 'indeterminate' : 'determinate'\"\n          :value=\"progress\"\n          color=\"primary\"\n          size=\"40\"\n        />\n        <div\n          v-if=\"progressLabel\"\n          class=\"text-xs text-rui-text-secondary\"\n          data-id=\"progress-label\"\n          v-text=\"progressLabel\"\n        />\n      </div>\n    </div>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      :error-messages=\"combinedErrorMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/forms/radio-button/radio/RuiRadio.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiRadio.js","names":[],"sources":["../../../../../src/components/forms/radio-button/radio/RuiRadio.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue\">\nimport type { ContextColorsType } from '@/consts/colors';\nimport { checkControlStyles } from '@/components/forms/check-control-styles';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\n\nexport interface RadioProps<TValue> {\n  value: TValue;\n  disabled?: boolean;\n  color?: ContextColorsType;\n  size?: 'sm' | 'lg';\n  label?: string;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiRadio',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue>({ required: false });\n\nconst {\n  value,\n  disabled = false,\n  color,\n  size,\n  label = '',\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  required = false,\n} = defineProps<RadioProps<TValue>>();\n\ndefineSlots<{\n  default?: () => any;\n}>();\n\nconst { hasError, validation } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\nconst selected = computed<boolean>(() => get(modelValue) === value);\n\nconst ui = computed<ReturnType<typeof checkControlStyles>>(() => checkControlStyles({\n  size,\n  shape: 'round',\n  disabled,\n  checked: get(selected),\n  validation: get(validation),\n  color: color ?? 'grey',\n}));\n\nfunction input(event: Event): void {\n  const target = event.target;\n  if (target instanceof HTMLInputElement && target.checked)\n    set(modelValue, value);\n}\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <label\n      :class=\"ui.wrapper()\"\n      :data-disabled=\"disabled || undefined\"\n      :data-checked=\"selected || undefined\"\n      :data-error=\"hasError ? '' : undefined\"\n    >\n      <input\n        :checked=\"selected\"\n        type=\"radio\"\n        :class=\"ui.input()\"\n        :disabled=\"disabled\"\n        :aria-invalid=\"hasError\"\n        v-bind=\"getNonRootAttrs($attrs)\"\n        :value=\"value\"\n        @input=\"input($event)\"\n      />\n      <div :class=\"ui.control()\">\n        <span\n          :class=\"ui.mark()\"\n          data-mark\n          :data-state=\"selected ? 'checked' : 'unchecked'\"\n        >\n          <span\n            v-if=\"selected\"\n            :class=\"ui.dot()\"\n          />\n        </span>\n      </div>\n      <div\n        v-if=\"label || $slots.default\"\n        :class=\"ui.label()\"\n      >\n        <slot>{{ label }}</slot>\n        <span\n          v-if=\"required\"\n          class=\"text-rui-error\"\n        >\n          *\n        </span>\n      </div>\n    </label>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      :error-messages=\"errorMessages\"\n      :success-messages=\"successMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiRadio.js","names":["_sfc_main"],"sources":["../../../../../src/components/forms/radio-button/radio/RuiRadio.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue\">\nimport type { ContextColorsType } from '@/consts/colors';\nimport { checkControlStyles } from '@/components/forms/check-control-styles';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\n\nexport interface RadioProps<TValue> {\n  value: TValue;\n  disabled?: boolean;\n  color?: ContextColorsType;\n  size?: 'sm' | 'lg';\n  label?: string;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiRadio',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue>({ required: false });\n\nconst {\n  value,\n  disabled = false,\n  color,\n  size,\n  label = '',\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  required = false,\n} = defineProps<RadioProps<TValue>>();\n\ndefineSlots<{\n  default?: () => any;\n}>();\n\nconst { hasError, validation } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\nconst selected = computed<boolean>(() => get(modelValue) === value);\n\nconst ui = computed<ReturnType<typeof checkControlStyles>>(() => checkControlStyles({\n  size,\n  shape: 'round',\n  disabled,\n  checked: get(selected),\n  validation: get(validation),\n  color: color ?? 'grey',\n}));\n\nfunction input(event: Event): void {\n  const target = event.target;\n  if (target instanceof HTMLInputElement && target.checked)\n    set(modelValue, value);\n}\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <label\n      :class=\"ui.wrapper()\"\n      :data-disabled=\"disabled || undefined\"\n      :data-checked=\"selected || undefined\"\n      :data-error=\"hasError ? '' : undefined\"\n    >\n      <input\n        :checked=\"selected\"\n        type=\"radio\"\n        :class=\"ui.input()\"\n        :disabled=\"disabled\"\n        :aria-invalid=\"hasError\"\n        v-bind=\"getNonRootAttrs($attrs)\"\n        :value=\"value\"\n        @input=\"input($event)\"\n      />\n      <div :class=\"ui.control()\">\n        <span\n          :class=\"ui.mark()\"\n          data-mark\n          :data-state=\"selected ? 'checked' : 'unchecked'\"\n        >\n          <span\n            v-if=\"selected\"\n            :class=\"ui.dot()\"\n          />\n        </span>\n      </div>\n      <div\n        v-if=\"label || $slots.default\"\n        :class=\"ui.label()\"\n      >\n        <slot>{{ label }}</slot>\n        <span\n          v-if=\"required\"\n          class=\"text-rui-error\"\n        >\n          *\n        </span>\n      </div>\n    </label>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      :error-messages=\"errorMessages\"\n      :success-messages=\"successMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/forms/radio-button/radio/RuiRadio.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiRadio.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$slots"],"sources":["../../../../../src/components/forms/radio-button/radio/RuiRadio.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue\">\nimport type { ContextColorsType } from '@/consts/colors';\nimport { checkControlStyles } from '@/components/forms/check-control-styles';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\n\nexport interface RadioProps<TValue> {\n  value: TValue;\n  disabled?: boolean;\n  color?: ContextColorsType;\n  size?: 'sm' | 'lg';\n  label?: string;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiRadio',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue>({ required: false });\n\nconst {\n  value,\n  disabled = false,\n  color,\n  size,\n  label = '',\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  required = false,\n} = defineProps<RadioProps<TValue>>();\n\ndefineSlots<{\n  default?: () => any;\n}>();\n\nconst { hasError, validation } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\nconst selected = computed<boolean>(() => get(modelValue) === value);\n\nconst ui = computed<ReturnType<typeof checkControlStyles>>(() => checkControlStyles({\n  size,\n  shape: 'round',\n  disabled,\n  checked: get(selected),\n  validation: get(validation),\n  color: color ?? 'grey',\n}));\n\nfunction input(event: Event): void {\n  const target = event.target;\n  if (target instanceof HTMLInputElement && target.checked)\n    set(modelValue, value);\n}\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <label\n      :class=\"ui.wrapper()\"\n      :data-disabled=\"disabled || undefined\"\n      :data-checked=\"selected || undefined\"\n      :data-error=\"hasError ? '' : undefined\"\n    >\n      <input\n        :checked=\"selected\"\n        type=\"radio\"\n        :class=\"ui.input()\"\n        :disabled=\"disabled\"\n        :aria-invalid=\"hasError\"\n        v-bind=\"getNonRootAttrs($attrs)\"\n        :value=\"value\"\n        @input=\"input($event)\"\n      />\n      <div :class=\"ui.control()\">\n        <span\n          :class=\"ui.mark()\"\n          data-mark\n          :data-state=\"selected ? 'checked' : 'unchecked'\"\n        >\n          <span\n            v-if=\"selected\"\n            :class=\"ui.dot()\"\n          />\n        </span>\n      </div>\n      <div\n        v-if=\"label || $slots.default\"\n        :class=\"ui.label()\"\n      >\n        <slot>{{ label }}</slot>\n        <span\n          v-if=\"required\"\n          class=\"text-rui-error\"\n        >\n          *\n        </span>\n      </div>\n    </label>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      :error-messages=\"errorMessages\"\n      :success-messages=\"successMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyBA,MAAM,aAAa,SAAmB,SAAA,YAAoB;EAmB1D,MAAM,EAAE,UAAU,eAAe,wBACzB,QAAA,qBACA,QAAA,eACR;EAEA,MAAM,WAAW,eAAwB,IAAI,UAAU,MAAM,QAAA,KAAK;EAElE,MAAM,KAAK,eAAsD,mBAAmB;GAClF,MAAG,QAAA;GACH,OAAO;GACP,UAAO,QAAA;GACP,SAAS,IAAI,QAAQ;GACrB,YAAY,IAAI,UAAU;GAC1B,OAAO,QAAA,SAAS;EAClB,CAAC,CAAC;EAEF,SAAS,MAAM,OAAoB;GACjC,MAAM,SAAS,MAAM;GACrB,IAAI,kBAAkB,oBAAoB,OAAO,SAC/C,IAAI,YAAY,QAAA,KAAK;EACzB;;GAIE,OAAA,UAAA,GAAA,mBAgDM,OAAA,eAAA,mBAhDO,MAAA,YAAA,CAAY,CAACA,KAAAA,MAAM,CAAA,CAAA,GAAA,CAC9B,mBAwCQ,SAAA;IAvCL,OAAK,eAAE,MAAA,EAAA,CAAE,CAAC,QAAO,CAAA;IACjB,iBAAe,QAAA,YAAY,KAAA;IAC3B,gBAAc,MAAA,QAAA,KAAY,KAAA;IAC1B,cAAY,MAAA,QAAA,IAAQ,KAAQ,KAAA;;IAE7B,mBASE,SATF,WASE;KARC,SAAS,MAAA,QAAA;KACV,MAAK;KACJ,OAAO,MAAA,EAAA,CAAE,CAAC,MAAK;KACf,UAAU,QAAA;KACV,gBAAc,MAAA,QAAA;IACP,GAAA,MAAA,eAAA,CAAe,CAACA,KAAAA,MAAM,GAAA;KAC7B,OAAO,QAAA;KACP,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,MAAM,MAAM;;IAEtB,mBAWM,OAAA,EAXA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAC,QAAO,CAAA,EAAA,GAAA,CACrB,mBASO,QAAA;KARJ,OAAK,eAAE,MAAA,EAAA,CAAE,CAAC,KAAI,CAAA;KACf,aAAA;KACC,cAAY,MAAA,QAAA,IAAQ,YAAA;IAGb,GAAA,CAAA,MAAA,QAAA,KADR,UAAA,GAAA,mBAGE,QAAA;;KADC,OAAK,eAAE,MAAA,EAAA,CAAE,CAAC,IAAG,CAAA;;IAKZ,QAAA,SAASC,KAAAA,OAAO,WADxB,UAAA,GAAA,mBAWM,OAAA;;KATH,OAAK,eAAE,MAAA,EAAA,CAAE,CAAC,MAAK,CAAA;IAEhB,GAAA,CAAA,WAAwB,KAAA,QAAA,WAAA,CAAA,SAAA,CAAf,gBAAA,gBAAA,QAAA,KAAK,GAAA,CAAA,CAAA,CAAA,GAEN,QAAA,YADR,UAAA,GAAA,mBAKO,QALP,YAGC,KAED,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA;GAIK,GAAA,IAAA,UAAA,GAAA,CAAA,QAAA,eADT,UAAA,GAAA,YAKE,2BAAA;;IAHC,kBAAgB,QAAA;IAChB,oBAAkB,QAAA;IAClB,MAAM,QAAA"}
+{"version":3,"file":"RuiRadio.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$slots","_useModel","_openBlock","_createElementBlock","_normalizeProps","_guardReactiveProps","_unref","_createElementVNode","_normalizeClass","_mergeProps","_createCommentVNode","_renderSlot","_createTextVNode","_toDisplayString","_createBlock","RuiFormTextDetail"],"sources":["../../../../../src/components/forms/radio-button/radio/RuiRadio.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue\">\nimport type { ContextColorsType } from '@/consts/colors';\nimport { checkControlStyles } from '@/components/forms/check-control-styles';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\n\nexport interface RadioProps<TValue> {\n  value: TValue;\n  disabled?: boolean;\n  color?: ContextColorsType;\n  size?: 'sm' | 'lg';\n  label?: string;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiRadio',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue>({ required: false });\n\nconst {\n  value,\n  disabled = false,\n  color,\n  size,\n  label = '',\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  required = false,\n} = defineProps<RadioProps<TValue>>();\n\ndefineSlots<{\n  default?: () => any;\n}>();\n\nconst { hasError, validation } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\nconst selected = computed<boolean>(() => get(modelValue) === value);\n\nconst ui = computed<ReturnType<typeof checkControlStyles>>(() => checkControlStyles({\n  size,\n  shape: 'round',\n  disabled,\n  checked: get(selected),\n  validation: get(validation),\n  color: color ?? 'grey',\n}));\n\nfunction input(event: Event): void {\n  const target = event.target;\n  if (target instanceof HTMLInputElement && target.checked)\n    set(modelValue, value);\n}\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <label\n      :class=\"ui.wrapper()\"\n      :data-disabled=\"disabled || undefined\"\n      :data-checked=\"selected || undefined\"\n      :data-error=\"hasError ? '' : undefined\"\n    >\n      <input\n        :checked=\"selected\"\n        type=\"radio\"\n        :class=\"ui.input()\"\n        :disabled=\"disabled\"\n        :aria-invalid=\"hasError\"\n        v-bind=\"getNonRootAttrs($attrs)\"\n        :value=\"value\"\n        @input=\"input($event)\"\n      />\n      <div :class=\"ui.control()\">\n        <span\n          :class=\"ui.mark()\"\n          data-mark\n          :data-state=\"selected ? 'checked' : 'unchecked'\"\n        >\n          <span\n            v-if=\"selected\"\n            :class=\"ui.dot()\"\n          />\n        </span>\n      </div>\n      <div\n        v-if=\"label || $slots.default\"\n        :class=\"ui.label()\"\n      >\n        <slot>{{ label }}</slot>\n        <span\n          v-if=\"required\"\n          class=\"text-rui-error\"\n        >\n          *\n        </span>\n      </div>\n    </label>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      :error-messages=\"errorMessages\"\n      :success-messages=\"successMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyBA,MAAM,aAAaE,SAAmB,SAAA,YAAoB;EAmB1D,MAAM,EAAE,UAAU,eAAe,wBACzB,QAAA,qBACA,QAAA,eACR;EAEA,MAAM,WAAW,eAAwB,IAAI,UAAU,MAAM,QAAA,KAAK;EAElE,MAAM,KAAK,eAAsD,mBAAmB;GAClF,MAAG,QAAA;GACH,OAAO;GACP,UAAO,QAAA;GACP,SAAS,IAAI,QAAQ;GACrB,YAAY,IAAI,UAAU;GAC1B,OAAO,QAAA,SAAS;EAClB,CAAC,CAAC;EAEF,SAAS,MAAM,OAAoB;GACjC,MAAM,SAAS,MAAM;GACrB,IAAI,kBAAkB,oBAAoB,OAAO,SAC/C,IAAI,YAAY,QAAA,KAAK;EACzB;;GAIE,OAAAC,UAAA,GAAAC,mBAgDM,OAAAC,eAAAC,mBAhDOC,MAAA,YAAA,CAAY,CAACP,KAAAA,MAAM,CAAA,CAAA,GAAA,CAC9BQ,mBAwCQ,SAAA;IAvCL,OAAKC,eAAEF,MAAA,EAAA,CAAE,CAAC,QAAO,CAAA;IACjB,iBAAe,QAAA,YAAY,KAAA;IAC3B,gBAAcA,MAAA,QAAA,KAAY,KAAA;IAC1B,cAAYA,MAAA,QAAA,IAAQ,KAAQ,KAAA;;IAE7BC,mBASE,SATFE,WASE;KARC,SAASH,MAAA,QAAA;KACV,MAAK;KACJ,OAAOA,MAAA,EAAA,CAAE,CAAC,MAAK;KACf,UAAU,QAAA;KACV,gBAAcA,MAAA,QAAA;IACP,GAAAA,MAAA,eAAA,CAAe,CAACP,KAAAA,MAAM,GAAA;KAC7B,OAAO,QAAA;KACP,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,MAAM,MAAM;;IAEtBQ,mBAWM,OAAA,EAXA,OAAKC,eAAEF,MAAA,EAAA,CAAE,CAAC,QAAO,CAAA,EAAA,GAAA,CACrBC,mBASO,QAAA;KARJ,OAAKC,eAAEF,MAAA,EAAA,CAAE,CAAC,KAAI,CAAA;KACf,aAAA;KACC,cAAYA,MAAA,QAAA,IAAQ,YAAA;IAGbA,GAAAA,CAAAA,MAAA,QAAA,KADRJ,UAAA,GAAAC,mBAGE,QAAA;;KADC,OAAKK,eAAEF,MAAA,EAAA,CAAE,CAAC,IAAG,CAAA;;IAKZ,QAAA,SAASN,KAAAA,OAAO,WADxBE,UAAA,GAAAC,mBAWM,OAAA;;KATH,OAAKK,eAAEF,MAAA,EAAA,CAAE,CAAC,MAAK,CAAA;IAEhBK,GAAAA,CAAAA,WAAwB,KAAA,QAAA,WAAA,CAAA,SAAA,CAAfC,gBAAAC,gBAAA,QAAA,KAAK,GAAA,CAAA,CAAA,CAAA,GAEN,QAAA,YADRX,UAAA,GAAAC,mBAKO,QALP,YAGC,KAED,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA;GAIK,GAAA,IAAA,UAAA,GAAA,CAAA,QAAA,eADTD,UAAA,GAAAY,YAKEC,2BAAA;;IAHC,kBAAgB,QAAA;IAChB,oBAAkB,QAAA;IAClB,MAAM,QAAA"}

package/dist/components/forms/radio-button/radio-group/RuiRadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiRadioGroup.js","names":[],"sources":["../../../../../src/components/forms/radio-button/radio-group/RuiRadioGroup.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue\">\nimport type { ContextColorsType } from '@/consts/colors';\nimport { Fragment, isVNode } from 'vue';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport { assert } from '@/utils/assert';\n\nexport interface Props {\n  inline?: boolean;\n  label?: string;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  disabled?: boolean;\n  color?: ContextColorsType;\n  size?: 'sm' | 'lg';\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiRadioGroup',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue>({ required: false });\n\nconst {\n  inline = false,\n  label = '',\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  disabled = false,\n  color,\n  size,\n  required = false,\n} = defineProps<Props>();\n\nconst slots = defineSlots<{\n  default?: () => any;\n}>();\n\nconst radioGroupName = useId();\n\nconst children = computed<VNode[]>(() => {\n  const slotContent = slots.default?.() ?? [];\n\n  // A `v-for` in the slot arrives as a single fragment holding the children\n  if (slotContent.length === 1) {\n    const firstChild = slotContent[0];\n    assert(firstChild);\n    if (firstChild.type === Fragment) {\n      return Array.isArray(firstChild.children) ? firstChild.children.filter(isVNode) : [];\n    }\n  }\n  return slotContent;\n});\n</script>\n\n<template>\n  <div\n    role=\"radiogroup\"\n    v-bind=\"$attrs\"\n  >\n    <div\n      v-if=\"label\"\n      class=\"text-rui-text text-sm/5 font-medium\"\n    >\n      {{ label }}\n      <span\n        v-if=\"required\"\n        class=\"text-rui-error\"\n      >\n        *\n      </span>\n    </div>\n    <div :class=\"{ 'flex between:ml-6 between:mr-0': inline }\">\n      <Component\n        :is=\"child\"\n        v-for=\"(child, i) in children\"\n        :key=\"i\"\n        v-model=\"modelValue\"\n        :disabled=\"disabled\"\n        :color=\"color\"\n        :size=\"size\"\n        hide-details\n        :name=\"radioGroupName\"\n      />\n    </div>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      :error-messages=\"errorMessages\"\n      :success-messages=\"successMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiRadioGroup.js","names":["_sfc_main"],"sources":["../../../../../src/components/forms/radio-button/radio-group/RuiRadioGroup.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue\">\nimport type { ContextColorsType } from '@/consts/colors';\nimport { Fragment, isVNode } from 'vue';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport { assert } from '@/utils/assert';\n\nexport interface Props {\n  inline?: boolean;\n  label?: string;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  disabled?: boolean;\n  color?: ContextColorsType;\n  size?: 'sm' | 'lg';\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiRadioGroup',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue>({ required: false });\n\nconst {\n  inline = false,\n  label = '',\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  disabled = false,\n  color,\n  size,\n  required = false,\n} = defineProps<Props>();\n\nconst slots = defineSlots<{\n  default?: () => any;\n}>();\n\nconst radioGroupName = useId();\n\nconst children = computed<VNode[]>(() => {\n  const slotContent = slots.default?.() ?? [];\n\n  // A `v-for` in the slot arrives as a single fragment holding the children\n  if (slotContent.length === 1) {\n    const firstChild = slotContent[0];\n    assert(firstChild);\n    if (firstChild.type === Fragment) {\n      return Array.isArray(firstChild.children) ? firstChild.children.filter(isVNode) : [];\n    }\n  }\n  return slotContent;\n});\n</script>\n\n<template>\n  <div\n    role=\"radiogroup\"\n    v-bind=\"$attrs\"\n  >\n    <div\n      v-if=\"label\"\n      class=\"text-rui-text text-sm/5 font-medium\"\n    >\n      {{ label }}\n      <span\n        v-if=\"required\"\n        class=\"text-rui-error\"\n      >\n        *\n      </span>\n    </div>\n    <div :class=\"{ 'flex between:ml-6 between:mr-0': inline }\">\n      <Component\n        :is=\"child\"\n        v-for=\"(child, i) in children\"\n        :key=\"i\"\n        v-model=\"modelValue\"\n        :disabled=\"disabled\"\n        :color=\"color\"\n        :size=\"size\"\n        hide-details\n        :name=\"radioGroupName\"\n      />\n    </div>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      :error-messages=\"errorMessages\"\n      :success-messages=\"successMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/forms/radio-button/radio-group/RuiRadioGroup.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiRadioGroup.vue_vue_type_script_setup_true_lang.js","names":["$attrs"],"sources":["../../../../../src/components/forms/radio-button/radio-group/RuiRadioGroup.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue\">\nimport type { ContextColorsType } from '@/consts/colors';\nimport { Fragment, isVNode } from 'vue';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport { assert } from '@/utils/assert';\n\nexport interface Props {\n  inline?: boolean;\n  label?: string;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  disabled?: boolean;\n  color?: ContextColorsType;\n  size?: 'sm' | 'lg';\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiRadioGroup',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue>({ required: false });\n\nconst {\n  inline = false,\n  label = '',\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  disabled = false,\n  color,\n  size,\n  required = false,\n} = defineProps<Props>();\n\nconst slots = defineSlots<{\n  default?: () => any;\n}>();\n\nconst radioGroupName = useId();\n\nconst children = computed<VNode[]>(() => {\n  const slotContent = slots.default?.() ?? [];\n\n  // A `v-for` in the slot arrives as a single fragment holding the children\n  if (slotContent.length === 1) {\n    const firstChild = slotContent[0];\n    assert(firstChild);\n    if (firstChild.type === Fragment) {\n      return Array.isArray(firstChild.children) ? firstChild.children.filter(isVNode) : [];\n    }\n  }\n  return slotContent;\n});\n</script>\n\n<template>\n  <div\n    role=\"radiogroup\"\n    v-bind=\"$attrs\"\n  >\n    <div\n      v-if=\"label\"\n      class=\"text-rui-text text-sm/5 font-medium\"\n    >\n      {{ label }}\n      <span\n        v-if=\"required\"\n        class=\"text-rui-error\"\n      >\n        *\n      </span>\n    </div>\n    <div :class=\"{ 'flex between:ml-6 between:mr-0': inline }\">\n      <Component\n        :is=\"child\"\n        v-for=\"(child, i) in children\"\n        :key=\"i\"\n        v-model=\"modelValue\"\n        :disabled=\"disabled\"\n        :color=\"color\"\n        :size=\"size\"\n        hide-details\n        :name=\"radioGroupName\"\n      />\n    </div>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      :error-messages=\"errorMessages\"\n      :success-messages=\"successMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAwBA,MAAM,aAAa,SAAmB,SAAA,YAAoB;EAe1D,MAAM,QAAQ,SAAA;EAId,MAAM,iBAAiB,MAAM;EAE7B,MAAM,WAAW,eAAwB;GACvC,MAAM,cAAc,MAAM,UAAU,KAAK,CAAC;GAG1C,IAAI,YAAY,WAAW,GAAG;IAC5B,MAAM,aAAa,YAAY;IAC/B,OAAO,UAAU;IACjB,IAAI,WAAW,SAAS,UACtB,OAAO,MAAM,QAAQ,WAAW,QAAQ,IAAI,WAAW,SAAS,OAAO,OAAO,IAAI,CAAC;GAEvF;GACA,OAAO;EACT,CAAC;;GAIC,OAAA,UAAA,GAAA,mBAmCM,OAnCN,WAmCM,EAlCJ,MAAK,aAAY,GACTA,KAAAA,MAAM,GAAA;IAGN,QAAA,SADR,UAAA,GAAA,mBAWM,OAXN,YAWM,CAPD,gBAAA,gBAAA,QAAA,KAAK,IAAG,KACX,CAAA,GACQ,QAAA,YADR,UAAA,GAAA,mBAKO,QALP,YAGC,KAED,KAAA,mBAAA,IAAA,IAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA;IAEF,mBAYM,OAAA,EAZA,OAAK,eAAA,EAAA,kCAAsC,QAAA,OAAM,CAAA,EAAA,GAAA,EACrD,UAAA,IAAA,GAAA,mBAUE,UAAA,MAAA,WARqB,MAAA,QAAA,IAAb,OAAO,MAAC;KAFlB,OAAA,UAAA,GAAA,YAUE,wBATK,KAAK,GAAA;MAET,KAAK;MACG,YAAA,WAAA;MAAA,uBAAA,OAAA,OAAA,OAAA,MAAA,WAAA,WAAU,QAAA;MAClB,UAAU,QAAA;MACV,OAAO,QAAA;MACP,MAAM,QAAA;MACP,gBAAA;MACC,MAAM,MAAA,cAAA;;;;;;;;;IAIF,CAAA,QAAA,eADT,UAAA,GAAA,YAKE,2BAAA;;KAHC,kBAAgB,QAAA;KAChB,oBAAkB,QAAA;KAClB,MAAM,QAAA"}
+{"version":3,"file":"RuiRadioGroup.vue_vue_type_script_setup_true_lang.js","names":["$attrs","_useModel","_useSlots","_openBlock","_createElementBlock","_mergeProps","_createTextVNode","_toDisplayString","_createCommentVNode","_createElementVNode","_normalizeClass","_Fragment","_renderList","_unref","_createBlock","_resolveDynamicComponent","RuiFormTextDetail"],"sources":["../../../../../src/components/forms/radio-button/radio-group/RuiRadioGroup.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue\">\nimport type { ContextColorsType } from '@/consts/colors';\nimport { Fragment, isVNode } from 'vue';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport { assert } from '@/utils/assert';\n\nexport interface Props {\n  inline?: boolean;\n  label?: string;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  disabled?: boolean;\n  color?: ContextColorsType;\n  size?: 'sm' | 'lg';\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiRadioGroup',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue>({ required: false });\n\nconst {\n  inline = false,\n  label = '',\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  disabled = false,\n  color,\n  size,\n  required = false,\n} = defineProps<Props>();\n\nconst slots = defineSlots<{\n  default?: () => any;\n}>();\n\nconst radioGroupName = useId();\n\nconst children = computed<VNode[]>(() => {\n  const slotContent = slots.default?.() ?? [];\n\n  // A `v-for` in the slot arrives as a single fragment holding the children\n  if (slotContent.length === 1) {\n    const firstChild = slotContent[0];\n    assert(firstChild);\n    if (firstChild.type === Fragment) {\n      return Array.isArray(firstChild.children) ? firstChild.children.filter(isVNode) : [];\n    }\n  }\n  return slotContent;\n});\n</script>\n\n<template>\n  <div\n    role=\"radiogroup\"\n    v-bind=\"$attrs\"\n  >\n    <div\n      v-if=\"label\"\n      class=\"text-rui-text text-sm/5 font-medium\"\n    >\n      {{ label }}\n      <span\n        v-if=\"required\"\n        class=\"text-rui-error\"\n      >\n        *\n      </span>\n    </div>\n    <div :class=\"{ 'flex between:ml-6 between:mr-0': inline }\">\n      <Component\n        :is=\"child\"\n        v-for=\"(child, i) in children\"\n        :key=\"i\"\n        v-model=\"modelValue\"\n        :disabled=\"disabled\"\n        :color=\"color\"\n        :size=\"size\"\n        hide-details\n        :name=\"radioGroupName\"\n      />\n    </div>\n    <RuiFormTextDetail\n      v-if=\"!hideDetails\"\n      :error-messages=\"errorMessages\"\n      :success-messages=\"successMessages\"\n      :hint=\"hint\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAwBA,MAAM,aAAaC,SAAmB,SAAA,YAAoB;EAe1D,MAAM,QAAQC,SAAA;EAId,MAAM,iBAAiB,MAAM;EAE7B,MAAM,WAAW,eAAwB;GACvC,MAAM,cAAc,MAAM,UAAU,KAAK,CAAC;GAG1C,IAAI,YAAY,WAAW,GAAG;IAC5B,MAAM,aAAa,YAAY;IAC/B,OAAO,UAAU;IACjB,IAAI,WAAW,SAAS,UACtB,OAAO,MAAM,QAAQ,WAAW,QAAQ,IAAI,WAAW,SAAS,OAAO,OAAO,IAAI,CAAC;GAEvF;GACA,OAAO;EACT,CAAC;;GAIC,OAAAC,UAAA,GAAAC,mBAmCM,OAnCNC,WAmCM,EAlCJ,MAAK,aAAY,GACTL,KAAAA,MAAM,GAAA;IAGN,QAAA,SADRG,UAAA,GAAAC,mBAWM,OAXN,YAWM,CAPDE,gBAAAC,gBAAA,QAAA,KAAK,IAAG,KACX,CAAA,GACQ,QAAA,YADRJ,UAAA,GAAAC,mBAKO,QALP,YAGC,KAED,KAAA,mBAAA,IAAA,IAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA;IAEFK,mBAYM,OAAA,EAZA,OAAKC,eAAA,EAAA,kCAAsC,QAAA,OAAM,CAAA,EAAA,GAAA,EACrDP,UAAA,IAAA,GAAAC,mBAUEO,UAAA,MAAAC,WARqBC,MAAA,QAAA,IAAb,OAAO,MAAC;KAFlB,OAAAV,UAAA,GAAAW,YAUEC,wBATK,KAAK,GAAA;MAET,KAAK;MACG,YAAA,WAAA;MAAA,uBAAA,OAAA,OAAA,OAAA,MAAA,WAAA,WAAU,QAAA;MAClB,UAAU,QAAA;MACV,OAAO,QAAA;MACP,MAAM,QAAA;MACP,gBAAA;MACC,MAAMF,MAAA,cAAA;;;;;;;;;IAIF,CAAA,QAAA,eADTV,UAAA,GAAAW,YAKEE,2BAAA;;KAHC,kBAAgB,QAAA;KAChB,oBAAkB,QAAA;KAClB,MAAM,QAAA"}

package/dist/components/forms/revealable-text-field/RuiRevealableTextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiRevealableTextField.js","names":[],"sources":["../../../../src/components/forms/revealable-text-field/RuiRevealableTextField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiTextField, { type TextFieldProps } from '@/components/forms/text-field/RuiTextField.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\n\nexport interface Props extends TextFieldProps {}\n\ndefineOptions({\n  name: 'RuiRevealableTextField',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<string>({ required: true });\n\nconst {\n  label = '',\n  placeholder = '',\n  disabled = false,\n  labelPlacement = undefined,\n  dense = false,\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  readonly = false,\n  clearable = false,\n  required = false,\n} = defineProps<Props>();\n\ndefineSlots<{\n  prepend?: () => any;\n  append?: () => any;\n}>();\n\nconst hidden = ref<boolean>(true);\n</script>\n\n<template>\n  <RuiTextField\n    v-bind=\"$attrs\"\n    v-model=\"modelValue\"\n    :label=\"label\"\n    :placeholder=\"placeholder\"\n    :disabled=\"disabled\"\n    :label-placement=\"labelPlacement\"\n    :dense=\"dense\"\n    :hint=\"hint\"\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hide-details=\"hideDetails\"\n    :readonly=\"readonly\"\n    :clearable=\"clearable\"\n    :required=\"required\"\n    :type=\"hidden ? 'password' : 'text'\"\n  >\n    <template\n      v-if=\"$slots.prepend\"\n      #prepend\n    >\n      <slot name=\"prepend\" />\n    </template>\n    <template #append>\n      <div class=\"flex items-center\">\n        <RuiButton\n          :disabled=\"disabled\"\n          :aria-label=\"hidden ? 'Show password' : 'Hide password'\"\n          tabindex=\"-1\"\n          variant=\"text\"\n          type=\"button\"\n          icon\n          data-id=\"toggle-visibility\"\n          class=\"-mr-1 p-1!\"\n          @click=\"hidden = !hidden\"\n        >\n          <!--\n            24px round the field's 16px glyph, so the focus ring and its offset stay inside even the 32px\n            dense field; the muted tone of the other field icons\n          -->\n          <RuiIcon\n            class=\"text-rui-neutral-500 dark:text-rui-neutral-400\"\n            size=\"16\"\n            :name=\"hidden ? 'lu-eye-off' : 'lu-eye'\"\n          />\n        </RuiButton>\n\n        <slot name=\"append\" />\n      </div>\n    </template>\n  </RuiTextField>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiRevealableTextField.js","names":["_sfc_main"],"sources":["../../../../src/components/forms/revealable-text-field/RuiRevealableTextField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiTextField, { type TextFieldProps } from '@/components/forms/text-field/RuiTextField.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\n\nexport interface Props extends TextFieldProps {}\n\ndefineOptions({\n  name: 'RuiRevealableTextField',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<string>({ required: true });\n\nconst {\n  label = '',\n  placeholder = '',\n  disabled = false,\n  labelPlacement = undefined,\n  dense = false,\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  readonly = false,\n  clearable = false,\n  required = false,\n} = defineProps<Props>();\n\ndefineSlots<{\n  prepend?: () => any;\n  append?: () => any;\n}>();\n\nconst hidden = ref<boolean>(true);\n</script>\n\n<template>\n  <RuiTextField\n    v-bind=\"$attrs\"\n    v-model=\"modelValue\"\n    :label=\"label\"\n    :placeholder=\"placeholder\"\n    :disabled=\"disabled\"\n    :label-placement=\"labelPlacement\"\n    :dense=\"dense\"\n    :hint=\"hint\"\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hide-details=\"hideDetails\"\n    :readonly=\"readonly\"\n    :clearable=\"clearable\"\n    :required=\"required\"\n    :type=\"hidden ? 'password' : 'text'\"\n  >\n    <template\n      v-if=\"$slots.prepend\"\n      #prepend\n    >\n      <slot name=\"prepend\" />\n    </template>\n    <template #append>\n      <div class=\"flex items-center\">\n        <RuiButton\n          :disabled=\"disabled\"\n          :aria-label=\"hidden ? 'Show password' : 'Hide password'\"\n          tabindex=\"-1\"\n          variant=\"text\"\n          type=\"button\"\n          icon\n          data-id=\"toggle-visibility\"\n          class=\"-mr-1 p-1!\"\n          @click=\"hidden = !hidden\"\n        >\n          <!--\n            24px round the field's 16px glyph, so the focus ring and its offset stay inside even the 32px\n            dense field; the muted tone of the other field icons\n          -->\n          <RuiIcon\n            class=\"text-rui-neutral-500 dark:text-rui-neutral-400\"\n            size=\"16\"\n            :name=\"hidden ? 'lu-eye-off' : 'lu-eye'\"\n          />\n        </RuiButton>\n\n        <slot name=\"append\" />\n      </div>\n    </template>\n  </RuiTextField>\n</template>\n"],"mappings":""}

package/dist/components/forms/revealable-text-field/RuiRevealableTextField.vue.d.ts

@@ -1,4 +1,4 @@
-import { type TextFieldProps } from '../text-field/RuiTextField.vue';
+import { type TextFieldProps } from '../text-field/RuiTextField.vue.js';
 export interface Props extends TextFieldProps {
 }
 type __VLS_Props = Props;

package/dist/components/forms/revealable-text-field/RuiRevealableTextField.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiRevealableTextField.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$slots"],"sources":["../../../../src/components/forms/revealable-text-field/RuiRevealableTextField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiTextField, { type TextFieldProps } from '@/components/forms/text-field/RuiTextField.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\n\nexport interface Props extends TextFieldProps {}\n\ndefineOptions({\n  name: 'RuiRevealableTextField',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<string>({ required: true });\n\nconst {\n  label = '',\n  placeholder = '',\n  disabled = false,\n  labelPlacement = undefined,\n  dense = false,\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  readonly = false,\n  clearable = false,\n  required = false,\n} = defineProps<Props>();\n\ndefineSlots<{\n  prepend?: () => any;\n  append?: () => any;\n}>();\n\nconst hidden = ref<boolean>(true);\n</script>\n\n<template>\n  <RuiTextField\n    v-bind=\"$attrs\"\n    v-model=\"modelValue\"\n    :label=\"label\"\n    :placeholder=\"placeholder\"\n    :disabled=\"disabled\"\n    :label-placement=\"labelPlacement\"\n    :dense=\"dense\"\n    :hint=\"hint\"\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hide-details=\"hideDetails\"\n    :readonly=\"readonly\"\n    :clearable=\"clearable\"\n    :required=\"required\"\n    :type=\"hidden ? 'password' : 'text'\"\n  >\n    <template\n      v-if=\"$slots.prepend\"\n      #prepend\n    >\n      <slot name=\"prepend\" />\n    </template>\n    <template #append>\n      <div class=\"flex items-center\">\n        <RuiButton\n          :disabled=\"disabled\"\n          :aria-label=\"hidden ? 'Show password' : 'Hide password'\"\n          tabindex=\"-1\"\n          variant=\"text\"\n          type=\"button\"\n          icon\n          data-id=\"toggle-visibility\"\n          class=\"-mr-1 p-1!\"\n          @click=\"hidden = !hidden\"\n        >\n          <!--\n            24px round the field's 16px glyph, so the focus ring and its offset stay inside even the 32px\n            dense field; the muted tone of the other field icons\n          -->\n          <RuiIcon\n            class=\"text-rui-neutral-500 dark:text-rui-neutral-400\"\n            size=\"16\"\n            :name=\"hidden ? 'lu-eye-off' : 'lu-eye'\"\n          />\n        </RuiButton>\n\n        <slot name=\"append\" />\n      </div>\n    </template>\n  </RuiTextField>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAYA,MAAM,aAAa,SAAmB,SAAA,YAAmB;EAsBzD,MAAM,SAAS,IAAa,IAAI;;GAI9B,OAAA,UAAA,GAAA,YAkDe,sBAlDf,WACUA,KAiDK,QAjDC;IACL,YAAA,WAAA;IAAA,uBAAA,OAAA,OAAA,OAAA,MAAA,WAAA,WAAU,QAAA;IAClB,OAAO,QAAA;IACP,aAAa,QAAA;IACb,UAAU,QAAA;IACV,mBAAiB,QAAA;IACjB,OAAO,QAAA;IACP,MAAM,QAAA;IACN,kBAAgB,QAAA;IAChB,oBAAkB,QAAA;IAClB,gBAAc,QAAA;IACd,UAAU,QAAA;IACV,WAAW,QAAA;IACX,UAAU,QAAA;IACV,MAAM,MAAA,MAAA,IAAM,aAAA;;IAQF,QAAM,cAyBT,CAxBN,mBAwBM,OAxBN,YAwBM,CAvBJ,YAoBY,mBAAA;KAnBT,UAAU,QAAA;KACV,cAAY,MAAA,MAAA,IAAM,kBAAA;KACnB,UAAS;KACT,SAAQ;KACR,MAAK;KACL,MAAA;KACA,WAAQ;KACR,OAAM;KACL,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,OAAA,QAAM,CAAI,MAAA,MAAA;;KAMlB,SAAA,cAIE,CAJF,YAIE,iBAAA;MAHA,OAAM;MACN,MAAK;MACJ,MAAM,MAAA,MAAA,IAAM,eAAA;;;IAIjB,GAAA,GAAA,CAAA,YAAA,YAAA,CAAA,GAAA,WAAsB,KAAA,QAAA,QAAA,CAAA,CAAA,CAAA,CAAA;;GA7BlBC,GAAAA,CAAAA,KAAAA,OAAO,UAAA;IACZ,MAAA;IAED,IAAA,cAAuB,CAAvB,WAAuB,KAAA,QAAA,SAAA,CAAA,CAAA"}
+{"version":3,"file":"RuiRevealableTextField.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$slots","_useModel","_openBlock","_createBlock","RuiTextField","_mergeProps","_unref","_createSlots","_withCtx","_createElementVNode","_createVNode","RuiButton","RuiIcon","_renderSlot"],"sources":["../../../../src/components/forms/revealable-text-field/RuiRevealableTextField.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiTextField, { type TextFieldProps } from '@/components/forms/text-field/RuiTextField.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\n\nexport interface Props extends TextFieldProps {}\n\ndefineOptions({\n  name: 'RuiRevealableTextField',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<string>({ required: true });\n\nconst {\n  label = '',\n  placeholder = '',\n  disabled = false,\n  labelPlacement = undefined,\n  dense = false,\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  hideDetails = false,\n  readonly = false,\n  clearable = false,\n  required = false,\n} = defineProps<Props>();\n\ndefineSlots<{\n  prepend?: () => any;\n  append?: () => any;\n}>();\n\nconst hidden = ref<boolean>(true);\n</script>\n\n<template>\n  <RuiTextField\n    v-bind=\"$attrs\"\n    v-model=\"modelValue\"\n    :label=\"label\"\n    :placeholder=\"placeholder\"\n    :disabled=\"disabled\"\n    :label-placement=\"labelPlacement\"\n    :dense=\"dense\"\n    :hint=\"hint\"\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hide-details=\"hideDetails\"\n    :readonly=\"readonly\"\n    :clearable=\"clearable\"\n    :required=\"required\"\n    :type=\"hidden ? 'password' : 'text'\"\n  >\n    <template\n      v-if=\"$slots.prepend\"\n      #prepend\n    >\n      <slot name=\"prepend\" />\n    </template>\n    <template #append>\n      <div class=\"flex items-center\">\n        <RuiButton\n          :disabled=\"disabled\"\n          :aria-label=\"hidden ? 'Show password' : 'Hide password'\"\n          tabindex=\"-1\"\n          variant=\"text\"\n          type=\"button\"\n          icon\n          data-id=\"toggle-visibility\"\n          class=\"-mr-1 p-1!\"\n          @click=\"hidden = !hidden\"\n        >\n          <!--\n            24px round the field's 16px glyph, so the focus ring and its offset stay inside even the 32px\n            dense field; the muted tone of the other field icons\n          -->\n          <RuiIcon\n            class=\"text-rui-neutral-500 dark:text-rui-neutral-400\"\n            size=\"16\"\n            :name=\"hidden ? 'lu-eye-off' : 'lu-eye'\"\n          />\n        </RuiButton>\n\n        <slot name=\"append\" />\n      </div>\n    </template>\n  </RuiTextField>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAYA,MAAM,aAAaE,SAAmB,SAAA,YAAmB;EAsBzD,MAAM,SAAS,IAAa,IAAI;;GAI9B,OAAAC,UAAA,GAAAC,YAkDeC,sBAlDfC,WACUN,KAiDK,QAjDC;IACL,YAAA,WAAA;IAAA,uBAAA,OAAA,OAAA,OAAA,MAAA,WAAA,WAAU,QAAA;IAClB,OAAO,QAAA;IACP,aAAa,QAAA;IACb,UAAU,QAAA;IACV,mBAAiB,QAAA;IACjB,OAAO,QAAA;IACP,MAAM,QAAA;IACN,kBAAgB,QAAA;IAChB,oBAAkB,QAAA;IAClB,gBAAc,QAAA;IACd,UAAU,QAAA;IACV,WAAW,QAAA;IACX,UAAU,QAAA;IACV,MAAMO,MAAA,MAAA,IAAM,aAAA;;IAQF,QAAME,cAyBT,CAxBNC,mBAwBM,OAxBN,YAwBM,CAvBJC,YAoBYC,mBAAA;KAnBT,UAAU,QAAA;KACV,cAAYL,MAAA,MAAA,IAAM,kBAAA;KACnB,UAAS;KACT,SAAQ;KACR,MAAK;KACL,MAAA;KACA,WAAQ;KACR,OAAM;KACL,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,OAAA,QAAM,CAAIA,MAAA,MAAA;;KAMlB,SAAAE,cAIE,CAJFE,YAIEE,iBAAA;MAHA,OAAM;MACN,MAAK;MACJ,MAAMN,MAAA,MAAA,IAAM,eAAA;;;IAIjBO,GAAAA,GAAAA,CAAAA,YAAAA,YAAAA,CAAAA,GAAAA,WAAsB,KAAA,QAAA,QAAA,CAAA,CAAA,CAAA,CAAA;;GA7BlBb,GAAAA,CAAAA,KAAAA,OAAO,UAAA;IACZ,MAAA;IAED,IAAAQ,cAAuB,CAAvBK,WAAuB,KAAA,QAAA,SAAA,CAAA,CAAA"}

package/dist/components/forms/select/RuiMenuSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiMenuSelect.js","names":[],"sources":["../../../../src/components/forms/select/RuiMenuSelect.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue, TItem\">\nimport type { VueClassValue } from '@/types/class-value';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiFieldLabel from '@/components/forms/field-label/RuiFieldLabel.vue';\nimport { menuSelectStyles } from '@/components/forms/select/menu-select-styles';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiMenu, { type MenuProps } from '@/components/overlays/menu/RuiMenu.vue';\nimport RuiProgress from '@/components/progress/RuiProgress.vue';\nimport { type LabelPlacement, useLabelPlacement } from '@/composables/defaults/field';\nimport { getOptionHeight, type KeyOfType, useDropdownMenu } from '@/composables/dropdown-menu';\nimport { type FloatingOptions, Placement } from '@/composables/floating';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\n\nexport interface RuiMenuSelectClassNames {\n  root?: VueClassValue;\n  label?: VueClassValue;\n  menu?: VueClassValue;\n  option?: VueClassValue;\n}\n\nexport interface MenuSelectProps<TValue, TItem> {\n  options: TItem[];\n  keyAttr?: KeyOfType<TItem, TValue extends Array<infer U> ? U : TValue>;\n  textAttr?: keyof TItem;\n  disabled?: boolean;\n  loading?: boolean;\n  readOnly?: boolean;\n  dense?: boolean;\n  clearable?: boolean;\n  label?: string;\n  /** Where the label shows; falls back to the nearest `RuiFieldDefaults`, then the app default, then `top`. */\n  labelPlacement?: LabelPlacement;\n  menuOptions?: MenuProps;\n  classNames?: RuiMenuSelectClassNames;\n  prependWidth?: number;\n  appendWidth?: number;\n  itemHeight?: number;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  autoSelectFirst?: boolean;\n  hideNoData?: boolean;\n  noDataText?: string;\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiMenuSelect',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue | undefined>({ required: true });\n\nconst {\n  options,\n  disabled = false,\n  loading = false,\n  readOnly = false,\n  dense = false,\n  clearable = false,\n  hideDetails = false,\n  label = 'Select',\n  labelPlacement = undefined,\n  menuOptions,\n  classNames,\n  hint,\n  keyAttr,\n  textAttr,\n  itemHeight,\n  prependWidth,\n  appendWidth,\n  errorMessages = [],\n  successMessages = [],\n  autoSelectFirst = false,\n  hideNoData = false,\n  noDataText = 'No data available',\n  required = false,\n} = defineProps<MenuSelectProps<TValue, TItem>>();\n\ndefineSlots<{\n  'activator'?: (props: {\n    disabled: boolean;\n    value: TItem | undefined;\n    readOnly: boolean;\n    attrs: Record<string, unknown>;\n    open: boolean;\n    hasError: boolean;\n    hasSuccess: boolean;\n  }) => any;\n  'selection.prepend'?: (props: { item: TItem }) => any;\n  'selection'?: (props: { item: TItem }) => any;\n  'item.prepend'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'item'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'item.append'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'no-data'?: () => any;\n}>();\n\nconst menuRef = useTemplateRef<HTMLDivElement>('menuRef');\nconst activator = useTemplateRef<HTMLDivElement>('activator');\nconst { focused } = useFocus(activator);\nconst isHovered = ref<boolean>(false);\nconst labelId = useId();\n\nconst placement = useLabelPlacement(() => labelPlacement);\n\nconst { hasError, hasSuccess } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\nconst value = computed<TItem | undefined>({\n  get: () => {\n    const value = get(modelValue);\n    if (keyAttr)\n      return options.find(option => option[keyAttr] === value);\n    return value as unknown as TItem;\n  },\n  set: (selected?: TItem) => {\n    const selection = keyAttr && selected ? selected[keyAttr] : selected;\n    set(modelValue, selection as TValue);\n  },\n});\n\nfunction setValue(val: TItem): void {\n  set(value, val);\n  set(focused, true);\n}\n\nconst {\n  containerProps,\n  wrapperProps,\n  renderedData,\n  isOpen,\n  menuWidth,\n  getText,\n  getIdentifier,\n  isActiveItem,\n  modelHighlightedIndex,\n  moveHighlight,\n  applyHighlighted,\n  valueKey,\n} = useDropdownMenu<TValue, TItem>({\n  itemHeight: itemHeight ?? getOptionHeight(dense),\n  keyAttr,\n  textAttr,\n  options: () => options,\n  dense: () => dense,\n  value,\n  menuRef,\n  disabled: () => disabled,\n  autoSelectFirst,\n  setValue,\n  prependWidth,\n  appendWidth,\n});\n\nconst ui = computed<ReturnType<typeof menuSelectStyles>>(() => menuSelectStyles({\n  opened: get(isOpen),\n  hovered: get(isHovered),\n  dense,\n  disabled,\n  readonly: readOnly,\n  hasError: get(hasError),\n  hasSuccess: get(hasSuccess) && !get(hasError),\n}));\n\nconst highlightedClass = menuSelectStyles({}).highlighted();\n\nfunction clear(): void {\n  set(modelValue, undefined);\n}\n\nconst menuFloatingOptions = computed<FloatingOptions>(() => ({\n  placement: Placement.bottomStart,\n  ...menuOptions?.options,\n}));\n</script>\n\n<template>\n  <RuiMenu\n    v-model=\"isOpen\"\n    v-bind=\"{ ...getRootAttrs($attrs, []), ...menuOptions }\"\n    :class=\"ui.wrapper({ class: cn($attrs.class) })\"\n    :class-names=\"{ ...menuOptions?.classNames, details: ['px-0', cn(menuOptions?.classNames?.details) ?? ''] }\"\n    :options=\"menuFloatingOptions\"\n    close-on-content-click\n    full-width\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hint=\"hint\"\n    :dense=\"dense\"\n    :show-details=\"!hideDetails\"\n    :disabled=\"disabled\"\n    disable-auto-focus\n    role=\"listbox\"\n  >\n    <template\n      v-if=\"label\"\n      #label\n    >\n      <RuiFieldLabel\n        :id=\"labelId\"\n        :text=\"label\"\n        :hidden=\"placement === 'hidden'\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n      />\n    </template>\n    <template #activator=\"{ attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\">\n      <slot\n        name=\"activator\"\n        v-bind=\"{ disabled, value, readOnly, attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\"\n      >\n        <!-- a select-only combobox: the button opens a listbox of options, and carries the field's state -->\n        <button\n          ref=\"activator\"\n          role=\"combobox\"\n          :disabled=\"disabled\"\n          :aria-disabled=\"disabled\"\n          :aria-expanded=\"isOpen\"\n          :aria-readonly=\"readOnly || undefined\"\n          :aria-required=\"required || undefined\"\n          :aria-busy=\"loading || undefined\"\n          :aria-labelledby=\"label ? labelId : undefined\"\n          type=\"button\"\n          :tabindex=\"disabled || readOnly ? -1 : 0\"\n          :class=\"ui.activator({ class: cn(classNames?.label) })\"\n          v-bind=\"{\n            ...getNonRootAttrs($attrs),\n            ...(readOnly ? {} : attrs),\n          }\"\n          data-id=\"activator\"\n          :aria-invalid=\"hasError\"\n          @mouseenter=\"isHovered = true\"\n          @mouseleave=\"isHovered = false\"\n          @keydown.up.prevent=\"moveHighlight(true)\"\n          @keydown.down.prevent=\"moveHighlight(false)\"\n          @keydown.enter.prevent=\"applyHighlighted()\"\n          @keydown.space.prevent=\"applyHighlighted()\"\n          @keydown.home.prevent=\"modelHighlightedIndex = 0\"\n          @keydown.end.prevent=\"modelHighlightedIndex = options.length - 1\"\n        >\n          <span\n            v-if=\"value\"\n            :class=\"ui.value()\"\n          >\n            <slot\n              name=\"selection.prepend\"\n              v-bind=\"{ item: value }\"\n            />\n            <slot\n              name=\"selection\"\n              v-bind=\"{ item: value }\"\n            >\n              {{ getText(value) }}\n            </slot>\n          </span>\n\n          <span\n            v-if=\"clearable && value && !disabled && !readOnly\"\n            data-id=\"clear\"\n            :class=\"[ui.clear(), focused && 'visible!', { 'mr-2': !dense }]\"\n            @click.stop.prevent=\"clear()\"\n          >\n            <RuiIcon\n              name=\"lu-x\"\n              size=\"16\"\n            />\n          </span>\n\n          <span :class=\"ui.iconWrapper()\">\n            <RuiIcon\n              :class=\"ui.icon()\"\n              :size=\"dense ? 16 : 20\"\n              name=\"lu-chevron-down\"\n            />\n          </span>\n\n          <RuiProgress\n            v-if=\"loading\"\n            :class=\"ui.progress()\"\n            color=\"primary\"\n            thickness=\"2\"\n            variant=\"indeterminate\"\n          />\n        </button>\n        <fieldset :class=\"ui.fieldset()\" />\n      </slot>\n      <input\n        :value=\"valueKey\"\n        class=\"hidden\"\n        type=\"hidden\"\n      />\n    </template>\n    <template #default=\"{ width }\">\n      <div\n        v-if=\"options.length > 0\"\n        :ref=\"containerProps.ref\"\n        :class=\"ui.menu({ class: cn(classNames?.menu) })\"\n        :style=\"[containerProps.style, { width: `${width}px`, minWidth: menuWidth }]\"\n        @scroll=\"containerProps.onScroll\"\n        @keydown.up.prevent=\"moveHighlight(true)\"\n        @keydown.down.prevent=\"moveHighlight(false)\"\n      >\n        <div\n          v-bind=\"wrapperProps\"\n          ref=\"menuRef\"\n        >\n          <RuiButton\n            v-for=\"{ item, _index } in renderedData\"\n            :key=\"getIdentifier(item)\"\n            :active=\"isActiveItem(item)\"\n            role=\"option\"\n            :aria-selected=\"isActiveItem(item)\"\n            :size=\"dense ? 'sm' : undefined\"\n            variant=\"list\"\n            :data-highlighted=\"modelHighlightedIndex === _index\"\n            :class=\"{\n              [highlightedClass]: !isActiveItem(item) && modelHighlightedIndex === _index,\n            }\"\n            @click=\"setValue(item)\"\n          >\n            <template #prepend>\n              <slot\n                name=\"item.prepend\"\n                v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n              />\n            </template>\n            <slot\n              name=\"item\"\n              v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n            >\n              {{ getText(item) }}\n            </slot>\n            <template #append>\n              <slot\n                name=\"item.append\"\n                v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n              />\n            </template>\n          </RuiButton>\n        </div>\n      </div>\n\n      <div\n        v-else-if=\"!hideNoData\"\n        data-id=\"no-data\"\n        :style=\"{ width: `${width}px`, minWidth: menuWidth }\"\n        :class=\"classNames?.menu\"\n      >\n        <slot name=\"no-data\">\n          <div class=\"p-4\">\n            {{ noDataText }}\n          </div>\n        </slot>\n      </div>\n    </template>\n  </RuiMenu>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiMenuSelect.js","names":["_sfc_main"],"sources":["../../../../src/components/forms/select/RuiMenuSelect.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue, TItem\">\nimport type { VueClassValue } from '@/types/class-value';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiFieldLabel from '@/components/forms/field-label/RuiFieldLabel.vue';\nimport { menuSelectStyles } from '@/components/forms/select/menu-select-styles';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiMenu, { type MenuProps } from '@/components/overlays/menu/RuiMenu.vue';\nimport RuiProgress from '@/components/progress/RuiProgress.vue';\nimport { type LabelPlacement, useLabelPlacement } from '@/composables/defaults/field';\nimport { getOptionHeight, type KeyOfType, useDropdownMenu } from '@/composables/dropdown-menu';\nimport { type FloatingOptions, Placement } from '@/composables/floating';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\n\nexport interface RuiMenuSelectClassNames {\n  root?: VueClassValue;\n  label?: VueClassValue;\n  menu?: VueClassValue;\n  option?: VueClassValue;\n}\n\nexport interface MenuSelectProps<TValue, TItem> {\n  options: TItem[];\n  keyAttr?: KeyOfType<TItem, TValue extends Array<infer U> ? U : TValue>;\n  textAttr?: keyof TItem;\n  disabled?: boolean;\n  loading?: boolean;\n  readOnly?: boolean;\n  dense?: boolean;\n  clearable?: boolean;\n  label?: string;\n  /** Where the label shows; falls back to the nearest `RuiFieldDefaults`, then the app default, then `top`. */\n  labelPlacement?: LabelPlacement;\n  menuOptions?: MenuProps;\n  classNames?: RuiMenuSelectClassNames;\n  prependWidth?: number;\n  appendWidth?: number;\n  itemHeight?: number;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  autoSelectFirst?: boolean;\n  hideNoData?: boolean;\n  noDataText?: string;\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiMenuSelect',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue | undefined>({ required: true });\n\nconst {\n  options,\n  disabled = false,\n  loading = false,\n  readOnly = false,\n  dense = false,\n  clearable = false,\n  hideDetails = false,\n  label = 'Select',\n  labelPlacement = undefined,\n  menuOptions,\n  classNames,\n  hint,\n  keyAttr,\n  textAttr,\n  itemHeight,\n  prependWidth,\n  appendWidth,\n  errorMessages = [],\n  successMessages = [],\n  autoSelectFirst = false,\n  hideNoData = false,\n  noDataText = 'No data available',\n  required = false,\n} = defineProps<MenuSelectProps<TValue, TItem>>();\n\ndefineSlots<{\n  'activator'?: (props: {\n    disabled: boolean;\n    value: TItem | undefined;\n    readOnly: boolean;\n    attrs: Record<string, unknown>;\n    open: boolean;\n    hasError: boolean;\n    hasSuccess: boolean;\n  }) => any;\n  'selection.prepend'?: (props: { item: TItem }) => any;\n  'selection'?: (props: { item: TItem }) => any;\n  'item.prepend'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'item'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'item.append'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'no-data'?: () => any;\n}>();\n\nconst menuRef = useTemplateRef<HTMLDivElement>('menuRef');\nconst activator = useTemplateRef<HTMLDivElement>('activator');\nconst { focused } = useFocus(activator);\nconst isHovered = ref<boolean>(false);\nconst labelId = useId();\n\nconst placement = useLabelPlacement(() => labelPlacement);\n\nconst { hasError, hasSuccess } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\nconst value = computed<TItem | undefined>({\n  get: () => {\n    const value = get(modelValue);\n    if (keyAttr)\n      return options.find(option => option[keyAttr] === value);\n    return value as unknown as TItem;\n  },\n  set: (selected?: TItem) => {\n    const selection = keyAttr && selected ? selected[keyAttr] : selected;\n    set(modelValue, selection as TValue);\n  },\n});\n\nfunction setValue(val: TItem): void {\n  set(value, val);\n  set(focused, true);\n}\n\nconst {\n  containerProps,\n  wrapperProps,\n  renderedData,\n  isOpen,\n  menuWidth,\n  getText,\n  getIdentifier,\n  isActiveItem,\n  modelHighlightedIndex,\n  moveHighlight,\n  applyHighlighted,\n  valueKey,\n} = useDropdownMenu<TValue, TItem>({\n  itemHeight: itemHeight ?? getOptionHeight(dense),\n  keyAttr,\n  textAttr,\n  options: () => options,\n  dense: () => dense,\n  value,\n  menuRef,\n  disabled: () => disabled,\n  autoSelectFirst,\n  setValue,\n  prependWidth,\n  appendWidth,\n});\n\nconst ui = computed<ReturnType<typeof menuSelectStyles>>(() => menuSelectStyles({\n  opened: get(isOpen),\n  hovered: get(isHovered),\n  dense,\n  disabled,\n  readonly: readOnly,\n  hasError: get(hasError),\n  hasSuccess: get(hasSuccess) && !get(hasError),\n}));\n\nconst highlightedClass = menuSelectStyles({}).highlighted();\n\nfunction clear(): void {\n  set(modelValue, undefined);\n}\n\nconst menuFloatingOptions = computed<FloatingOptions>(() => ({\n  placement: Placement.bottomStart,\n  ...menuOptions?.options,\n}));\n</script>\n\n<template>\n  <RuiMenu\n    v-model=\"isOpen\"\n    v-bind=\"{ ...getRootAttrs($attrs, []), ...menuOptions }\"\n    :class=\"ui.wrapper({ class: cn($attrs.class) })\"\n    :class-names=\"{ ...menuOptions?.classNames, details: ['px-0', cn(menuOptions?.classNames?.details) ?? ''] }\"\n    :options=\"menuFloatingOptions\"\n    close-on-content-click\n    full-width\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hint=\"hint\"\n    :dense=\"dense\"\n    :show-details=\"!hideDetails\"\n    :disabled=\"disabled\"\n    disable-auto-focus\n    role=\"listbox\"\n  >\n    <template\n      v-if=\"label\"\n      #label\n    >\n      <RuiFieldLabel\n        :id=\"labelId\"\n        :text=\"label\"\n        :hidden=\"placement === 'hidden'\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n      />\n    </template>\n    <template #activator=\"{ attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\">\n      <slot\n        name=\"activator\"\n        v-bind=\"{ disabled, value, readOnly, attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\"\n      >\n        <!-- a select-only combobox: the button opens a listbox of options, and carries the field's state -->\n        <button\n          ref=\"activator\"\n          role=\"combobox\"\n          :disabled=\"disabled\"\n          :aria-disabled=\"disabled\"\n          :aria-expanded=\"isOpen\"\n          :aria-readonly=\"readOnly || undefined\"\n          :aria-required=\"required || undefined\"\n          :aria-busy=\"loading || undefined\"\n          :aria-labelledby=\"label ? labelId : undefined\"\n          type=\"button\"\n          :tabindex=\"disabled || readOnly ? -1 : 0\"\n          :class=\"ui.activator({ class: cn(classNames?.label) })\"\n          v-bind=\"{\n            ...getNonRootAttrs($attrs),\n            ...(readOnly ? {} : attrs),\n          }\"\n          data-id=\"activator\"\n          :aria-invalid=\"hasError\"\n          @mouseenter=\"isHovered = true\"\n          @mouseleave=\"isHovered = false\"\n          @keydown.up.prevent=\"moveHighlight(true)\"\n          @keydown.down.prevent=\"moveHighlight(false)\"\n          @keydown.enter.prevent=\"applyHighlighted()\"\n          @keydown.space.prevent=\"applyHighlighted()\"\n          @keydown.home.prevent=\"modelHighlightedIndex = 0\"\n          @keydown.end.prevent=\"modelHighlightedIndex = options.length - 1\"\n        >\n          <span\n            v-if=\"value\"\n            :class=\"ui.value()\"\n          >\n            <slot\n              name=\"selection.prepend\"\n              v-bind=\"{ item: value }\"\n            />\n            <slot\n              name=\"selection\"\n              v-bind=\"{ item: value }\"\n            >\n              {{ getText(value) }}\n            </slot>\n          </span>\n\n          <span\n            v-if=\"clearable && value && !disabled && !readOnly\"\n            data-id=\"clear\"\n            :class=\"[ui.clear(), focused && 'visible!', { 'mr-2': !dense }]\"\n            @click.stop.prevent=\"clear()\"\n          >\n            <RuiIcon\n              name=\"lu-x\"\n              size=\"16\"\n            />\n          </span>\n\n          <span :class=\"ui.iconWrapper()\">\n            <RuiIcon\n              :class=\"ui.icon()\"\n              :size=\"dense ? 16 : 20\"\n              name=\"lu-chevron-down\"\n            />\n          </span>\n\n          <RuiProgress\n            v-if=\"loading\"\n            :class=\"ui.progress()\"\n            color=\"primary\"\n            thickness=\"2\"\n            variant=\"indeterminate\"\n          />\n        </button>\n        <fieldset :class=\"ui.fieldset()\" />\n      </slot>\n      <input\n        :value=\"valueKey\"\n        class=\"hidden\"\n        type=\"hidden\"\n      />\n    </template>\n    <template #default=\"{ width }\">\n      <div\n        v-if=\"options.length > 0\"\n        :ref=\"containerProps.ref\"\n        :class=\"ui.menu({ class: cn(classNames?.menu) })\"\n        :style=\"[containerProps.style, { width: `${width}px`, minWidth: menuWidth }]\"\n        @scroll=\"containerProps.onScroll\"\n        @keydown.up.prevent=\"moveHighlight(true)\"\n        @keydown.down.prevent=\"moveHighlight(false)\"\n      >\n        <div\n          v-bind=\"wrapperProps\"\n          ref=\"menuRef\"\n        >\n          <RuiButton\n            v-for=\"{ item, _index } in renderedData\"\n            :key=\"getIdentifier(item)\"\n            :active=\"isActiveItem(item)\"\n            role=\"option\"\n            :aria-selected=\"isActiveItem(item)\"\n            :size=\"dense ? 'sm' : undefined\"\n            variant=\"list\"\n            :data-highlighted=\"modelHighlightedIndex === _index\"\n            :class=\"{\n              [highlightedClass]: !isActiveItem(item) && modelHighlightedIndex === _index,\n            }\"\n            @click=\"setValue(item)\"\n          >\n            <template #prepend>\n              <slot\n                name=\"item.prepend\"\n                v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n              />\n            </template>\n            <slot\n              name=\"item\"\n              v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n            >\n              {{ getText(item) }}\n            </slot>\n            <template #append>\n              <slot\n                name=\"item.append\"\n                v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n              />\n            </template>\n          </RuiButton>\n        </div>\n      </div>\n\n      <div\n        v-else-if=\"!hideNoData\"\n        data-id=\"no-data\"\n        :style=\"{ width: `${width}px`, minWidth: menuWidth }\"\n        :class=\"classNames?.menu\"\n      >\n        <slot name=\"no-data\">\n          <div class=\"p-4\">\n            {{ noDataText }}\n          </div>\n        </slot>\n      </div>\n    </template>\n  </RuiMenu>\n</template>\n"],"mappings":""}

package/dist/components/forms/select/RuiMenuSelect.vue.d.ts

@@ -1,5 +1,5 @@
-import type { VueClassValue } from '../../../types/class-value';
-import { type MenuProps } from '../../overlays/menu/RuiMenu.vue';
+import type { VueClassValue } from '../../../types/class-value.js';
+import { type MenuProps } from '../../overlays/menu/RuiMenu.vue.js';
 import { type LabelPlacement } from '../../../composables/defaults/field.js';
 import { type KeyOfType } from '../../../composables/dropdown-menu.js';
 export interface RuiMenuSelectClassNames {

package/dist/components/forms/select/RuiMenuSelect.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiMenuSelect.vue_vue_type_script_setup_true_lang.js","names":["$attrs"],"sources":["../../../../src/components/forms/select/RuiMenuSelect.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue, TItem\">\nimport type { VueClassValue } from '@/types/class-value';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiFieldLabel from '@/components/forms/field-label/RuiFieldLabel.vue';\nimport { menuSelectStyles } from '@/components/forms/select/menu-select-styles';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiMenu, { type MenuProps } from '@/components/overlays/menu/RuiMenu.vue';\nimport RuiProgress from '@/components/progress/RuiProgress.vue';\nimport { type LabelPlacement, useLabelPlacement } from '@/composables/defaults/field';\nimport { getOptionHeight, type KeyOfType, useDropdownMenu } from '@/composables/dropdown-menu';\nimport { type FloatingOptions, Placement } from '@/composables/floating';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\n\nexport interface RuiMenuSelectClassNames {\n  root?: VueClassValue;\n  label?: VueClassValue;\n  menu?: VueClassValue;\n  option?: VueClassValue;\n}\n\nexport interface MenuSelectProps<TValue, TItem> {\n  options: TItem[];\n  keyAttr?: KeyOfType<TItem, TValue extends Array<infer U> ? U : TValue>;\n  textAttr?: keyof TItem;\n  disabled?: boolean;\n  loading?: boolean;\n  readOnly?: boolean;\n  dense?: boolean;\n  clearable?: boolean;\n  label?: string;\n  /** Where the label shows; falls back to the nearest `RuiFieldDefaults`, then the app default, then `top`. */\n  labelPlacement?: LabelPlacement;\n  menuOptions?: MenuProps;\n  classNames?: RuiMenuSelectClassNames;\n  prependWidth?: number;\n  appendWidth?: number;\n  itemHeight?: number;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  autoSelectFirst?: boolean;\n  hideNoData?: boolean;\n  noDataText?: string;\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiMenuSelect',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue | undefined>({ required: true });\n\nconst {\n  options,\n  disabled = false,\n  loading = false,\n  readOnly = false,\n  dense = false,\n  clearable = false,\n  hideDetails = false,\n  label = 'Select',\n  labelPlacement = undefined,\n  menuOptions,\n  classNames,\n  hint,\n  keyAttr,\n  textAttr,\n  itemHeight,\n  prependWidth,\n  appendWidth,\n  errorMessages = [],\n  successMessages = [],\n  autoSelectFirst = false,\n  hideNoData = false,\n  noDataText = 'No data available',\n  required = false,\n} = defineProps<MenuSelectProps<TValue, TItem>>();\n\ndefineSlots<{\n  'activator'?: (props: {\n    disabled: boolean;\n    value: TItem | undefined;\n    readOnly: boolean;\n    attrs: Record<string, unknown>;\n    open: boolean;\n    hasError: boolean;\n    hasSuccess: boolean;\n  }) => any;\n  'selection.prepend'?: (props: { item: TItem }) => any;\n  'selection'?: (props: { item: TItem }) => any;\n  'item.prepend'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'item'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'item.append'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'no-data'?: () => any;\n}>();\n\nconst menuRef = useTemplateRef<HTMLDivElement>('menuRef');\nconst activator = useTemplateRef<HTMLDivElement>('activator');\nconst { focused } = useFocus(activator);\nconst isHovered = ref<boolean>(false);\nconst labelId = useId();\n\nconst placement = useLabelPlacement(() => labelPlacement);\n\nconst { hasError, hasSuccess } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\nconst value = computed<TItem | undefined>({\n  get: () => {\n    const value = get(modelValue);\n    if (keyAttr)\n      return options.find(option => option[keyAttr] === value);\n    return value as unknown as TItem;\n  },\n  set: (selected?: TItem) => {\n    const selection = keyAttr && selected ? selected[keyAttr] : selected;\n    set(modelValue, selection as TValue);\n  },\n});\n\nfunction setValue(val: TItem): void {\n  set(value, val);\n  set(focused, true);\n}\n\nconst {\n  containerProps,\n  wrapperProps,\n  renderedData,\n  isOpen,\n  menuWidth,\n  getText,\n  getIdentifier,\n  isActiveItem,\n  modelHighlightedIndex,\n  moveHighlight,\n  applyHighlighted,\n  valueKey,\n} = useDropdownMenu<TValue, TItem>({\n  itemHeight: itemHeight ?? getOptionHeight(dense),\n  keyAttr,\n  textAttr,\n  options: () => options,\n  dense: () => dense,\n  value,\n  menuRef,\n  disabled: () => disabled,\n  autoSelectFirst,\n  setValue,\n  prependWidth,\n  appendWidth,\n});\n\nconst ui = computed<ReturnType<typeof menuSelectStyles>>(() => menuSelectStyles({\n  opened: get(isOpen),\n  hovered: get(isHovered),\n  dense,\n  disabled,\n  readonly: readOnly,\n  hasError: get(hasError),\n  hasSuccess: get(hasSuccess) && !get(hasError),\n}));\n\nconst highlightedClass = menuSelectStyles({}).highlighted();\n\nfunction clear(): void {\n  set(modelValue, undefined);\n}\n\nconst menuFloatingOptions = computed<FloatingOptions>(() => ({\n  placement: Placement.bottomStart,\n  ...menuOptions?.options,\n}));\n</script>\n\n<template>\n  <RuiMenu\n    v-model=\"isOpen\"\n    v-bind=\"{ ...getRootAttrs($attrs, []), ...menuOptions }\"\n    :class=\"ui.wrapper({ class: cn($attrs.class) })\"\n    :class-names=\"{ ...menuOptions?.classNames, details: ['px-0', cn(menuOptions?.classNames?.details) ?? ''] }\"\n    :options=\"menuFloatingOptions\"\n    close-on-content-click\n    full-width\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hint=\"hint\"\n    :dense=\"dense\"\n    :show-details=\"!hideDetails\"\n    :disabled=\"disabled\"\n    disable-auto-focus\n    role=\"listbox\"\n  >\n    <template\n      v-if=\"label\"\n      #label\n    >\n      <RuiFieldLabel\n        :id=\"labelId\"\n        :text=\"label\"\n        :hidden=\"placement === 'hidden'\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n      />\n    </template>\n    <template #activator=\"{ attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\">\n      <slot\n        name=\"activator\"\n        v-bind=\"{ disabled, value, readOnly, attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\"\n      >\n        <!-- a select-only combobox: the button opens a listbox of options, and carries the field's state -->\n        <button\n          ref=\"activator\"\n          role=\"combobox\"\n          :disabled=\"disabled\"\n          :aria-disabled=\"disabled\"\n          :aria-expanded=\"isOpen\"\n          :aria-readonly=\"readOnly || undefined\"\n          :aria-required=\"required || undefined\"\n          :aria-busy=\"loading || undefined\"\n          :aria-labelledby=\"label ? labelId : undefined\"\n          type=\"button\"\n          :tabindex=\"disabled || readOnly ? -1 : 0\"\n          :class=\"ui.activator({ class: cn(classNames?.label) })\"\n          v-bind=\"{\n            ...getNonRootAttrs($attrs),\n            ...(readOnly ? {} : attrs),\n          }\"\n          data-id=\"activator\"\n          :aria-invalid=\"hasError\"\n          @mouseenter=\"isHovered = true\"\n          @mouseleave=\"isHovered = false\"\n          @keydown.up.prevent=\"moveHighlight(true)\"\n          @keydown.down.prevent=\"moveHighlight(false)\"\n          @keydown.enter.prevent=\"applyHighlighted()\"\n          @keydown.space.prevent=\"applyHighlighted()\"\n          @keydown.home.prevent=\"modelHighlightedIndex = 0\"\n          @keydown.end.prevent=\"modelHighlightedIndex = options.length - 1\"\n        >\n          <span\n            v-if=\"value\"\n            :class=\"ui.value()\"\n          >\n            <slot\n              name=\"selection.prepend\"\n              v-bind=\"{ item: value }\"\n            />\n            <slot\n              name=\"selection\"\n              v-bind=\"{ item: value }\"\n            >\n              {{ getText(value) }}\n            </slot>\n          </span>\n\n          <span\n            v-if=\"clearable && value && !disabled && !readOnly\"\n            data-id=\"clear\"\n            :class=\"[ui.clear(), focused && 'visible!', { 'mr-2': !dense }]\"\n            @click.stop.prevent=\"clear()\"\n          >\n            <RuiIcon\n              name=\"lu-x\"\n              size=\"16\"\n            />\n          </span>\n\n          <span :class=\"ui.iconWrapper()\">\n            <RuiIcon\n              :class=\"ui.icon()\"\n              :size=\"dense ? 16 : 20\"\n              name=\"lu-chevron-down\"\n            />\n          </span>\n\n          <RuiProgress\n            v-if=\"loading\"\n            :class=\"ui.progress()\"\n            color=\"primary\"\n            thickness=\"2\"\n            variant=\"indeterminate\"\n          />\n        </button>\n        <fieldset :class=\"ui.fieldset()\" />\n      </slot>\n      <input\n        :value=\"valueKey\"\n        class=\"hidden\"\n        type=\"hidden\"\n      />\n    </template>\n    <template #default=\"{ width }\">\n      <div\n        v-if=\"options.length > 0\"\n        :ref=\"containerProps.ref\"\n        :class=\"ui.menu({ class: cn(classNames?.menu) })\"\n        :style=\"[containerProps.style, { width: `${width}px`, minWidth: menuWidth }]\"\n        @scroll=\"containerProps.onScroll\"\n        @keydown.up.prevent=\"moveHighlight(true)\"\n        @keydown.down.prevent=\"moveHighlight(false)\"\n      >\n        <div\n          v-bind=\"wrapperProps\"\n          ref=\"menuRef\"\n        >\n          <RuiButton\n            v-for=\"{ item, _index } in renderedData\"\n            :key=\"getIdentifier(item)\"\n            :active=\"isActiveItem(item)\"\n            role=\"option\"\n            :aria-selected=\"isActiveItem(item)\"\n            :size=\"dense ? 'sm' : undefined\"\n            variant=\"list\"\n            :data-highlighted=\"modelHighlightedIndex === _index\"\n            :class=\"{\n              [highlightedClass]: !isActiveItem(item) && modelHighlightedIndex === _index,\n            }\"\n            @click=\"setValue(item)\"\n          >\n            <template #prepend>\n              <slot\n                name=\"item.prepend\"\n                v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n              />\n            </template>\n            <slot\n              name=\"item\"\n              v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n            >\n              {{ getText(item) }}\n            </slot>\n            <template #append>\n              <slot\n                name=\"item.append\"\n                v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n              />\n            </template>\n          </RuiButton>\n        </div>\n      </div>\n\n      <div\n        v-else-if=\"!hideNoData\"\n        data-id=\"no-data\"\n        :style=\"{ width: `${width}px`, minWidth: menuWidth }\"\n        :class=\"classNames?.menu\"\n      >\n        <slot name=\"no-data\">\n          <div class=\"p-4\">\n            {{ noDataText }}\n          </div>\n        </slot>\n      </div>\n    </template>\n  </RuiMenu>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"RuiMenuSelect.vue_vue_type_script_setup_true_lang.js","names":["$attrs","_useModel","_openBlock","_createBlock","RuiMenu","_mergeProps","_unref","_isRef","_createSlots","_withCtx","_renderSlot","_normalizeProps","_guardReactiveProps","_createElementVNode","_withKeys","_withModifiers","_createElementBlock","_normalizeClass","_createTextVNode","_toDisplayString","_createCommentVNode","_createVNode","RuiIcon","RuiProgress","_normalizeStyle","_Fragment","_renderList","RuiButton","RuiFieldLabel"],"sources":["../../../../src/components/forms/select/RuiMenuSelect.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue, TItem\">\nimport type { VueClassValue } from '@/types/class-value';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiFieldLabel from '@/components/forms/field-label/RuiFieldLabel.vue';\nimport { menuSelectStyles } from '@/components/forms/select/menu-select-styles';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiMenu, { type MenuProps } from '@/components/overlays/menu/RuiMenu.vue';\nimport RuiProgress from '@/components/progress/RuiProgress.vue';\nimport { type LabelPlacement, useLabelPlacement } from '@/composables/defaults/field';\nimport { getOptionHeight, type KeyOfType, useDropdownMenu } from '@/composables/dropdown-menu';\nimport { type FloatingOptions, Placement } from '@/composables/floating';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\n\nexport interface RuiMenuSelectClassNames {\n  root?: VueClassValue;\n  label?: VueClassValue;\n  menu?: VueClassValue;\n  option?: VueClassValue;\n}\n\nexport interface MenuSelectProps<TValue, TItem> {\n  options: TItem[];\n  keyAttr?: KeyOfType<TItem, TValue extends Array<infer U> ? U : TValue>;\n  textAttr?: keyof TItem;\n  disabled?: boolean;\n  loading?: boolean;\n  readOnly?: boolean;\n  dense?: boolean;\n  clearable?: boolean;\n  label?: string;\n  /** Where the label shows; falls back to the nearest `RuiFieldDefaults`, then the app default, then `top`. */\n  labelPlacement?: LabelPlacement;\n  menuOptions?: MenuProps;\n  classNames?: RuiMenuSelectClassNames;\n  prependWidth?: number;\n  appendWidth?: number;\n  itemHeight?: number;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hideDetails?: boolean;\n  autoSelectFirst?: boolean;\n  hideNoData?: boolean;\n  noDataText?: string;\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiMenuSelect',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue | undefined>({ required: true });\n\nconst {\n  options,\n  disabled = false,\n  loading = false,\n  readOnly = false,\n  dense = false,\n  clearable = false,\n  hideDetails = false,\n  label = 'Select',\n  labelPlacement = undefined,\n  menuOptions,\n  classNames,\n  hint,\n  keyAttr,\n  textAttr,\n  itemHeight,\n  prependWidth,\n  appendWidth,\n  errorMessages = [],\n  successMessages = [],\n  autoSelectFirst = false,\n  hideNoData = false,\n  noDataText = 'No data available',\n  required = false,\n} = defineProps<MenuSelectProps<TValue, TItem>>();\n\ndefineSlots<{\n  'activator'?: (props: {\n    disabled: boolean;\n    value: TItem | undefined;\n    readOnly: boolean;\n    attrs: Record<string, unknown>;\n    open: boolean;\n    hasError: boolean;\n    hasSuccess: boolean;\n  }) => any;\n  'selection.prepend'?: (props: { item: TItem }) => any;\n  'selection'?: (props: { item: TItem }) => any;\n  'item.prepend'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'item'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'item.append'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n  'no-data'?: () => any;\n}>();\n\nconst menuRef = useTemplateRef<HTMLDivElement>('menuRef');\nconst activator = useTemplateRef<HTMLDivElement>('activator');\nconst { focused } = useFocus(activator);\nconst isHovered = ref<boolean>(false);\nconst labelId = useId();\n\nconst placement = useLabelPlacement(() => labelPlacement);\n\nconst { hasError, hasSuccess } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\n\nconst value = computed<TItem | undefined>({\n  get: () => {\n    const value = get(modelValue);\n    if (keyAttr)\n      return options.find(option => option[keyAttr] === value);\n    return value as unknown as TItem;\n  },\n  set: (selected?: TItem) => {\n    const selection = keyAttr && selected ? selected[keyAttr] : selected;\n    set(modelValue, selection as TValue);\n  },\n});\n\nfunction setValue(val: TItem): void {\n  set(value, val);\n  set(focused, true);\n}\n\nconst {\n  containerProps,\n  wrapperProps,\n  renderedData,\n  isOpen,\n  menuWidth,\n  getText,\n  getIdentifier,\n  isActiveItem,\n  modelHighlightedIndex,\n  moveHighlight,\n  applyHighlighted,\n  valueKey,\n} = useDropdownMenu<TValue, TItem>({\n  itemHeight: itemHeight ?? getOptionHeight(dense),\n  keyAttr,\n  textAttr,\n  options: () => options,\n  dense: () => dense,\n  value,\n  menuRef,\n  disabled: () => disabled,\n  autoSelectFirst,\n  setValue,\n  prependWidth,\n  appendWidth,\n});\n\nconst ui = computed<ReturnType<typeof menuSelectStyles>>(() => menuSelectStyles({\n  opened: get(isOpen),\n  hovered: get(isHovered),\n  dense,\n  disabled,\n  readonly: readOnly,\n  hasError: get(hasError),\n  hasSuccess: get(hasSuccess) && !get(hasError),\n}));\n\nconst highlightedClass = menuSelectStyles({}).highlighted();\n\nfunction clear(): void {\n  set(modelValue, undefined);\n}\n\nconst menuFloatingOptions = computed<FloatingOptions>(() => ({\n  placement: Placement.bottomStart,\n  ...menuOptions?.options,\n}));\n</script>\n\n<template>\n  <RuiMenu\n    v-model=\"isOpen\"\n    v-bind=\"{ ...getRootAttrs($attrs, []), ...menuOptions }\"\n    :class=\"ui.wrapper({ class: cn($attrs.class) })\"\n    :class-names=\"{ ...menuOptions?.classNames, details: ['px-0', cn(menuOptions?.classNames?.details) ?? ''] }\"\n    :options=\"menuFloatingOptions\"\n    close-on-content-click\n    full-width\n    :error-messages=\"errorMessages\"\n    :success-messages=\"successMessages\"\n    :hint=\"hint\"\n    :dense=\"dense\"\n    :show-details=\"!hideDetails\"\n    :disabled=\"disabled\"\n    disable-auto-focus\n    role=\"listbox\"\n  >\n    <template\n      v-if=\"label\"\n      #label\n    >\n      <RuiFieldLabel\n        :id=\"labelId\"\n        :text=\"label\"\n        :hidden=\"placement === 'hidden'\"\n        :required=\"required\"\n        :disabled=\"disabled\"\n      />\n    </template>\n    <template #activator=\"{ attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\">\n      <slot\n        name=\"activator\"\n        v-bind=\"{ disabled, value, readOnly, attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\"\n      >\n        <!-- a select-only combobox: the button opens a listbox of options, and carries the field's state -->\n        <button\n          ref=\"activator\"\n          role=\"combobox\"\n          :disabled=\"disabled\"\n          :aria-disabled=\"disabled\"\n          :aria-expanded=\"isOpen\"\n          :aria-readonly=\"readOnly || undefined\"\n          :aria-required=\"required || undefined\"\n          :aria-busy=\"loading || undefined\"\n          :aria-labelledby=\"label ? labelId : undefined\"\n          type=\"button\"\n          :tabindex=\"disabled || readOnly ? -1 : 0\"\n          :class=\"ui.activator({ class: cn(classNames?.label) })\"\n          v-bind=\"{\n            ...getNonRootAttrs($attrs),\n            ...(readOnly ? {} : attrs),\n          }\"\n          data-id=\"activator\"\n          :aria-invalid=\"hasError\"\n          @mouseenter=\"isHovered = true\"\n          @mouseleave=\"isHovered = false\"\n          @keydown.up.prevent=\"moveHighlight(true)\"\n          @keydown.down.prevent=\"moveHighlight(false)\"\n          @keydown.enter.prevent=\"applyHighlighted()\"\n          @keydown.space.prevent=\"applyHighlighted()\"\n          @keydown.home.prevent=\"modelHighlightedIndex = 0\"\n          @keydown.end.prevent=\"modelHighlightedIndex = options.length - 1\"\n        >\n          <span\n            v-if=\"value\"\n            :class=\"ui.value()\"\n          >\n            <slot\n              name=\"selection.prepend\"\n              v-bind=\"{ item: value }\"\n            />\n            <slot\n              name=\"selection\"\n              v-bind=\"{ item: value }\"\n            >\n              {{ getText(value) }}\n            </slot>\n          </span>\n\n          <span\n            v-if=\"clearable && value && !disabled && !readOnly\"\n            data-id=\"clear\"\n            :class=\"[ui.clear(), focused && 'visible!', { 'mr-2': !dense }]\"\n            @click.stop.prevent=\"clear()\"\n          >\n            <RuiIcon\n              name=\"lu-x\"\n              size=\"16\"\n            />\n          </span>\n\n          <span :class=\"ui.iconWrapper()\">\n            <RuiIcon\n              :class=\"ui.icon()\"\n              :size=\"dense ? 16 : 20\"\n              name=\"lu-chevron-down\"\n            />\n          </span>\n\n          <RuiProgress\n            v-if=\"loading\"\n            :class=\"ui.progress()\"\n            color=\"primary\"\n            thickness=\"2\"\n            variant=\"indeterminate\"\n          />\n        </button>\n        <fieldset :class=\"ui.fieldset()\" />\n      </slot>\n      <input\n        :value=\"valueKey\"\n        class=\"hidden\"\n        type=\"hidden\"\n      />\n    </template>\n    <template #default=\"{ width }\">\n      <div\n        v-if=\"options.length > 0\"\n        :ref=\"containerProps.ref\"\n        :class=\"ui.menu({ class: cn(classNames?.menu) })\"\n        :style=\"[containerProps.style, { width: `${width}px`, minWidth: menuWidth }]\"\n        @scroll=\"containerProps.onScroll\"\n        @keydown.up.prevent=\"moveHighlight(true)\"\n        @keydown.down.prevent=\"moveHighlight(false)\"\n      >\n        <div\n          v-bind=\"wrapperProps\"\n          ref=\"menuRef\"\n        >\n          <RuiButton\n            v-for=\"{ item, _index } in renderedData\"\n            :key=\"getIdentifier(item)\"\n            :active=\"isActiveItem(item)\"\n            role=\"option\"\n            :aria-selected=\"isActiveItem(item)\"\n            :size=\"dense ? 'sm' : undefined\"\n            variant=\"list\"\n            :data-highlighted=\"modelHighlightedIndex === _index\"\n            :class=\"{\n              [highlightedClass]: !isActiveItem(item) && modelHighlightedIndex === _index,\n            }\"\n            @click=\"setValue(item)\"\n          >\n            <template #prepend>\n              <slot\n                name=\"item.prepend\"\n                v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n              />\n            </template>\n            <slot\n              name=\"item\"\n              v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n            >\n              {{ getText(item) }}\n            </slot>\n            <template #append>\n              <slot\n                name=\"item.append\"\n                v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n              />\n            </template>\n          </RuiButton>\n        </div>\n      </div>\n\n      <div\n        v-else-if=\"!hideNoData\"\n        data-id=\"no-data\"\n        :style=\"{ width: `${width}px`, minWidth: menuWidth }\"\n        :class=\"classNames?.menu\"\n      >\n        <slot name=\"no-data\">\n          <div class=\"p-4\">\n            {{ noDataText }}\n          </div>\n        </slot>\n      </div>\n    </template>\n  </RuiMenu>\n</template>\n"],"mappings":"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"}