@rotki/ui-library 3.2.0 → 3.3.0

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

@@ -1,5 +1,6 @@
 import type { ContextColorsType } from '../../../consts/colors.js';
 import type { RuiIcons } from '../../../icons/index.js';
+import type { InputAttributes } from '../../../types/attributes.js';
 import { type LabelPlacement } from '../../../composables/defaults/field.js';
 import { type FormDetails } from '../../../utils/form-text-detail.js';
 export interface TextFieldProps {
@@ -24,7 +25,7 @@ export interface TextFieldProps {
     clearable?: boolean;
     required?: boolean;
 }
-type __VLS_Props = TextFieldProps;
+type __VLS_Props = TextFieldProps & /* @vue-ignore */ Omit<InputAttributes, keyof TextFieldProps | 'onBlur'>;
 type __VLS_Slots = {
     prepend?: () => any;
     append?: () => any;
@@ -33,6 +34,7 @@ type __VLS_Slots = {
 };
 type __VLS_ModelProps = {
     modelValue: string;
+    'modelModifiers'?: Partial<Record<'trim', true>>;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {

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

@@ -1 +1 @@
-{"version":3,"file":"RuiTextField.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$slots","_useModel","_openBlock","_createElementBlock","_normalizeProps","_guardReactiveProps","_unref","_createBlock","RuiFieldLabel","_createCommentVNode","_createElementVNode","_normalizeClass","_renderSlot","_createVNode","RuiIcon","_mergeProps","RuiButton","_withModifiers","_withCtx","RuiFormTextDetail","_createSlots"],"sources":["../../../../src/components/forms/text-field/RuiTextField.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { ContextColorsType } from '@/consts/colors';\nimport type { RuiIcons } from '@/icons';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiFieldLabel from '@/components/forms/field-label/RuiFieldLabel.vue';\nimport { textFieldStyles } from '@/components/forms/text-field/text-field-styles';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport { type LabelPlacement, useLabelPlacement } from '@/composables/defaults/field';\nimport { useTimeoutManager } from '@/composables/timeout-manager';\nimport { type FormDetails, useFormDetails, useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\n\nexport interface TextFieldProps {\n  label?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  /** Where the label shows; falls back to the nearest `RuiFieldDefaults`, then the app default, then `top`. */\n  labelPlacement?: LabelPlacement;\n  color?: ContextColorsType;\n  textColor?: ContextColorsType;\n  dense?: boolean;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  /** The line under the field for its hint and messages: `reserve`, `auto` or `hidden`; falls back to the nearest `RuiFieldDefaults`, then the app default, then `reserve`. */\n  details?: FormDetails;\n  /** @deprecated Use `details=\"hidden\"`. Removed in 4.0. */\n  hideDetails?: boolean;\n  prependIcon?: RuiIcons;\n  appendIcon?: RuiIcons;\n  readonly?: boolean;\n  clearable?: boolean;\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiTextField',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<string>({ required: true });\n\nconst {\n  label = '',\n  placeholder = '',\n  disabled = false,\n  labelPlacement = undefined,\n  color = undefined,\n  textColor = undefined,\n  dense = false,\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  details = undefined,\n  hideDetails = false,\n  prependIcon = undefined,\n  appendIcon = undefined,\n  readonly = false,\n  clearable = false,\n  required = false,\n} = defineProps<TextFieldProps>();\n\nconst emit = defineEmits<{\n  'focus-input': [event: Event];\n  'blur': [event: Event];\n  'remove': [value: unknown];\n  'clear': [];\n}>();\n\ndefineSlots<{\n  prepend?: () => any;\n  append?: () => any;\n  /** Rich hint content under the field, in place of the `hint` text; error and success messages still take precedence. */\n  hint?: () => any;\n}>();\n\nconst isHovered = ref<boolean>(false);\nconst showClearButton = ref<boolean>(false);\n\nconst inputRef = useTemplateRef<HTMLInputElement>('inputRef');\n\nconst generatedId = useId();\nconst attrs = useAttrs();\n\nconst { focused } = useFocus(inputRef);\nconst placement = useLabelPlacement(() => labelPlacement);\nconst { clear: cancelClearHide, create: delayClearHide } = useTimeoutManager();\nconst { hasError, hasSuccess, hasMessages, validation } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\nconst detailsMode = useFormDetails(() => details, () => hideDetails);\n\nconst inputId = computed<string>(() => {\n  const id = attrs.id;\n  return typeof id === 'string' && id ? id : generatedId;\n});\n\nconst showClearIcon = computed<boolean>(() => clearable && !!get(modelValue) && !disabled && !readonly);\n\nconst effectiveTextColor = computed<ContextColorsType | undefined>(() => {\n  if (get(hasError))\n    return 'error';\n  if (get(hasSuccess))\n    return 'success';\n  if (textColor && !get(hasMessages))\n    return textColor;\n  return undefined;\n});\n\nconst effectiveColor = computed<ContextColorsType | undefined>(() => get(validation) ?? color);\n\nconst ui = computed<ReturnType<typeof textFieldStyles>>(() => textFieldStyles({\n  dense,\n  disabled,\n  readonly,\n  hovered: get(isHovered),\n  focused: get(focused),\n  color: get(effectiveColor),\n  textColor: get(effectiveTextColor),\n  validation: get(validation),\n}));\n\nfunction input(event: Event): void {\n  const target = event.target;\n  if (target instanceof HTMLInputElement) {\n    set(modelValue, target.value);\n  }\n}\n\nfunction clearIconClicked(): void {\n  set(modelValue, '');\n  emit('clear');\n}\n\nwatch(focused, (value) => {\n  if (value) {\n    // a refocus within the delay keeps the button\n    cancelClearHide();\n    set(showClearButton, true);\n  }\n  else {\n    delayClearHide(() => set(showClearButton, false), 500);\n  }\n});\n\ndefineExpose({\n  setSelectionRange: (start: number, end: number) => {\n    get(inputRef)?.setSelectionRange(start, end);\n  },\n  focus: () => get(inputRef)?.focus(),\n  element: inputRef,\n});\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <RuiFieldLabel\n      v-if=\"label\"\n      :text=\"label\"\n      :for=\"inputId\"\n      :hidden=\"placement === 'hidden'\"\n      :required=\"required\"\n      :disabled=\"disabled\"\n    />\n    <div\n      :class=\"ui.wrapper()\"\n      data-id=\"wrapper\"\n      @mouseenter=\"isHovered = true\"\n      @mouseleave=\"isHovered = false\"\n    >\n      <div\n        v-if=\"$slots.prepend || prependIcon\"\n        :class=\"ui.prepend()\"\n        data-id=\"prepend\"\n      >\n        <slot\n          v-if=\"$slots.prepend\"\n          name=\"prepend\"\n        />\n        <div\n          v-else-if=\"prependIcon\"\n          :class=\"ui.icon()\"\n        >\n          <RuiIcon\n            :name=\"prependIcon\"\n            :size=\"18\"\n          />\n        </div>\n      </div>\n      <div\n        :class=\"ui.inputWrapper()\"\n        @click=\"emit('focus-input', $event)\"\n      >\n        <input\n          :id=\"inputId\"\n          ref=\"inputRef\"\n          :value=\"modelValue\"\n          :placeholder=\"placeholder || ' '\"\n          :class=\"ui.input()\"\n          :disabled=\"disabled\"\n          :readonly=\"readonly\"\n          :aria-invalid=\"hasError\"\n          v-bind=\"getNonRootAttrs($attrs)\"\n          @input=\"input($event)\"\n          @blur=\"emit('blur', $event)\"\n          @remove=\"emit('remove', $event)\"\n        />\n        <fieldset :class=\"ui.fieldset()\" />\n      </div>\n      <div\n        v-if=\"$slots.append || appendIcon || showClearIcon\"\n        :class=\"ui.append()\"\n        data-id=\"append\"\n      >\n        <RuiButton\n          v-if=\"showClearIcon\"\n          :class=\"[ui.clearButton(), { hidden: !showClearButton }]\"\n          variant=\"text\"\n          type=\"button\"\n          icon\n          data-id=\"clear-btn\"\n          aria-label=\"Clear\"\n          tabindex=\"-1\"\n          @click.stop=\"clearIconClicked()\"\n        >\n          <RuiIcon\n            name=\"lu-x\"\n            size=\"16\"\n          />\n        </RuiButton>\n        <slot\n          v-if=\"$slots.append\"\n          name=\"append\"\n        />\n        <div\n          v-else-if=\"appendIcon\"\n          :class=\"ui.icon()\"\n        >\n          <RuiIcon\n            :name=\"appendIcon\"\n            :size=\"18\"\n          />\n        </div>\n      </div>\n    </div>\n    <RuiFormTextDetail\n      v-if=\"detailsMode !== 'hidden'\"\n      :details=\"detailsMode\"\n      :error-messages=\"errorMessages\"\n      :success-messages=\"successMessages\"\n      :hint=\"hint\"\n    >\n      <template\n        v-if=\"$slots.hint\"\n        #hint\n      >\n        <slot name=\"hint\" />\n      </template>\n    </RuiFormTextDetail>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"RuiTextField.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$slots","_useModel","_openBlock","_createElementBlock","_normalizeProps","_guardReactiveProps","_unref","_createBlock","RuiFieldLabel","_createCommentVNode","_createElementVNode","_normalizeClass","_renderSlot","_createVNode","RuiIcon","_mergeProps","RuiButton","_withModifiers","_withCtx","RuiFormTextDetail","_createSlots"],"sources":["../../../../src/components/forms/text-field/RuiTextField.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { ContextColorsType } from '@/consts/colors';\nimport type { RuiIcons } from '@/icons';\nimport type { InputAttributes } from '@/types/attributes';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiFieldLabel from '@/components/forms/field-label/RuiFieldLabel.vue';\nimport { textFieldStyles } from '@/components/forms/text-field/text-field-styles';\nimport RuiFormTextDetail from '@/components/helpers/RuiFormTextDetail.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport { type LabelPlacement, useLabelPlacement } from '@/composables/defaults/field';\nimport { useTimeoutManager } from '@/composables/timeout-manager';\nimport { type FormDetails, useFormDetails, useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\n\nexport interface TextFieldProps {\n  label?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  /** Where the label shows; falls back to the nearest `RuiFieldDefaults`, then the app default, then `top`. */\n  labelPlacement?: LabelPlacement;\n  color?: ContextColorsType;\n  textColor?: ContextColorsType;\n  dense?: boolean;\n  hint?: string;\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  /** The line under the field for its hint and messages: `reserve`, `auto` or `hidden`; falls back to the nearest `RuiFieldDefaults`, then the app default, then `reserve`. */\n  details?: FormDetails;\n  /** @deprecated Use `details=\"hidden\"`. Removed in 4.0. */\n  hideDetails?: boolean;\n  prependIcon?: RuiIcons;\n  appendIcon?: RuiIcons;\n  readonly?: boolean;\n  clearable?: boolean;\n  required?: boolean;\n}\n\ndefineOptions({\n  name: 'RuiTextField',\n  inheritAttrs: false,\n});\n\n// `v-model.trim` trims the update, which Vue applies to any model event\nconst modelValue = defineModel<string, 'trim'>({ required: true });\n\nconst {\n  label = '',\n  placeholder = '',\n  disabled = false,\n  labelPlacement = undefined,\n  color = undefined,\n  textColor = undefined,\n  dense = false,\n  hint = '',\n  errorMessages = [],\n  successMessages = [],\n  details = undefined,\n  hideDetails = false,\n  prependIcon = undefined,\n  appendIcon = undefined,\n  readonly = false,\n  clearable = false,\n  required = false,\n} = defineProps<TextFieldProps & /* @vue-ignore */ Omit<InputAttributes, keyof TextFieldProps | 'onBlur'>>();\n\nconst emit = defineEmits<{\n  'focus-input': [event: Event];\n  'blur': [event: Event];\n  'remove': [value: unknown];\n  'clear': [];\n}>();\n\ndefineSlots<{\n  prepend?: () => any;\n  append?: () => any;\n  /** Rich hint content under the field, in place of the `hint` text; error and success messages still take precedence. */\n  hint?: () => any;\n}>();\n\nconst isHovered = ref<boolean>(false);\nconst showClearButton = ref<boolean>(false);\n\nconst inputRef = useTemplateRef<HTMLInputElement>('inputRef');\n\nconst generatedId = useId();\nconst attrs = useAttrs();\n\nconst { focused } = useFocus(inputRef);\nconst placement = useLabelPlacement(() => labelPlacement);\nconst { clear: cancelClearHide, create: delayClearHide } = useTimeoutManager();\nconst { hasError, hasSuccess, hasMessages, validation } = useFormTextDetail(\n  () => errorMessages,\n  () => successMessages,\n);\nconst detailsMode = useFormDetails(() => details, () => hideDetails);\n\nconst inputId = computed<string>(() => {\n  const id = attrs.id;\n  return typeof id === 'string' && id ? id : generatedId;\n});\n\nconst showClearIcon = computed<boolean>(() => clearable && !!get(modelValue) && !disabled && !readonly);\n\nconst effectiveTextColor = computed<ContextColorsType | undefined>(() => {\n  if (get(hasError))\n    return 'error';\n  if (get(hasSuccess))\n    return 'success';\n  if (textColor && !get(hasMessages))\n    return textColor;\n  return undefined;\n});\n\nconst effectiveColor = computed<ContextColorsType | undefined>(() => get(validation) ?? color);\n\nconst ui = computed<ReturnType<typeof textFieldStyles>>(() => textFieldStyles({\n  dense,\n  disabled,\n  readonly,\n  hovered: get(isHovered),\n  focused: get(focused),\n  color: get(effectiveColor),\n  textColor: get(effectiveTextColor),\n  validation: get(validation),\n}));\n\nfunction input(event: Event): void {\n  const target = event.target;\n  if (target instanceof HTMLInputElement) {\n    set(modelValue, target.value);\n  }\n}\n\nfunction clearIconClicked(): void {\n  set(modelValue, '');\n  emit('clear');\n}\n\nwatch(focused, (value) => {\n  if (value) {\n    // a refocus within the delay keeps the button\n    cancelClearHide();\n    set(showClearButton, true);\n  }\n  else {\n    delayClearHide(() => set(showClearButton, false), 500);\n  }\n});\n\ndefineExpose({\n  setSelectionRange: (start: number, end: number) => {\n    get(inputRef)?.setSelectionRange(start, end);\n  },\n  focus: () => get(inputRef)?.focus(),\n  element: inputRef,\n});\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <RuiFieldLabel\n      v-if=\"label\"\n      :text=\"label\"\n      :for=\"inputId\"\n      :hidden=\"placement === 'hidden'\"\n      :required=\"required\"\n      :disabled=\"disabled\"\n    />\n    <div\n      :class=\"ui.wrapper()\"\n      data-id=\"wrapper\"\n      @mouseenter=\"isHovered = true\"\n      @mouseleave=\"isHovered = false\"\n    >\n      <div\n        v-if=\"$slots.prepend || prependIcon\"\n        :class=\"ui.prepend()\"\n        data-id=\"prepend\"\n      >\n        <slot\n          v-if=\"$slots.prepend\"\n          name=\"prepend\"\n        />\n        <div\n          v-else-if=\"prependIcon\"\n          :class=\"ui.icon()\"\n        >\n          <RuiIcon\n            :name=\"prependIcon\"\n            :size=\"18\"\n          />\n        </div>\n      </div>\n      <div\n        :class=\"ui.inputWrapper()\"\n        @click=\"emit('focus-input', $event)\"\n      >\n        <input\n          :id=\"inputId\"\n          ref=\"inputRef\"\n          :value=\"modelValue\"\n          :placeholder=\"placeholder || ' '\"\n          :class=\"ui.input()\"\n          :disabled=\"disabled\"\n          :readonly=\"readonly\"\n          :aria-invalid=\"hasError\"\n          v-bind=\"getNonRootAttrs($attrs)\"\n          @input=\"input($event)\"\n          @blur=\"emit('blur', $event)\"\n          @remove=\"emit('remove', $event)\"\n        />\n        <fieldset :class=\"ui.fieldset()\" />\n      </div>\n      <div\n        v-if=\"$slots.append || appendIcon || showClearIcon\"\n        :class=\"ui.append()\"\n        data-id=\"append\"\n      >\n        <RuiButton\n          v-if=\"showClearIcon\"\n          :class=\"[ui.clearButton(), { hidden: !showClearButton }]\"\n          variant=\"text\"\n          type=\"button\"\n          icon\n          data-id=\"clear-btn\"\n          aria-label=\"Clear\"\n          tabindex=\"-1\"\n          @click.stop=\"clearIconClicked()\"\n        >\n          <RuiIcon\n            name=\"lu-x\"\n            size=\"16\"\n          />\n        </RuiButton>\n        <slot\n          v-if=\"$slots.append\"\n          name=\"append\"\n        />\n        <div\n          v-else-if=\"appendIcon\"\n          :class=\"ui.icon()\"\n        >\n          <RuiIcon\n            :name=\"appendIcon\"\n            :size=\"18\"\n          />\n        </div>\n      </div>\n    </div>\n    <RuiFormTextDetail\n      v-if=\"detailsMode !== 'hidden'\"\n      :details=\"detailsMode\"\n      :error-messages=\"errorMessages\"\n      :success-messages=\"successMessages\"\n      :hint=\"hint\"\n    >\n      <template\n        v-if=\"$slots.hint\"\n        #hint\n      >\n        <slot name=\"hint\" />\n      </template>\n    </RuiFormTextDetail>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/icons/RuiIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiIcon.js","names":["_sfc_main"],"sources":["../../../src/components/icons/RuiIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { ClassValue } from 'vue';\nimport type { ContextColorsType } from '@/consts/colors';\nimport type { RuiIcons } from '@/icons';\nimport { objectOmit } from '@vueuse/shared';\nimport { useIcons } from '@/composables/icons';\nimport { cn } from '@/utils/tv';\nimport { iconStyles } from './icon-styles';\n\nexport interface Props {\n  name: RuiIcons;\n  size?: number | string;\n  color?: ContextColorsType;\n}\n\ndefineOptions({\n  name: 'RuiIcon',\n  // A fallthrough class would land beside the variant classes and leave the cascade to break the tie; `ui` merges instead\n  inheritAttrs: false,\n});\n\nconst { name, size, color } = defineProps<Props>();\n\nconst { registeredIcons } = useIcons();\n\ntype SvgComponent = [tag: string, attrs: Record<string, string>];\n\nconst hasExplicitSize = computed<boolean>(() => size !== undefined);\n\nfunction ui(attrsClass: ClassValue): string {\n  return iconStyles({ color, class: cn(attrsClass) });\n}\n\n/**\n * The `size` prop as an inline CSS custom property on the svg. Inline style\n * beats any inherited value for the same property on this element, so a\n * consumer's size beats the button's `--rui-icon-size` without !important.\n *\n * A bare number is coerced to px, including the numeric string a template\n * binding like `:size=\"16\"` resolves to, while a value that already carries a\n * unit passes through. CSS needs that coercion; the `width`/`height`\n * presentation attributes this replaced treated bare numbers as px themselves.\n */\nconst sizeStyle = computed<Record<string, string> | undefined>(() => {\n  if (!get(hasExplicitSize))\n    return undefined;\n  const raw = String(size);\n  const value = /^\\d+(?:\\.\\d+)?$/.test(raw) ? `${raw}px` : raw;\n  return { '--rui-icon-size': value };\n});\n\n/**\n * What is registered is the only thing that matters here. An app may register\n * its own icons through `createRui(\\{ theme: \\{ icons \\} \\})`, brand logos\n * among them since the library carries none, and those names never appear in\n * the generated `RuiIcons` list. Validating against that list warned for\n * precisely the icons the registration API exists to support. A genuinely\n * unknown name is still caught by the check that decides whether anything\n * renders.\n */\nconst components = computed<SvgComponent[] | undefined>(() => {\n  const found = registeredIcons[name];\n\n  if (!found) {\n    console.error(\n      `Icons \"${name}\" not found. Make sure that you have register the icon when installing the RuiPlugin`,\n    );\n  }\n  return found;\n});\n</script>\n\n<template>\n  <svg\n    aria-hidden=\"true\"\n    class=\"rui-icon\"\n    :class=\"ui($attrs.class)\"\n    :style=\"sizeStyle\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    stroke-linecap=\"round\"\n    stroke-linejoin=\"round\"\n    v-bind=\"objectOmit($attrs, ['class'])\"\n  >\n    <component\n      :is=\"component[0]\"\n      v-for=\"(component, index) in components\"\n      :key=\"index\"\n      v-bind=\"component[1]\"\n    />\n  </svg>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiIcon.js","names":["_sfc_main"],"sources":["../../../src/components/icons/RuiIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { ClassValue, SVGAttributes } from 'vue';\nimport type { ContextColorsType } from '@/consts/colors';\nimport type { RuiIcons } from '@/icons';\nimport { objectOmit } from '@vueuse/shared';\nimport { useIcons } from '@/composables/icons';\nimport { cn } from '@/utils/tv';\nimport { iconStyles } from './icon-styles';\n\nexport interface Props {\n  name: RuiIcons;\n  size?: number | string;\n  color?: ContextColorsType;\n}\n\ndefineOptions({\n  name: 'RuiIcon',\n  // A fallthrough class would land beside the variant classes and leave the cascade to break the tie; `ui` merges instead\n  inheritAttrs: false,\n});\n\nconst { name, size, color } = defineProps<Props & /* @vue-ignore */ Omit<SVGAttributes, keyof Props>>();\n\nconst { registeredIcons } = useIcons();\n\ntype SvgComponent = [tag: string, attrs: Record<string, string>];\n\nconst hasExplicitSize = computed<boolean>(() => size !== undefined);\n\nfunction ui(attrsClass: ClassValue): string {\n  return iconStyles({ color, class: cn(attrsClass) });\n}\n\n/**\n * The `size` prop as an inline CSS custom property on the svg. Inline style\n * beats any inherited value for the same property on this element, so a\n * consumer's size beats the button's `--rui-icon-size` without !important.\n *\n * A bare number is coerced to px, including the numeric string a template\n * binding like `:size=\"16\"` resolves to, while a value that already carries a\n * unit passes through. CSS needs that coercion; the `width`/`height`\n * presentation attributes this replaced treated bare numbers as px themselves.\n */\nconst sizeStyle = computed<Record<string, string> | undefined>(() => {\n  if (!get(hasExplicitSize))\n    return undefined;\n  const raw = String(size);\n  const value = /^\\d+(?:\\.\\d+)?$/.test(raw) ? `${raw}px` : raw;\n  return { '--rui-icon-size': value };\n});\n\n/**\n * What is registered is the only thing that matters here. An app may register\n * its own icons through `createRui(\\{ theme: \\{ icons \\} \\})`, brand logos\n * among them since the library carries none, and those names never appear in\n * the generated `RuiIcons` list. Validating against that list warned for\n * precisely the icons the registration API exists to support. A genuinely\n * unknown name is still caught by the check that decides whether anything\n * renders.\n */\nconst components = computed<SvgComponent[] | undefined>(() => {\n  const found = registeredIcons[name];\n\n  if (!found) {\n    console.error(\n      `Icons \"${name}\" not found. Make sure that you have register the icon when installing the RuiPlugin`,\n    );\n  }\n  return found;\n});\n</script>\n\n<template>\n  <svg\n    aria-hidden=\"true\"\n    class=\"rui-icon\"\n    :class=\"ui($attrs.class)\"\n    :style=\"sizeStyle\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    stroke-linecap=\"round\"\n    stroke-linejoin=\"round\"\n    v-bind=\"objectOmit($attrs, ['class'])\"\n  >\n    <component\n      :is=\"component[0]\"\n      v-for=\"(component, index) in components\"\n      :key=\"index\"\n      v-bind=\"component[1]\"\n    />\n  </svg>\n</template>\n"],"mappings":""}

package/dist/components/icons/RuiIcon.vue.d.ts

@@ -1,3 +1,4 @@
+import type { SVGAttributes } from 'vue';
 import type { ContextColorsType } from '../../consts/colors.js';
 import type { RuiIcons } from '../../icons/index.js';
 export interface Props {
@@ -5,6 +6,7 @@ export interface Props {
     size?: number | string;
     color?: ContextColorsType;
 }
-declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+type __VLS_Props = Props & /* @vue-ignore */ Omit<SVGAttributes, keyof Props>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/icons/RuiIcon.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiIcon.vue_vue_type_script_setup_true_lang.js","names":["$attrs","_openBlock","_createElementBlock","_mergeProps","_unref","_Fragment","_renderList","_createBlock","_resolveDynamicComponent"],"sources":["../../../src/components/icons/RuiIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { ClassValue } from 'vue';\nimport type { ContextColorsType } from '@/consts/colors';\nimport type { RuiIcons } from '@/icons';\nimport { objectOmit } from '@vueuse/shared';\nimport { useIcons } from '@/composables/icons';\nimport { cn } from '@/utils/tv';\nimport { iconStyles } from './icon-styles';\n\nexport interface Props {\n  name: RuiIcons;\n  size?: number | string;\n  color?: ContextColorsType;\n}\n\ndefineOptions({\n  name: 'RuiIcon',\n  // A fallthrough class would land beside the variant classes and leave the cascade to break the tie; `ui` merges instead\n  inheritAttrs: false,\n});\n\nconst { name, size, color } = defineProps<Props>();\n\nconst { registeredIcons } = useIcons();\n\ntype SvgComponent = [tag: string, attrs: Record<string, string>];\n\nconst hasExplicitSize = computed<boolean>(() => size !== undefined);\n\nfunction ui(attrsClass: ClassValue): string {\n  return iconStyles({ color, class: cn(attrsClass) });\n}\n\n/**\n * The `size` prop as an inline CSS custom property on the svg. Inline style\n * beats any inherited value for the same property on this element, so a\n * consumer's size beats the button's `--rui-icon-size` without !important.\n *\n * A bare number is coerced to px, including the numeric string a template\n * binding like `:size=\"16\"` resolves to, while a value that already carries a\n * unit passes through. CSS needs that coercion; the `width`/`height`\n * presentation attributes this replaced treated bare numbers as px themselves.\n */\nconst sizeStyle = computed<Record<string, string> | undefined>(() => {\n  if (!get(hasExplicitSize))\n    return undefined;\n  const raw = String(size);\n  const value = /^\\d+(?:\\.\\d+)?$/.test(raw) ? `${raw}px` : raw;\n  return { '--rui-icon-size': value };\n});\n\n/**\n * What is registered is the only thing that matters here. An app may register\n * its own icons through `createRui(\\{ theme: \\{ icons \\} \\})`, brand logos\n * among them since the library carries none, and those names never appear in\n * the generated `RuiIcons` list. Validating against that list warned for\n * precisely the icons the registration API exists to support. A genuinely\n * unknown name is still caught by the check that decides whether anything\n * renders.\n */\nconst components = computed<SvgComponent[] | undefined>(() => {\n  const found = registeredIcons[name];\n\n  if (!found) {\n    console.error(\n      `Icons \"${name}\" not found. Make sure that you have register the icon when installing the RuiPlugin`,\n    );\n  }\n  return found;\n});\n</script>\n\n<template>\n  <svg\n    aria-hidden=\"true\"\n    class=\"rui-icon\"\n    :class=\"ui($attrs.class)\"\n    :style=\"sizeStyle\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    stroke-linecap=\"round\"\n    stroke-linejoin=\"round\"\n    v-bind=\"objectOmit($attrs, ['class'])\"\n  >\n    <component\n      :is=\"component[0]\"\n      v-for=\"(component, index) in components\"\n      :key=\"index\"\n      v-bind=\"component[1]\"\n    />\n  </svg>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;EAuBA,MAAM,EAAE,oBAAoB,SAAS;EAIrC,MAAM,kBAAkB,eAAwB,QAAA,SAAS,KAAA,CAAS;EAElE,SAAS,GAAG,YAAgC;GAC1C,OAAO,WAAW;IAAE,OAAI,QAAA;IAAG,OAAO,GAAG,UAAU;GAAE,CAAC;EACpD;;;;;;;;;;;EAYA,MAAM,YAAY,eAAmD;GACnE,IAAI,CAAC,IAAI,eAAe,GACtB,OAAO,KAAA;GACT,MAAM,MAAM,OAAO,QAAA,IAAI;GAEvB,OAAO,EAAE,mBADK,kBAAkB,KAAK,GAAG,IAAI,GAAG,IAAI,MAAM,IACvB;EACpC,CAAC;;;;;;;;;;EAWD,MAAM,aAAa,eAA2C;GAC5D,MAAM,QAAQ,gBAAgB,QAAA;GAE9B,IAAI,CAAC,OACH,QAAQ,MACN,UAAU,QAAA,KAAK,qFACjB;GAEF,OAAO;EACT,CAAC;;GAIC,OAAAC,UAAA,GAAAC,mBAmBM,OAnBNC,WAmBM;IAlBJ,eAAY;IACZ,OAAK,CAAC,YACE,GAAGH,KAAAA,OAAO,KAAK,CAAA;IACtB,OAAOI,MAAA,SAAA;IACR,SAAQ;IACR,OAAM;IACN,MAAK;IACL,QAAO;IACP,kBAAe;IACf,mBAAgB;GACR,GAAAA,MAAA,UAAA,CAAU,CAACJ,KAAAA,QAAM,CAAA,OAAA,CAAA,CAAA,GAAA,EAEzBC,UAAA,IAAA,GAAAC,mBAKEG,UAAA,MAAAC,WAH6BF,MAAA,UAAA,IAArB,WAAW,UAAK;IAF1B,OAAAH,UAAA,GAAAM,YAKEC,wBAJK,UAAS,EAAA,GADhBL,WAKE,EAFC,KAAK,MAAK,GAAA,EAAA,SAAA,KAAA,GACH,UAAS,EAAA,GAAA,MAAA,EAAA"}
+{"version":3,"file":"RuiIcon.vue_vue_type_script_setup_true_lang.js","names":["$attrs","_openBlock","_createElementBlock","_mergeProps","_unref","_Fragment","_renderList","_createBlock","_resolveDynamicComponent"],"sources":["../../../src/components/icons/RuiIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { ClassValue, SVGAttributes } from 'vue';\nimport type { ContextColorsType } from '@/consts/colors';\nimport type { RuiIcons } from '@/icons';\nimport { objectOmit } from '@vueuse/shared';\nimport { useIcons } from '@/composables/icons';\nimport { cn } from '@/utils/tv';\nimport { iconStyles } from './icon-styles';\n\nexport interface Props {\n  name: RuiIcons;\n  size?: number | string;\n  color?: ContextColorsType;\n}\n\ndefineOptions({\n  name: 'RuiIcon',\n  // A fallthrough class would land beside the variant classes and leave the cascade to break the tie; `ui` merges instead\n  inheritAttrs: false,\n});\n\nconst { name, size, color } = defineProps<Props & /* @vue-ignore */ Omit<SVGAttributes, keyof Props>>();\n\nconst { registeredIcons } = useIcons();\n\ntype SvgComponent = [tag: string, attrs: Record<string, string>];\n\nconst hasExplicitSize = computed<boolean>(() => size !== undefined);\n\nfunction ui(attrsClass: ClassValue): string {\n  return iconStyles({ color, class: cn(attrsClass) });\n}\n\n/**\n * The `size` prop as an inline CSS custom property on the svg. Inline style\n * beats any inherited value for the same property on this element, so a\n * consumer's size beats the button's `--rui-icon-size` without !important.\n *\n * A bare number is coerced to px, including the numeric string a template\n * binding like `:size=\"16\"` resolves to, while a value that already carries a\n * unit passes through. CSS needs that coercion; the `width`/`height`\n * presentation attributes this replaced treated bare numbers as px themselves.\n */\nconst sizeStyle = computed<Record<string, string> | undefined>(() => {\n  if (!get(hasExplicitSize))\n    return undefined;\n  const raw = String(size);\n  const value = /^\\d+(?:\\.\\d+)?$/.test(raw) ? `${raw}px` : raw;\n  return { '--rui-icon-size': value };\n});\n\n/**\n * What is registered is the only thing that matters here. An app may register\n * its own icons through `createRui(\\{ theme: \\{ icons \\} \\})`, brand logos\n * among them since the library carries none, and those names never appear in\n * the generated `RuiIcons` list. Validating against that list warned for\n * precisely the icons the registration API exists to support. A genuinely\n * unknown name is still caught by the check that decides whether anything\n * renders.\n */\nconst components = computed<SvgComponent[] | undefined>(() => {\n  const found = registeredIcons[name];\n\n  if (!found) {\n    console.error(\n      `Icons \"${name}\" not found. Make sure that you have register the icon when installing the RuiPlugin`,\n    );\n  }\n  return found;\n});\n</script>\n\n<template>\n  <svg\n    aria-hidden=\"true\"\n    class=\"rui-icon\"\n    :class=\"ui($attrs.class)\"\n    :style=\"sizeStyle\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    stroke-linecap=\"round\"\n    stroke-linejoin=\"round\"\n    v-bind=\"objectOmit($attrs, ['class'])\"\n  >\n    <component\n      :is=\"component[0]\"\n      v-for=\"(component, index) in components\"\n      :key=\"index\"\n      v-bind=\"component[1]\"\n    />\n  </svg>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;EAuBA,MAAM,EAAE,oBAAoB,SAAS;EAIrC,MAAM,kBAAkB,eAAwB,QAAA,SAAS,KAAA,CAAS;EAElE,SAAS,GAAG,YAAgC;GAC1C,OAAO,WAAW;IAAE,OAAI,QAAA;IAAG,OAAO,GAAG,UAAU;GAAE,CAAC;EACpD;;;;;;;;;;;EAYA,MAAM,YAAY,eAAmD;GACnE,IAAI,CAAC,IAAI,eAAe,GACtB,OAAO,KAAA;GACT,MAAM,MAAM,OAAO,QAAA,IAAI;GAEvB,OAAO,EAAE,mBADK,kBAAkB,KAAK,GAAG,IAAI,GAAG,IAAI,MAAM,IACvB;EACpC,CAAC;;;;;;;;;;EAWD,MAAM,aAAa,eAA2C;GAC5D,MAAM,QAAQ,gBAAgB,QAAA;GAE9B,IAAI,CAAC,OACH,QAAQ,MACN,UAAU,QAAA,KAAK,qFACjB;GAEF,OAAO;EACT,CAAC;;GAIC,OAAAC,UAAA,GAAAC,mBAmBM,OAnBNC,WAmBM;IAlBJ,eAAY;IACZ,OAAK,CAAC,YACE,GAAGH,KAAAA,OAAO,KAAK,CAAA;IACtB,OAAOI,MAAA,SAAA;IACR,SAAQ;IACR,OAAM;IACN,MAAK;IACL,QAAO;IACP,kBAAe;IACf,mBAAgB;GACR,GAAAA,MAAA,UAAA,CAAU,CAACJ,KAAAA,QAAM,CAAA,OAAA,CAAA,CAAA,GAAA,EAEzBC,UAAA,IAAA,GAAAC,mBAKEG,UAAA,MAAAC,WAH6BF,MAAA,UAAA,IAArB,WAAW,UAAK;IAF1B,OAAAH,UAAA,GAAAM,YAKEC,wBAJK,UAAS,EAAA,GADhBL,WAKE,EAFC,KAAK,MAAK,GAAA,EAAA,SAAA,KAAA,GACH,UAAS,EAAA,GAAA,MAAA,EAAA"}

package/dist/components/index.d.ts

@@ -35,7 +35,7 @@ import RuiSkeletonLoader, { type Props as SkeletonLoaderProps } from './loaders/
 import RuiLogo, { type Props as LogoProps } from './logos/RuiLogo.vue.js';
 import RuiBadge, { type Props as BadgeProps } from './overlays/badge/RuiBadge.vue.js';
 import RuiBottomSheet, { type BottomSheetProps } from './overlays/bottom-sheet/RuiBottomSheet.vue.js';
-import RuiDialog, { type DialogProps, type RuiDialogClassNames } from './overlays/dialog/RuiDialog.vue.js';
+import RuiDialog, { type DialogProps, type DialogSlots, type RuiDialogClassNames } from './overlays/dialog/RuiDialog.vue.js';
 import RuiMenu, { type MenuProps, type RuiMenuClassNames, type RuiMenuRole } from './overlays/menu/RuiMenu.vue.js';
 import RuiNavigationDrawer, { type NavigationDrawerProps, type RuiNavigationDrawerClassNames } from './overlays/navigation-drawer/RuiNavigationDrawer.vue.js';
 import RuiNotification, { type NotificationProps } from './overlays/notification/RuiNotification.vue.js';
@@ -55,5 +55,5 @@ import RuiTabItems from './tabs/tab-items/RuiTabItems.vue.js';
 import RuiTab, { type RuiTabClassNames, type Props as TabProps } from './tabs/tab/RuiTab.vue.js';
 import RuiTabs, { type Props as TabsProps } from './tabs/tabs/RuiTabs.vue.js';
 import RuiTimePicker, { type RuiTimePickerProps } from './time-picker/RuiTimePicker.vue.js';
-export type { AccordionProps, AccordionsProps, AlertProps, AutoCompleteProps, AvatarGroupProps, AvatarProps, BadgeProps, BottomSheetProps, ButtonGroupProps, ButtonProps, CalendarProps, CardHeaderProps, CardProps, CheckboxGroupProps, CheckboxProps, ChipProps, DataTableColumn, DataTableGroupKeys, DataTableOptions, DataTableProps, DataTableSortColumn, DataTableSortData, DialogProps, DividerProps, ExpandButtonProps, FieldDefaultsProps, FileUploadProps, FooterStepperProps, GroupData, IconProps, LogoProps, MenuProps, MenuSelectProps, NavigationDrawerProps, NotificationProps, ProgressProps, RadioGroupProps, RadioProps, RevealableTextFieldProps, RuiAccordionClassNames, RuiAutoCompleteClassNames, RuiCardClassNames, RuiCategoryPickerClassNames, RuiCategoryPickerProps, RuiChipClassNames, RuiDateTimePickerProps, RuiDialogClassNames, RuiMenuClassNames, RuiMenuRole, RuiMenuSelectClassNames, RuiNavigationDrawerClassNames, RuiSliderClassNames, RuiStepperClassNames, RuiTabClassNames, RuiTimePickerProps, RuiTimezoneSelectProps, RuiTooltipClassNames, SimpleSelectProps, SkeletonLoaderProps, SliderProps, StepperProps, SwitchProps, TabItemProps, TableEmpty, TableEmptyStateProps, TableErrorStateProps, TableLoadingStateProps, TablePaginationData, TablePaginationProps, TableProps, TabProps, TabsProps, TextAreaProps, TextFieldProps, TooltipProps, };
+export type { AccordionProps, AccordionsProps, AlertProps, AutoCompleteProps, AvatarGroupProps, AvatarProps, BadgeProps, BottomSheetProps, ButtonGroupProps, ButtonProps, CalendarProps, CardHeaderProps, CardProps, CheckboxGroupProps, CheckboxProps, ChipProps, DataTableColumn, DataTableGroupKeys, DataTableOptions, DataTableProps, DataTableSortColumn, DataTableSortData, DialogProps, DialogSlots, DividerProps, ExpandButtonProps, FieldDefaultsProps, FileUploadProps, FooterStepperProps, GroupData, IconProps, LogoProps, MenuProps, MenuSelectProps, NavigationDrawerProps, NotificationProps, ProgressProps, RadioGroupProps, RadioProps, RevealableTextFieldProps, RuiAccordionClassNames, RuiAutoCompleteClassNames, RuiCardClassNames, RuiCategoryPickerClassNames, RuiCategoryPickerProps, RuiChipClassNames, RuiDateTimePickerProps, RuiDialogClassNames, RuiMenuClassNames, RuiMenuRole, RuiMenuSelectClassNames, RuiNavigationDrawerClassNames, RuiSliderClassNames, RuiStepperClassNames, RuiTabClassNames, RuiTimePickerProps, RuiTimezoneSelectProps, RuiTooltipClassNames, SimpleSelectProps, SkeletonLoaderProps, SliderProps, StepperProps, SwitchProps, TabItemProps, TableEmpty, TableEmptyStateProps, TableErrorStateProps, TableLoadingStateProps, TablePaginationData, TablePaginationProps, TableProps, TabProps, TabsProps, TextAreaProps, TextFieldProps, TooltipProps, };
 export { RuiAccordion, RuiAccordions, RuiAlert, RuiAutoComplete, RuiAvatar, RuiAvatarGroup, RuiBadge, RuiBottomSheet, RuiButton, RuiButtonGroup, RuiCalendar, RuiCard, RuiCardHeader, RuiCategoryPicker, RuiCheckbox, RuiCheckboxGroup, RuiChip, RuiColorPicker, RuiDataTable, RuiDateTimePicker, RuiDialog, RuiDivider, RuiFieldDefaults, RuiFileUpload, RuiFooterStepper, RuiIcon, RuiLogo, RuiMenu, RuiMenuSelect, RuiNavigationDrawer, RuiNotification, RuiProgress, RuiRadio, RuiRadioGroup, RuiRevealableTextField, RuiSimpleSelect, RuiSkeletonLoader, RuiSlider, RuiStepper, RuiSwitch, RuiTab, RuiTabItem, RuiTabItems, RuiTable, RuiTableEmptyState, RuiTableErrorState, RuiTableLoadingState, RuiTablePagination, RuiTableRowExpander, RuiTabs, RuiTextArea, RuiTextField, RuiTimePicker, RuiTimezoneSelect, RuiTooltip, };

package/dist/components/loaders/RuiSkeletonLoader.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiSkeletonLoader.js","names":["_sfc_main"],"sources":["../../../src/components/loaders/RuiSkeletonLoader.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport RuiSkeletonBase, {\n  type Props as SkeletonBaseProps,\n} from '@/components/loaders/RuiSkeletonBase.vue';\nimport { SkeletonType } from '@/components/loaders/skeleton-type';\nimport { cn } from '@/utils/tv';\nimport { skeletonLoaderStyles } from './skeleton-loader-styles';\n\nexport interface Props extends SkeletonBaseProps {\n  type?: SkeletonType;\n}\n\ndefineOptions({\n  name: 'RuiSkeletonLoader',\n  inheritAttrs: false,\n});\n\nconst { type = SkeletonType.TEXT, rounded } = defineProps<Props>();\n\nconst multiLineTypes: SkeletonType[] = [SkeletonType.PARAGRAPH, SkeletonType.ARTICLE];\n\nconst attrs = useAttrs();\nconst ui = computed<string>(() => skeletonLoaderStyles({ type, class: cn(attrs.class) }));\nconst isMultiLine = computed<boolean>(() => multiLineTypes.includes(type));\n</script>\n\n<template>\n  <RuiSkeletonBase\n    v-if=\"!isMultiLine\"\n    :class=\"ui\"\n    :rounded=\"rounded\"\n    v-bind=\"{ ...attrs, class: undefined }\"\n  />\n  <div\n    v-else\n    :class=\"ui\"\n    v-bind=\"{ ...attrs, class: undefined }\"\n  >\n    <RuiSkeletonBase\n      v-if=\"type === SkeletonType.ARTICLE\"\n      class=\"w-full h-6 rounded-rui-control mb-1\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-rui-control\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-rui-control max-w-[80%]\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-rui-control max-w-[90%]\"\n      :rounded=\"rounded\"\n    />\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiSkeletonLoader.js","names":["_sfc_main"],"sources":["../../../src/components/loaders/RuiSkeletonLoader.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { HTMLAttributes } from 'vue';\nimport RuiSkeletonBase, {\n  type Props as SkeletonBaseProps,\n} from '@/components/loaders/RuiSkeletonBase.vue';\nimport { SkeletonType } from '@/components/loaders/skeleton-type';\nimport { cn } from '@/utils/tv';\nimport { skeletonLoaderStyles } from './skeleton-loader-styles';\n\nexport interface Props extends SkeletonBaseProps {\n  type?: SkeletonType;\n}\n\ndefineOptions({\n  name: 'RuiSkeletonLoader',\n  inheritAttrs: false,\n});\n\nconst { type = SkeletonType.TEXT, rounded } = defineProps<Props & /* @vue-ignore */ Omit<HTMLAttributes, keyof Props>>();\n\nconst multiLineTypes: SkeletonType[] = [SkeletonType.PARAGRAPH, SkeletonType.ARTICLE];\n\nconst attrs = useAttrs();\nconst ui = computed<string>(() => skeletonLoaderStyles({ type, class: cn(attrs.class) }));\nconst isMultiLine = computed<boolean>(() => multiLineTypes.includes(type));\n</script>\n\n<template>\n  <RuiSkeletonBase\n    v-if=\"!isMultiLine\"\n    :class=\"ui\"\n    :rounded=\"rounded\"\n    v-bind=\"{ ...attrs, class: undefined }\"\n  />\n  <div\n    v-else\n    :class=\"ui\"\n    v-bind=\"{ ...attrs, class: undefined }\"\n  >\n    <RuiSkeletonBase\n      v-if=\"type === SkeletonType.ARTICLE\"\n      class=\"w-full h-6 rounded-rui-control mb-1\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-rui-control\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-rui-control max-w-[80%]\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-rui-control max-w-[90%]\"\n      :rounded=\"rounded\"\n    />\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/loaders/RuiSkeletonLoader.vue.d.ts

@@ -1,8 +1,10 @@
+import type { HTMLAttributes } from 'vue';
 import { type Props as SkeletonBaseProps } from './RuiSkeletonBase.vue.js';
 import { SkeletonType } from './skeleton-type.js';
 export interface Props extends SkeletonBaseProps {
     type?: SkeletonType;
 }
-declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+type __VLS_Props = Props & /* @vue-ignore */ Omit<HTMLAttributes, keyof Props>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/loaders/RuiSkeletonLoader.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiSkeletonLoader.vue_vue_type_script_setup_true_lang.js","names":["_unref","_openBlock","_createBlock","RuiSkeletonBase","_mergeProps","_createElementBlock","_createCommentVNode","_createVNode"],"sources":["../../../src/components/loaders/RuiSkeletonLoader.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport RuiSkeletonBase, {\n  type Props as SkeletonBaseProps,\n} from '@/components/loaders/RuiSkeletonBase.vue';\nimport { SkeletonType } from '@/components/loaders/skeleton-type';\nimport { cn } from '@/utils/tv';\nimport { skeletonLoaderStyles } from './skeleton-loader-styles';\n\nexport interface Props extends SkeletonBaseProps {\n  type?: SkeletonType;\n}\n\ndefineOptions({\n  name: 'RuiSkeletonLoader',\n  inheritAttrs: false,\n});\n\nconst { type = SkeletonType.TEXT, rounded } = defineProps<Props>();\n\nconst multiLineTypes: SkeletonType[] = [SkeletonType.PARAGRAPH, SkeletonType.ARTICLE];\n\nconst attrs = useAttrs();\nconst ui = computed<string>(() => skeletonLoaderStyles({ type, class: cn(attrs.class) }));\nconst isMultiLine = computed<boolean>(() => multiLineTypes.includes(type));\n</script>\n\n<template>\n  <RuiSkeletonBase\n    v-if=\"!isMultiLine\"\n    :class=\"ui\"\n    :rounded=\"rounded\"\n    v-bind=\"{ ...attrs, class: undefined }\"\n  />\n  <div\n    v-else\n    :class=\"ui\"\n    v-bind=\"{ ...attrs, class: undefined }\"\n  >\n    <RuiSkeletonBase\n      v-if=\"type === SkeletonType.ARTICLE\"\n      class=\"w-full h-6 rounded-rui-control mb-1\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-rui-control\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-rui-control max-w-[80%]\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-rui-control max-w-[90%]\"\n      :rounded=\"rounded\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;EAmBA,MAAM,iBAAiC,CAAC,aAAa,WAAW,aAAa,OAAO;EAEpF,MAAM,QAAQ,SAAS;EACvB,MAAM,KAAK,eAAuB,qBAAqB;GAAE,MAAG,QAAA;GAAG,OAAO,GAAG,MAAM,KAAK;EAAE,CAAC,CAAC;EACxF,MAAM,cAAc,eAAwB,eAAe,SAAS,QAAA,IAAI,CAAC;;GAK9D,OAAA,CAAAA,MAAA,WAAA,KADTC,UAAA,GAAAC,YAKEC,yBALFC,WAKE;;IAHC,OAAOJ,MAAA,EAAA;IACP,SAAS,QAAA;GACG,GAAA;IAAA,GAAAA,MAAA,KAAA;IAAK,OAAS,KAAA;GAAS,CAAA,GAAA,MAAA,IAAA,CAAA,SAAA,SAAA,CAAA,MAEtCC,UAAA,GAAAI,mBAsBM,OAtBND,WAsBM;;IApBH,OAAOJ,MAAA,EAAA;GACK,GAAA;IAAA,GAAAA,MAAA,KAAA;IAAK,OAAS,KAAA;GAAS,CAAA,GAAA;IAG5B,QAAA,SAASA,MAAA,YAAA,CAAY,CAAC,WAD9BC,UAAA,GAAAC,YAIEC,yBAAA;;KAFA,OAAM;KACL,SAAS,QAAA;;IAEZI,YAGEJ,yBAAA;KAFA,OAAM;KACL,SAAS,QAAA;;IAEZI,YAGEJ,yBAAA;KAFA,OAAM;KACL,SAAS,QAAA;;IAEZI,YAGEJ,yBAAA;KAFA,OAAM;KACL,SAAS,QAAA"}
+{"version":3,"file":"RuiSkeletonLoader.vue_vue_type_script_setup_true_lang.js","names":["_unref","_openBlock","_createBlock","RuiSkeletonBase","_mergeProps","_createElementBlock","_createCommentVNode","_createVNode"],"sources":["../../../src/components/loaders/RuiSkeletonLoader.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { HTMLAttributes } from 'vue';\nimport RuiSkeletonBase, {\n  type Props as SkeletonBaseProps,\n} from '@/components/loaders/RuiSkeletonBase.vue';\nimport { SkeletonType } from '@/components/loaders/skeleton-type';\nimport { cn } from '@/utils/tv';\nimport { skeletonLoaderStyles } from './skeleton-loader-styles';\n\nexport interface Props extends SkeletonBaseProps {\n  type?: SkeletonType;\n}\n\ndefineOptions({\n  name: 'RuiSkeletonLoader',\n  inheritAttrs: false,\n});\n\nconst { type = SkeletonType.TEXT, rounded } = defineProps<Props & /* @vue-ignore */ Omit<HTMLAttributes, keyof Props>>();\n\nconst multiLineTypes: SkeletonType[] = [SkeletonType.PARAGRAPH, SkeletonType.ARTICLE];\n\nconst attrs = useAttrs();\nconst ui = computed<string>(() => skeletonLoaderStyles({ type, class: cn(attrs.class) }));\nconst isMultiLine = computed<boolean>(() => multiLineTypes.includes(type));\n</script>\n\n<template>\n  <RuiSkeletonBase\n    v-if=\"!isMultiLine\"\n    :class=\"ui\"\n    :rounded=\"rounded\"\n    v-bind=\"{ ...attrs, class: undefined }\"\n  />\n  <div\n    v-else\n    :class=\"ui\"\n    v-bind=\"{ ...attrs, class: undefined }\"\n  >\n    <RuiSkeletonBase\n      v-if=\"type === SkeletonType.ARTICLE\"\n      class=\"w-full h-6 rounded-rui-control mb-1\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-rui-control\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-rui-control max-w-[80%]\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-rui-control max-w-[90%]\"\n      :rounded=\"rounded\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;EAoBA,MAAM,iBAAiC,CAAC,aAAa,WAAW,aAAa,OAAO;EAEpF,MAAM,QAAQ,SAAS;EACvB,MAAM,KAAK,eAAuB,qBAAqB;GAAE,MAAG,QAAA;GAAG,OAAO,GAAG,MAAM,KAAK;EAAE,CAAC,CAAC;EACxF,MAAM,cAAc,eAAwB,eAAe,SAAS,QAAA,IAAI,CAAC;;GAK9D,OAAA,CAAAA,MAAA,WAAA,KADTC,UAAA,GAAAC,YAKEC,yBALFC,WAKE;;IAHC,OAAOJ,MAAA,EAAA;IACP,SAAS,QAAA;GACG,GAAA;IAAA,GAAAA,MAAA,KAAA;IAAK,OAAS,KAAA;GAAS,CAAA,GAAA,MAAA,IAAA,CAAA,SAAA,SAAA,CAAA,MAEtCC,UAAA,GAAAI,mBAsBM,OAtBND,WAsBM;;IApBH,OAAOJ,MAAA,EAAA;GACK,GAAA;IAAA,GAAAA,MAAA,KAAA;IAAK,OAAS,KAAA;GAAS,CAAA,GAAA;IAG5B,QAAA,SAASA,MAAA,YAAA,CAAY,CAAC,WAD9BC,UAAA,GAAAC,YAIEC,yBAAA;;KAFA,OAAM;KACL,SAAS,QAAA;;IAEZI,YAGEJ,yBAAA;KAFA,OAAM;KACL,SAAS,QAAA;;IAEZI,YAGEJ,yBAAA;KAFA,OAAM;KACL,SAAS,QAAA;;IAEZI,YAGEJ,yBAAA;KAFA,OAAM;KACL,SAAS,QAAA"}

package/dist/components/logos/RuiLogo.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiLogo.js","names":["_sfc_main"],"sources":["../../../src/components/logos/RuiLogo.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport fallback from '@/components/logos/logo.svg';\nimport { getVerifiedLogoUrl, removeVerifiedLogoUrl, setVerifiedLogoUrl } from '@/components/logos/verified-logo';\nimport { useLogoOptions } from '@/composables/defaults/logo';\n\nexport interface Props {\n  text?: boolean;\n  /**\n   * Name handed to the `logo.resolve` option of `createRui`. Without a resolver\n   * the bundled logo shows.\n   */\n  logo?: string;\n  size?: string | number; // in rems\n  /**\n   * Appended to the resolved URL as `key`, so each instance loads its own copy.\n   */\n  uniqueKey?: string | number;\n  src?: string;\n}\n\ndefineOptions({\n  name: 'RuiLogo',\n});\n\nconst { text = false, logo, size = 3, uniqueKey, src } = defineProps<Props>();\n\nconst appName = 'rotki';\n\nconst resolvedUrl = ref<string>();\nconst error = ref<boolean>(false);\nconst seasonalReady = ref<boolean>(false);\n\nconst isMounted = ref<boolean>(false);\n\nconst customImageRef = useTemplateRef<HTMLImageElement>('customImageRef');\n\nconst logoOptions = useLogoOptions();\n\nconst externalSource = computed<string | undefined>(() => {\n  if (src)\n    return src;\n\n  const url = get(resolvedUrl);\n  if (!url || uniqueKey === undefined)\n    return url;\n\n  return `${url}${url.includes('?') ? '&' : '?'}key=${uniqueKey}`;\n});\n\nconst showCustom = computed<boolean>(() => !!src || (!!get(externalSource) && get(seasonalReady) && !get(error)));\n\nfunction preloadImage(url: string): void {\n  const existing = document.head.querySelectorAll<HTMLLinkElement>('link[rel=\"preload\"][as=\"image\"]');\n  for (const link of existing) {\n    if (link.href === url)\n      return;\n  }\n\n  const link = document.createElement('link');\n  link.rel = 'preload';\n  link.as = 'image';\n  link.href = url;\n  document.head.appendChild(link);\n}\n\nasync function callResolver(name: string): Promise<string | undefined> {\n  try {\n    return await logoOptions?.resolve(name);\n  }\n  catch {\n    // A failing resolver leaves the bundled logo in place\n    return undefined;\n  }\n}\n\n/**\n * Asks the app's resolver for the logo URL. It runs only after mount, so the\n * server and the client's first render both show the bundled fallback (or\n * `src`) and hydration matches.\n */\nasync function resolveLogo(): Promise<void> {\n  if (!get(isMounted))\n    return;\n\n  if (src || !logo || !logoOptions) {\n    set(resolvedUrl, undefined);\n    return;\n  }\n\n  const name = logo;\n  const url = await callResolver(name);\n\n  // The logo prop changed while the resolver ran; that newer run wins\n  if (name !== logo)\n    return;\n\n  set(error, false);\n  // A URL that already decoded in this session is shown without waiting for it again\n  set(seasonalReady, !!url && getVerifiedLogoUrl(name) === url);\n  set(resolvedUrl, url);\n\n  const source = get(externalSource);\n  if (source)\n    preloadImage(source);\n}\n\nfunction onImageError(): void {\n  set(error, true);\n  if (logo)\n    removeVerifiedLogoUrl(logo);\n}\n\nfunction onImageLoaded(): void {\n  const img = get(customImageRef);\n  if (!img)\n    return;\n\n  img.decode()\n    .then(() => {\n      set(seasonalReady, true);\n      // Remember the decoded URL so the next page load can trust it immediately\n      const url = get(resolvedUrl);\n      if (url && logo)\n        setVerifiedLogoUrl(logo, url);\n    })\n    .catch(() => set(error, true));\n}\n\nwatch(() => get(customImageRef)?.complete, (complete) => {\n  if (complete)\n    onImageLoaded();\n});\n\nwatchEffect(resolveLogo);\n\nonMounted(() => {\n  set(isMounted, true);\n});\n</script>\n\n<template>\n  <div\n    class=\"gap-x-4 flex items-center relative\"\n    :style=\"{ height: `${size}rem` }\"\n  >\n    <div\n      class=\"relative\"\n      :style=\"{ width: `${size}rem`, height: `${size}rem` }\"\n    >\n      <!-- Fallback: always in DOM, fades out when custom image is ready -->\n      <img\n        :src=\"fallback\"\n        :alt=\"appName\"\n        data-image=\"fallback\"\n        class=\"absolute inset-0 h-full w-full transition ease-out duration-200\"\n        :class=\"showCustom ? 'opacity-0' : 'opacity-100'\"\n      />\n\n      <!-- Custom/seasonal image: fades in when decoded -->\n      <img\n        v-if=\"externalSource && !error\"\n        ref=\"customImageRef\"\n        :src=\"externalSource\"\n        :alt=\"appName\"\n        data-image=\"custom\"\n        class=\"absolute inset-0 h-full w-full transition ease-out duration-200\"\n        :class=\"showCustom ? 'opacity-100' : 'opacity-0 pointer-events-none'\"\n        @error=\"onImageError()\"\n        @load=\"onImageLoaded()\"\n      />\n    </div>\n\n    <div\n      v-if=\"text\"\n      class=\"text-h4 text-rui-primary dark:text-rui-text\"\n    >\n      {{ appName }}\n    </div>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiLogo.js","names":["_sfc_main"],"sources":["../../../src/components/logos/RuiLogo.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { HTMLAttributes } from 'vue';\nimport fallback from '@/components/logos/logo.svg';\nimport { getVerifiedLogoUrl, removeVerifiedLogoUrl, setVerifiedLogoUrl } from '@/components/logos/verified-logo';\nimport { useLogoOptions } from '@/composables/defaults/logo';\n\nexport interface Props {\n  text?: boolean;\n  /**\n   * Name handed to the `logo.resolve` option of `createRui`. Without a resolver\n   * the bundled logo shows.\n   */\n  logo?: string;\n  size?: string | number; // in rems\n  /**\n   * Appended to the resolved URL as `key`, so each instance loads its own copy.\n   */\n  uniqueKey?: string | number;\n  src?: string;\n}\n\ndefineOptions({\n  name: 'RuiLogo',\n});\n\nconst { text = false, logo, size = 3, uniqueKey, src } = defineProps<Props & /* @vue-ignore */ Omit<HTMLAttributes, keyof Props>>();\n\nconst appName = 'rotki';\n\nconst resolvedUrl = ref<string>();\nconst error = ref<boolean>(false);\nconst seasonalReady = ref<boolean>(false);\n\nconst isMounted = ref<boolean>(false);\n\nconst customImageRef = useTemplateRef<HTMLImageElement>('customImageRef');\n\nconst logoOptions = useLogoOptions();\n\nconst externalSource = computed<string | undefined>(() => {\n  if (src)\n    return src;\n\n  const url = get(resolvedUrl);\n  if (!url || uniqueKey === undefined)\n    return url;\n\n  return `${url}${url.includes('?') ? '&' : '?'}key=${uniqueKey}`;\n});\n\nconst showCustom = computed<boolean>(() => !!src || (!!get(externalSource) && get(seasonalReady) && !get(error)));\n\nfunction preloadImage(url: string): void {\n  const existing = document.head.querySelectorAll<HTMLLinkElement>('link[rel=\"preload\"][as=\"image\"]');\n  for (const link of existing) {\n    if (link.href === url)\n      return;\n  }\n\n  const link = document.createElement('link');\n  link.rel = 'preload';\n  link.as = 'image';\n  link.href = url;\n  document.head.appendChild(link);\n}\n\nasync function callResolver(name: string): Promise<string | undefined> {\n  try {\n    return await logoOptions?.resolve(name);\n  }\n  catch {\n    // A failing resolver leaves the bundled logo in place\n    return undefined;\n  }\n}\n\n/**\n * Asks the app's resolver for the logo URL. It runs only after mount, so the\n * server and the client's first render both show the bundled fallback (or\n * `src`) and hydration matches.\n */\nasync function resolveLogo(): Promise<void> {\n  if (!get(isMounted))\n    return;\n\n  if (src || !logo || !logoOptions) {\n    set(resolvedUrl, undefined);\n    return;\n  }\n\n  const name = logo;\n  const url = await callResolver(name);\n\n  // The logo prop changed while the resolver ran; that newer run wins\n  if (name !== logo)\n    return;\n\n  set(error, false);\n  // A URL that already decoded in this session is shown without waiting for it again\n  set(seasonalReady, !!url && getVerifiedLogoUrl(name) === url);\n  set(resolvedUrl, url);\n\n  const source = get(externalSource);\n  if (source)\n    preloadImage(source);\n}\n\nfunction onImageError(): void {\n  set(error, true);\n  if (logo)\n    removeVerifiedLogoUrl(logo);\n}\n\nfunction onImageLoaded(): void {\n  const img = get(customImageRef);\n  if (!img)\n    return;\n\n  img.decode()\n    .then(() => {\n      set(seasonalReady, true);\n      // Remember the decoded URL so the next page load can trust it immediately\n      const url = get(resolvedUrl);\n      if (url && logo)\n        setVerifiedLogoUrl(logo, url);\n    })\n    .catch(() => set(error, true));\n}\n\nwatch(() => get(customImageRef)?.complete, (complete) => {\n  if (complete)\n    onImageLoaded();\n});\n\nwatchEffect(resolveLogo);\n\nonMounted(() => {\n  set(isMounted, true);\n});\n</script>\n\n<template>\n  <div\n    class=\"gap-x-4 flex items-center relative\"\n    :style=\"{ height: `${size}rem` }\"\n  >\n    <div\n      class=\"relative\"\n      :style=\"{ width: `${size}rem`, height: `${size}rem` }\"\n    >\n      <!-- Fallback: always in DOM, fades out when custom image is ready -->\n      <img\n        :src=\"fallback\"\n        :alt=\"appName\"\n        data-image=\"fallback\"\n        class=\"absolute inset-0 h-full w-full transition ease-out duration-200\"\n        :class=\"showCustom ? 'opacity-0' : 'opacity-100'\"\n      />\n\n      <!-- Custom/seasonal image: fades in when decoded -->\n      <img\n        v-if=\"externalSource && !error\"\n        ref=\"customImageRef\"\n        :src=\"externalSource\"\n        :alt=\"appName\"\n        data-image=\"custom\"\n        class=\"absolute inset-0 h-full w-full transition ease-out duration-200\"\n        :class=\"showCustom ? 'opacity-100' : 'opacity-0 pointer-events-none'\"\n        @error=\"onImageError()\"\n        @load=\"onImageLoaded()\"\n      />\n    </div>\n\n    <div\n      v-if=\"text\"\n      class=\"text-h4 text-rui-primary dark:text-rui-text\"\n    >\n      {{ appName }}\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/logos/RuiLogo.vue.d.ts

@@ -1,3 +1,4 @@
+import type { HTMLAttributes } from 'vue';
 export interface Props {
     text?: boolean;
     /**
@@ -12,6 +13,7 @@ export interface Props {
     uniqueKey?: string | number;
     src?: string;
 }
-declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+type __VLS_Props = Props & /* @vue-ignore */ Omit<HTMLAttributes, keyof Props>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/logos/RuiLogo.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiLogo.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeStyle","_createElementVNode","_unref","fallback","_normalizeClass","_createCommentVNode","_toDisplayString"],"sources":["../../../src/components/logos/RuiLogo.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport fallback from '@/components/logos/logo.svg';\nimport { getVerifiedLogoUrl, removeVerifiedLogoUrl, setVerifiedLogoUrl } from '@/components/logos/verified-logo';\nimport { useLogoOptions } from '@/composables/defaults/logo';\n\nexport interface Props {\n  text?: boolean;\n  /**\n   * Name handed to the `logo.resolve` option of `createRui`. Without a resolver\n   * the bundled logo shows.\n   */\n  logo?: string;\n  size?: string | number; // in rems\n  /**\n   * Appended to the resolved URL as `key`, so each instance loads its own copy.\n   */\n  uniqueKey?: string | number;\n  src?: string;\n}\n\ndefineOptions({\n  name: 'RuiLogo',\n});\n\nconst { text = false, logo, size = 3, uniqueKey, src } = defineProps<Props>();\n\nconst appName = 'rotki';\n\nconst resolvedUrl = ref<string>();\nconst error = ref<boolean>(false);\nconst seasonalReady = ref<boolean>(false);\n\nconst isMounted = ref<boolean>(false);\n\nconst customImageRef = useTemplateRef<HTMLImageElement>('customImageRef');\n\nconst logoOptions = useLogoOptions();\n\nconst externalSource = computed<string | undefined>(() => {\n  if (src)\n    return src;\n\n  const url = get(resolvedUrl);\n  if (!url || uniqueKey === undefined)\n    return url;\n\n  return `${url}${url.includes('?') ? '&' : '?'}key=${uniqueKey}`;\n});\n\nconst showCustom = computed<boolean>(() => !!src || (!!get(externalSource) && get(seasonalReady) && !get(error)));\n\nfunction preloadImage(url: string): void {\n  const existing = document.head.querySelectorAll<HTMLLinkElement>('link[rel=\"preload\"][as=\"image\"]');\n  for (const link of existing) {\n    if (link.href === url)\n      return;\n  }\n\n  const link = document.createElement('link');\n  link.rel = 'preload';\n  link.as = 'image';\n  link.href = url;\n  document.head.appendChild(link);\n}\n\nasync function callResolver(name: string): Promise<string | undefined> {\n  try {\n    return await logoOptions?.resolve(name);\n  }\n  catch {\n    // A failing resolver leaves the bundled logo in place\n    return undefined;\n  }\n}\n\n/**\n * Asks the app's resolver for the logo URL. It runs only after mount, so the\n * server and the client's first render both show the bundled fallback (or\n * `src`) and hydration matches.\n */\nasync function resolveLogo(): Promise<void> {\n  if (!get(isMounted))\n    return;\n\n  if (src || !logo || !logoOptions) {\n    set(resolvedUrl, undefined);\n    return;\n  }\n\n  const name = logo;\n  const url = await callResolver(name);\n\n  // The logo prop changed while the resolver ran; that newer run wins\n  if (name !== logo)\n    return;\n\n  set(error, false);\n  // A URL that already decoded in this session is shown without waiting for it again\n  set(seasonalReady, !!url && getVerifiedLogoUrl(name) === url);\n  set(resolvedUrl, url);\n\n  const source = get(externalSource);\n  if (source)\n    preloadImage(source);\n}\n\nfunction onImageError(): void {\n  set(error, true);\n  if (logo)\n    removeVerifiedLogoUrl(logo);\n}\n\nfunction onImageLoaded(): void {\n  const img = get(customImageRef);\n  if (!img)\n    return;\n\n  img.decode()\n    .then(() => {\n      set(seasonalReady, true);\n      // Remember the decoded URL so the next page load can trust it immediately\n      const url = get(resolvedUrl);\n      if (url && logo)\n        setVerifiedLogoUrl(logo, url);\n    })\n    .catch(() => set(error, true));\n}\n\nwatch(() => get(customImageRef)?.complete, (complete) => {\n  if (complete)\n    onImageLoaded();\n});\n\nwatchEffect(resolveLogo);\n\nonMounted(() => {\n  set(isMounted, true);\n});\n</script>\n\n<template>\n  <div\n    class=\"gap-x-4 flex items-center relative\"\n    :style=\"{ height: `${size}rem` }\"\n  >\n    <div\n      class=\"relative\"\n      :style=\"{ width: `${size}rem`, height: `${size}rem` }\"\n    >\n      <!-- Fallback: always in DOM, fades out when custom image is ready -->\n      <img\n        :src=\"fallback\"\n        :alt=\"appName\"\n        data-image=\"fallback\"\n        class=\"absolute inset-0 h-full w-full transition ease-out duration-200\"\n        :class=\"showCustom ? 'opacity-0' : 'opacity-100'\"\n      />\n\n      <!-- Custom/seasonal image: fades in when decoded -->\n      <img\n        v-if=\"externalSource && !error\"\n        ref=\"customImageRef\"\n        :src=\"externalSource\"\n        :alt=\"appName\"\n        data-image=\"custom\"\n        class=\"absolute inset-0 h-full w-full transition ease-out duration-200\"\n        :class=\"showCustom ? 'opacity-100' : 'opacity-0 pointer-events-none'\"\n        @error=\"onImageError()\"\n        @load=\"onImageLoaded()\"\n      />\n    </div>\n\n    <div\n      v-if=\"text\"\n      class=\"text-h4 text-rui-primary dark:text-rui-text\"\n    >\n      {{ appName }}\n    </div>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"RuiLogo.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeStyle","_createElementVNode","_unref","fallback","_normalizeClass","_createCommentVNode","_toDisplayString"],"sources":["../../../src/components/logos/RuiLogo.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { HTMLAttributes } from 'vue';\nimport fallback from '@/components/logos/logo.svg';\nimport { getVerifiedLogoUrl, removeVerifiedLogoUrl, setVerifiedLogoUrl } from '@/components/logos/verified-logo';\nimport { useLogoOptions } from '@/composables/defaults/logo';\n\nexport interface Props {\n  text?: boolean;\n  /**\n   * Name handed to the `logo.resolve` option of `createRui`. Without a resolver\n   * the bundled logo shows.\n   */\n  logo?: string;\n  size?: string | number; // in rems\n  /**\n   * Appended to the resolved URL as `key`, so each instance loads its own copy.\n   */\n  uniqueKey?: string | number;\n  src?: string;\n}\n\ndefineOptions({\n  name: 'RuiLogo',\n});\n\nconst { text = false, logo, size = 3, uniqueKey, src } = defineProps<Props & /* @vue-ignore */ Omit<HTMLAttributes, keyof Props>>();\n\nconst appName = 'rotki';\n\nconst resolvedUrl = ref<string>();\nconst error = ref<boolean>(false);\nconst seasonalReady = ref<boolean>(false);\n\nconst isMounted = ref<boolean>(false);\n\nconst customImageRef = useTemplateRef<HTMLImageElement>('customImageRef');\n\nconst logoOptions = useLogoOptions();\n\nconst externalSource = computed<string | undefined>(() => {\n  if (src)\n    return src;\n\n  const url = get(resolvedUrl);\n  if (!url || uniqueKey === undefined)\n    return url;\n\n  return `${url}${url.includes('?') ? '&' : '?'}key=${uniqueKey}`;\n});\n\nconst showCustom = computed<boolean>(() => !!src || (!!get(externalSource) && get(seasonalReady) && !get(error)));\n\nfunction preloadImage(url: string): void {\n  const existing = document.head.querySelectorAll<HTMLLinkElement>('link[rel=\"preload\"][as=\"image\"]');\n  for (const link of existing) {\n    if (link.href === url)\n      return;\n  }\n\n  const link = document.createElement('link');\n  link.rel = 'preload';\n  link.as = 'image';\n  link.href = url;\n  document.head.appendChild(link);\n}\n\nasync function callResolver(name: string): Promise<string | undefined> {\n  try {\n    return await logoOptions?.resolve(name);\n  }\n  catch {\n    // A failing resolver leaves the bundled logo in place\n    return undefined;\n  }\n}\n\n/**\n * Asks the app's resolver for the logo URL. It runs only after mount, so the\n * server and the client's first render both show the bundled fallback (or\n * `src`) and hydration matches.\n */\nasync function resolveLogo(): Promise<void> {\n  if (!get(isMounted))\n    return;\n\n  if (src || !logo || !logoOptions) {\n    set(resolvedUrl, undefined);\n    return;\n  }\n\n  const name = logo;\n  const url = await callResolver(name);\n\n  // The logo prop changed while the resolver ran; that newer run wins\n  if (name !== logo)\n    return;\n\n  set(error, false);\n  // A URL that already decoded in this session is shown without waiting for it again\n  set(seasonalReady, !!url && getVerifiedLogoUrl(name) === url);\n  set(resolvedUrl, url);\n\n  const source = get(externalSource);\n  if (source)\n    preloadImage(source);\n}\n\nfunction onImageError(): void {\n  set(error, true);\n  if (logo)\n    removeVerifiedLogoUrl(logo);\n}\n\nfunction onImageLoaded(): void {\n  const img = get(customImageRef);\n  if (!img)\n    return;\n\n  img.decode()\n    .then(() => {\n      set(seasonalReady, true);\n      // Remember the decoded URL so the next page load can trust it immediately\n      const url = get(resolvedUrl);\n      if (url && logo)\n        setVerifiedLogoUrl(logo, url);\n    })\n    .catch(() => set(error, true));\n}\n\nwatch(() => get(customImageRef)?.complete, (complete) => {\n  if (complete)\n    onImageLoaded();\n});\n\nwatchEffect(resolveLogo);\n\nonMounted(() => {\n  set(isMounted, true);\n});\n</script>\n\n<template>\n  <div\n    class=\"gap-x-4 flex items-center relative\"\n    :style=\"{ height: `${size}rem` }\"\n  >\n    <div\n      class=\"relative\"\n      :style=\"{ width: `${size}rem`, height: `${size}rem` }\"\n    >\n      <!-- Fallback: always in DOM, fades out when custom image is ready -->\n      <img\n        :src=\"fallback\"\n        :alt=\"appName\"\n        data-image=\"fallback\"\n        class=\"absolute inset-0 h-full w-full transition ease-out duration-200\"\n        :class=\"showCustom ? 'opacity-0' : 'opacity-100'\"\n      />\n\n      <!-- Custom/seasonal image: fades in when decoded -->\n      <img\n        v-if=\"externalSource && !error\"\n        ref=\"customImageRef\"\n        :src=\"externalSource\"\n        :alt=\"appName\"\n        data-image=\"custom\"\n        class=\"absolute inset-0 h-full w-full transition ease-out duration-200\"\n        :class=\"showCustom ? 'opacity-100' : 'opacity-0 pointer-events-none'\"\n        @error=\"onImageError()\"\n        @load=\"onImageLoaded()\"\n      />\n    </div>\n\n    <div\n      v-if=\"text\"\n      class=\"text-h4 text-rui-primary dark:text-rui-text\"\n    >\n      {{ appName }}\n    </div>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/overlays/badge/RuiBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiBadge.js","names":["_sfc_main"],"sources":["../../../../src/components/overlays/badge/RuiBadge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ContextColorsType } from '@/consts/colors';\nimport type { RuiIcons } from '@/icons';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport { BadgePlacement, BadgeRounded, BadgeSize } from '@/components/overlays/badge/badge-props';\nimport { badgeStyles } from './badge-styles';\n\ntype PosConfig = [left: number, right: string, edge: string, center: number];\n\nexport interface Props {\n  text?: string | null;\n  icon?: RuiIcons | null;\n  modelValue?: boolean;\n  dot?: boolean;\n  left?: boolean;\n  offsetX?: string | number;\n  offsetY?: string | number;\n  placement?: BadgePlacement;\n  size?: BadgeSize;\n  rounded?: BadgeRounded;\n  color?: 'default' | ContextColorsType;\n}\n\ndefineOptions({\n  name: 'RuiBadge',\n});\n\nconst {\n  text = null,\n  icon = null,\n  modelValue = true,\n  dot = false,\n  placement = BadgePlacement.top,\n  left = false,\n  size = BadgeSize.md,\n  rounded = BadgeRounded.full,\n  color = 'primary',\n  offsetX = 0,\n  offsetY = 0,\n} = defineProps<Props>();\n\nconst slots = defineSlots<{\n  default?: () => any;\n  badge?: () => any;\n  icon?: () => any;\n}>();\n\nconst hasText = computed<boolean>(() => !!text || !!slots.badge);\n\nconst hasIconAndText = computed<boolean>(() => (!!icon || !!slots.icon) && get(hasText));\n\nconst ui = computed<ReturnType<typeof badgeStyles>>(() => badgeStyles({\n  color,\n  size,\n  rounded,\n  dot,\n  iconOnly: (!!icon || !!slots.icon) && !get(hasText),\n}));\n\n/** Dot positions as [leftOffset, rightBase, edgeBase, centerOffset]; a dot's center sits on the corner, so each size moves by half its diameter. */\nconst DOT_POS: Record<BadgeSize, PosConfig> = {\n  sm: [-0.25, '100% - 0.25rem', '100% - 0.25rem', 0.25],\n  md: [-0.3125, '100% - 0.3125rem', '100% - 0.3125rem', 0.3125],\n  lg: [-0.375, '100% - 0.375rem', '100% - 0.375rem', 0.375],\n};\nconst BADGE_POS: Record<BadgeSize, PosConfig> = {\n  sm: [-0.85, '100% - 0.375rem', '100% - 0.375rem', 0.55],\n  md: [-0.95, '100% - 0.5rem', '100% - 0.5rem', 0.65],\n  lg: [-1.05, '100% - 0.5rem', '100% - 0.5rem', 0.75],\n};\n\nconst positionStyle = computed<Record<string, string>>(() => {\n  const ox = Number(offsetX) * 0.0625;\n  const oy = Number(offsetY) * 0.0625;\n  const [l, r, edge, center] = dot ? DOT_POS[size] : BADGE_POS[size];\n\n  const horizontal = `calc(${left ? `${l}rem` : r} + ${ox}rem)`;\n  const vertical = placement === 'center'\n    ? `calc(50% - ${center}rem - ${oy}rem)`\n    : `calc(${edge} - ${oy}rem)`;\n\n  return {\n    left: horizontal,\n    [placement === 'top' ? 'bottom' : 'top']: vertical,\n  };\n});\n</script>\n\n<template>\n  <div :class=\"ui.wrapper()\">\n    <slot />\n    <!-- under reduced motion the badge appears and leaves at full size, with no scale -->\n    <Transition\n      appear\n      enter-active-class=\"transition-[scale] ease-out duration-200 motion-reduce:transition-none\"\n      enter-from-class=\"scale-0 motion-reduce:scale-100\"\n      enter-to-class=\"scale-100\"\n      leave-active-class=\"transition-[scale] ease-in duration-150 motion-reduce:transition-none\"\n      leave-from-class=\"scale-100\"\n      leave-to-class=\"scale-0 motion-reduce:scale-100\"\n    >\n      <div\n        v-if=\"modelValue\"\n        :class=\"ui.badge()\"\n        :style=\"positionStyle\"\n        :data-placement=\"placement\"\n        :data-dot=\"dot || undefined\"\n        :data-left=\"left || undefined\"\n        aria-atomic=\"true\"\n        aria-live=\"polite\"\n        role=\"status\"\n      >\n        <!-- no aria-label: on a live region it replaced the count, so a reader announced \"Badge\" -->\n        <span\n          v-if=\"!dot\"\n          :class=\"ui.content({ class: hasIconAndText ? 'px-2' : undefined })\"\n        >\n          <slot name=\"badge\">\n            {{ text }}\n          </slot>\n          <slot name=\"icon\">\n            <RuiIcon\n              v-if=\"icon\"\n              :name=\"icon\"\n            />\n          </slot>\n        </span>\n      </div>\n    </Transition>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiBadge.js","names":["_sfc_main"],"sources":["../../../../src/components/overlays/badge/RuiBadge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { HTMLAttributes } from 'vue';\nimport type { ContextColorsType } from '@/consts/colors';\nimport type { RuiIcons } from '@/icons';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport { BadgePlacement, BadgeRounded, BadgeSize } from '@/components/overlays/badge/badge-props';\nimport { badgeStyles } from './badge-styles';\n\ntype PosConfig = [left: number, right: string, edge: string, center: number];\n\nexport interface Props {\n  text?: string | null;\n  icon?: RuiIcons | null;\n  modelValue?: boolean;\n  dot?: boolean;\n  left?: boolean;\n  offsetX?: string | number;\n  offsetY?: string | number;\n  placement?: BadgePlacement;\n  size?: BadgeSize;\n  rounded?: BadgeRounded;\n  color?: 'default' | ContextColorsType;\n}\n\ndefineOptions({\n  name: 'RuiBadge',\n});\n\nconst {\n  text = null,\n  icon = null,\n  modelValue = true,\n  dot = false,\n  placement = BadgePlacement.top,\n  left = false,\n  size = BadgeSize.md,\n  rounded = BadgeRounded.full,\n  color = 'primary',\n  offsetX = 0,\n  offsetY = 0,\n} = defineProps<Props & /* @vue-ignore */ Omit<HTMLAttributes, keyof Props>>();\n\nconst slots = defineSlots<{\n  default?: () => any;\n  badge?: () => any;\n  icon?: () => any;\n}>();\n\nconst hasText = computed<boolean>(() => !!text || !!slots.badge);\n\nconst hasIconAndText = computed<boolean>(() => (!!icon || !!slots.icon) && get(hasText));\n\nconst ui = computed<ReturnType<typeof badgeStyles>>(() => badgeStyles({\n  color,\n  size,\n  rounded,\n  dot,\n  iconOnly: (!!icon || !!slots.icon) && !get(hasText),\n}));\n\n/** Dot positions as [leftOffset, rightBase, edgeBase, centerOffset]; a dot's center sits on the corner, so each size moves by half its diameter. */\nconst DOT_POS: Record<BadgeSize, PosConfig> = {\n  sm: [-0.25, '100% - 0.25rem', '100% - 0.25rem', 0.25],\n  md: [-0.3125, '100% - 0.3125rem', '100% - 0.3125rem', 0.3125],\n  lg: [-0.375, '100% - 0.375rem', '100% - 0.375rem', 0.375],\n};\nconst BADGE_POS: Record<BadgeSize, PosConfig> = {\n  sm: [-0.85, '100% - 0.375rem', '100% - 0.375rem', 0.55],\n  md: [-0.95, '100% - 0.5rem', '100% - 0.5rem', 0.65],\n  lg: [-1.05, '100% - 0.5rem', '100% - 0.5rem', 0.75],\n};\n\nconst positionStyle = computed<Record<string, string>>(() => {\n  const ox = Number(offsetX) * 0.0625;\n  const oy = Number(offsetY) * 0.0625;\n  const [l, r, edge, center] = dot ? DOT_POS[size] : BADGE_POS[size];\n\n  const horizontal = `calc(${left ? `${l}rem` : r} + ${ox}rem)`;\n  const vertical = placement === 'center'\n    ? `calc(50% - ${center}rem - ${oy}rem)`\n    : `calc(${edge} - ${oy}rem)`;\n\n  return {\n    left: horizontal,\n    [placement === 'top' ? 'bottom' : 'top']: vertical,\n  };\n});\n</script>\n\n<template>\n  <div :class=\"ui.wrapper()\">\n    <slot />\n    <!-- under reduced motion the badge appears and leaves at full size, with no scale -->\n    <Transition\n      appear\n      enter-active-class=\"transition-[scale] ease-out duration-200 motion-reduce:transition-none\"\n      enter-from-class=\"scale-0 motion-reduce:scale-100\"\n      enter-to-class=\"scale-100\"\n      leave-active-class=\"transition-[scale] ease-in duration-150 motion-reduce:transition-none\"\n      leave-from-class=\"scale-100\"\n      leave-to-class=\"scale-0 motion-reduce:scale-100\"\n    >\n      <div\n        v-if=\"modelValue\"\n        :class=\"ui.badge()\"\n        :style=\"positionStyle\"\n        :data-placement=\"placement\"\n        :data-dot=\"dot || undefined\"\n        :data-left=\"left || undefined\"\n        aria-atomic=\"true\"\n        aria-live=\"polite\"\n        role=\"status\"\n      >\n        <!-- no aria-label: on a live region it replaced the count, so a reader announced \"Badge\" -->\n        <span\n          v-if=\"!dot\"\n          :class=\"ui.content({ class: hasIconAndText ? 'px-2' : undefined })\"\n        >\n          <slot name=\"badge\">\n            {{ text }}\n          </slot>\n          <slot name=\"icon\">\n            <RuiIcon\n              v-if=\"icon\"\n              :name=\"icon\"\n            />\n          </slot>\n        </span>\n      </div>\n    </Transition>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/overlays/badge/RuiBadge.vue.d.ts

@@ -1,3 +1,4 @@
+import type { HTMLAttributes } from 'vue';
 import type { ContextColorsType } from '../../../consts/colors.js';
 import type { RuiIcons } from '../../../icons/index.js';
 import { BadgePlacement, BadgeRounded, BadgeSize } from './badge-props.js';
@@ -14,12 +15,13 @@ export interface Props {
     rounded?: BadgeRounded;
     color?: 'default' | ContextColorsType;
 }
+type __VLS_Props = Props & /* @vue-ignore */ Omit<HTMLAttributes, keyof Props>;
 type __VLS_Slots = {
     default?: () => any;
     badge?: () => any;
     icon?: () => any;
 };
-declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/overlays/badge/RuiBadge.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiBadge.vue_vue_type_script_setup_true_lang.js","names":["_useSlots","_openBlock","_createElementBlock","_normalizeClass","_unref","_renderSlot","_createVNode","_Transition","_withCtx","_normalizeStyle","_createTextVNode","_toDisplayString","_createBlock","RuiIcon","_createCommentVNode"],"sources":["../../../../src/components/overlays/badge/RuiBadge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ContextColorsType } from '@/consts/colors';\nimport type { RuiIcons } from '@/icons';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport { BadgePlacement, BadgeRounded, BadgeSize } from '@/components/overlays/badge/badge-props';\nimport { badgeStyles } from './badge-styles';\n\ntype PosConfig = [left: number, right: string, edge: string, center: number];\n\nexport interface Props {\n  text?: string | null;\n  icon?: RuiIcons | null;\n  modelValue?: boolean;\n  dot?: boolean;\n  left?: boolean;\n  offsetX?: string | number;\n  offsetY?: string | number;\n  placement?: BadgePlacement;\n  size?: BadgeSize;\n  rounded?: BadgeRounded;\n  color?: 'default' | ContextColorsType;\n}\n\ndefineOptions({\n  name: 'RuiBadge',\n});\n\nconst {\n  text = null,\n  icon = null,\n  modelValue = true,\n  dot = false,\n  placement = BadgePlacement.top,\n  left = false,\n  size = BadgeSize.md,\n  rounded = BadgeRounded.full,\n  color = 'primary',\n  offsetX = 0,\n  offsetY = 0,\n} = defineProps<Props>();\n\nconst slots = defineSlots<{\n  default?: () => any;\n  badge?: () => any;\n  icon?: () => any;\n}>();\n\nconst hasText = computed<boolean>(() => !!text || !!slots.badge);\n\nconst hasIconAndText = computed<boolean>(() => (!!icon || !!slots.icon) && get(hasText));\n\nconst ui = computed<ReturnType<typeof badgeStyles>>(() => badgeStyles({\n  color,\n  size,\n  rounded,\n  dot,\n  iconOnly: (!!icon || !!slots.icon) && !get(hasText),\n}));\n\n/** Dot positions as [leftOffset, rightBase, edgeBase, centerOffset]; a dot's center sits on the corner, so each size moves by half its diameter. */\nconst DOT_POS: Record<BadgeSize, PosConfig> = {\n  sm: [-0.25, '100% - 0.25rem', '100% - 0.25rem', 0.25],\n  md: [-0.3125, '100% - 0.3125rem', '100% - 0.3125rem', 0.3125],\n  lg: [-0.375, '100% - 0.375rem', '100% - 0.375rem', 0.375],\n};\nconst BADGE_POS: Record<BadgeSize, PosConfig> = {\n  sm: [-0.85, '100% - 0.375rem', '100% - 0.375rem', 0.55],\n  md: [-0.95, '100% - 0.5rem', '100% - 0.5rem', 0.65],\n  lg: [-1.05, '100% - 0.5rem', '100% - 0.5rem', 0.75],\n};\n\nconst positionStyle = computed<Record<string, string>>(() => {\n  const ox = Number(offsetX) * 0.0625;\n  const oy = Number(offsetY) * 0.0625;\n  const [l, r, edge, center] = dot ? DOT_POS[size] : BADGE_POS[size];\n\n  const horizontal = `calc(${left ? `${l}rem` : r} + ${ox}rem)`;\n  const vertical = placement === 'center'\n    ? `calc(50% - ${center}rem - ${oy}rem)`\n    : `calc(${edge} - ${oy}rem)`;\n\n  return {\n    left: horizontal,\n    [placement === 'top' ? 'bottom' : 'top']: vertical,\n  };\n});\n</script>\n\n<template>\n  <div :class=\"ui.wrapper()\">\n    <slot />\n    <!-- under reduced motion the badge appears and leaves at full size, with no scale -->\n    <Transition\n      appear\n      enter-active-class=\"transition-[scale] ease-out duration-200 motion-reduce:transition-none\"\n      enter-from-class=\"scale-0 motion-reduce:scale-100\"\n      enter-to-class=\"scale-100\"\n      leave-active-class=\"transition-[scale] ease-in duration-150 motion-reduce:transition-none\"\n      leave-from-class=\"scale-100\"\n      leave-to-class=\"scale-0 motion-reduce:scale-100\"\n    >\n      <div\n        v-if=\"modelValue\"\n        :class=\"ui.badge()\"\n        :style=\"positionStyle\"\n        :data-placement=\"placement\"\n        :data-dot=\"dot || undefined\"\n        :data-left=\"left || undefined\"\n        aria-atomic=\"true\"\n        aria-live=\"polite\"\n        role=\"status\"\n      >\n        <!-- no aria-label: on a live region it replaced the count, so a reader announced \"Badge\" -->\n        <span\n          v-if=\"!dot\"\n          :class=\"ui.content({ class: hasIconAndText ? 'px-2' : undefined })\"\n        >\n          <slot name=\"badge\">\n            {{ text }}\n          </slot>\n          <slot name=\"icon\">\n            <RuiIcon\n              v-if=\"icon\"\n              :name=\"icon\"\n            />\n          </slot>\n        </span>\n      </div>\n    </Transition>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyCA,MAAM,QAAQA,SAAA;EAMd,MAAM,UAAU,eAAwB,CAAC,CAAC,QAAA,QAAQ,CAAC,CAAC,MAAM,KAAK;EAE/D,MAAM,iBAAiB,gBAAyB,CAAC,CAAC,QAAA,QAAQ,CAAC,CAAC,MAAM,SAAS,IAAI,OAAO,CAAC;EAEvF,MAAM,KAAK,eAA+C,YAAY;GACpE,OAAI,QAAA;GACJ,MAAG,QAAA;GACH,SAAM,QAAA;GACN,KAAE,QAAA;GACF,WAAW,CAAC,CAAC,QAAA,QAAQ,CAAC,CAAC,MAAM,SAAS,CAAC,IAAI,OAAO;EACpD,CAAC,CAAC;;EAGF,MAAM,UAAwC;GAC5C,IAAI;IAAC;IAAO;IAAkB;IAAkB;GAAI;GACpD,IAAI;IAAC;IAAS;IAAoB;IAAoB;GAAM;GAC5D,IAAI;IAAC;IAAQ;IAAmB;IAAmB;GAAK;EAC1D;EACA,MAAM,YAA0C;GAC9C,IAAI;IAAC;IAAO;IAAmB;IAAmB;GAAI;GACtD,IAAI;IAAC;IAAO;IAAiB;IAAiB;GAAI;GAClD,IAAI;IAAC;IAAO;IAAiB;IAAiB;GAAI;EACpD;EAEA,MAAM,gBAAgB,eAAuC;GAC3D,MAAM,KAAK,OAAO,QAAA,OAAO,IAAI;GAC7B,MAAM,KAAK,OAAO,QAAA,OAAO,IAAI;GAC7B,MAAM,CAAC,GAAG,GAAG,MAAM,UAAU,QAAA,MAAM,QAAQ,QAAA,QAAQ,UAAU,QAAA;GAE7D,MAAM,aAAa,QAAQ,QAAA,OAAO,GAAG,EAAE,OAAO,EAAE,KAAK,GAAG;GACxD,MAAM,WAAW,QAAA,cAAc,WAC3B,cAAc,OAAO,QAAQ,GAAG,QAChC,QAAQ,KAAK,KAAK,GAAG;GAEzB,OAAO;IACL,MAAM;KACL,QAAA,cAAc,QAAQ,WAAW,QAAQ;GAC5C;EACF,CAAC;;GAIC,OAAAC,UAAA,GAAAC,mBAwCM,OAAA,EAxCA,OAAKC,eAAEC,MAAA,EAAA,CAAE,CAAC,QAAO,CAAA,EAAA,GAAA,CACrBC,WAAQ,KAAA,QAAA,SAAA,GAERC,YAoCaC,YAAA;IAnCX,QAAA;IACA,sBAAmB;IACnB,oBAAiB;IACjB,kBAAe;IACf,sBAAmB;IACnB,oBAAiB;IACjB,kBAAe;;IAEf,SAAAC,cA0BM,CAzBE,QAAA,cADRP,UAAA,GAAAC,mBA0BM,OAAA;;KAxBH,OAAKC,eAAEC,MAAA,EAAA,CAAE,CAAC,MAAK,CAAA;KACf,OAAKK,eAAEL,MAAA,aAAA,CAAa;KACpB,kBAAgB,QAAA;KAChB,YAAU,QAAA,OAAO,KAAA;KACjB,aAAW,QAAA,QAAQ,KAAA;KACpB,eAAY;KACZ,aAAU;KACV,MAAK;IAII,GAAA,CAAA,CAAA,QAAA,OADTH,UAAA,GAAAC,mBAaO,QAAA;;KAXJ,OAAKC,eAAEC,MAAA,EAAA,CAAE,CAAC,QAAO,EAAA,OAAUA,MAAA,cAAA,IAAc,SAAY,KAAA,EAAS,CAAA,CAAA;IAE/DC,GAAAA,CAAAA,WAEO,KAAA,QAAA,SAAA,CAAA,SAAA,CADFK,gBAAAC,gBAAA,QAAA,IAAI,GAAA,CAAA,CAAA,CAAA,GAETN,WAKO,KAAA,QAAA,QAAA,CAAA,SAAA,CAHG,QAAA,QADRJ,UAAA,GAAAW,YAGEC,iBAAA;;KADC,MAAM,QAAA"}
+{"version":3,"file":"RuiBadge.vue_vue_type_script_setup_true_lang.js","names":["_useSlots","_openBlock","_createElementBlock","_normalizeClass","_unref","_renderSlot","_createVNode","_Transition","_withCtx","_normalizeStyle","_createTextVNode","_toDisplayString","_createBlock","RuiIcon","_createCommentVNode"],"sources":["../../../../src/components/overlays/badge/RuiBadge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { HTMLAttributes } from 'vue';\nimport type { ContextColorsType } from '@/consts/colors';\nimport type { RuiIcons } from '@/icons';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport { BadgePlacement, BadgeRounded, BadgeSize } from '@/components/overlays/badge/badge-props';\nimport { badgeStyles } from './badge-styles';\n\ntype PosConfig = [left: number, right: string, edge: string, center: number];\n\nexport interface Props {\n  text?: string | null;\n  icon?: RuiIcons | null;\n  modelValue?: boolean;\n  dot?: boolean;\n  left?: boolean;\n  offsetX?: string | number;\n  offsetY?: string | number;\n  placement?: BadgePlacement;\n  size?: BadgeSize;\n  rounded?: BadgeRounded;\n  color?: 'default' | ContextColorsType;\n}\n\ndefineOptions({\n  name: 'RuiBadge',\n});\n\nconst {\n  text = null,\n  icon = null,\n  modelValue = true,\n  dot = false,\n  placement = BadgePlacement.top,\n  left = false,\n  size = BadgeSize.md,\n  rounded = BadgeRounded.full,\n  color = 'primary',\n  offsetX = 0,\n  offsetY = 0,\n} = defineProps<Props & /* @vue-ignore */ Omit<HTMLAttributes, keyof Props>>();\n\nconst slots = defineSlots<{\n  default?: () => any;\n  badge?: () => any;\n  icon?: () => any;\n}>();\n\nconst hasText = computed<boolean>(() => !!text || !!slots.badge);\n\nconst hasIconAndText = computed<boolean>(() => (!!icon || !!slots.icon) && get(hasText));\n\nconst ui = computed<ReturnType<typeof badgeStyles>>(() => badgeStyles({\n  color,\n  size,\n  rounded,\n  dot,\n  iconOnly: (!!icon || !!slots.icon) && !get(hasText),\n}));\n\n/** Dot positions as [leftOffset, rightBase, edgeBase, centerOffset]; a dot's center sits on the corner, so each size moves by half its diameter. */\nconst DOT_POS: Record<BadgeSize, PosConfig> = {\n  sm: [-0.25, '100% - 0.25rem', '100% - 0.25rem', 0.25],\n  md: [-0.3125, '100% - 0.3125rem', '100% - 0.3125rem', 0.3125],\n  lg: [-0.375, '100% - 0.375rem', '100% - 0.375rem', 0.375],\n};\nconst BADGE_POS: Record<BadgeSize, PosConfig> = {\n  sm: [-0.85, '100% - 0.375rem', '100% - 0.375rem', 0.55],\n  md: [-0.95, '100% - 0.5rem', '100% - 0.5rem', 0.65],\n  lg: [-1.05, '100% - 0.5rem', '100% - 0.5rem', 0.75],\n};\n\nconst positionStyle = computed<Record<string, string>>(() => {\n  const ox = Number(offsetX) * 0.0625;\n  const oy = Number(offsetY) * 0.0625;\n  const [l, r, edge, center] = dot ? DOT_POS[size] : BADGE_POS[size];\n\n  const horizontal = `calc(${left ? `${l}rem` : r} + ${ox}rem)`;\n  const vertical = placement === 'center'\n    ? `calc(50% - ${center}rem - ${oy}rem)`\n    : `calc(${edge} - ${oy}rem)`;\n\n  return {\n    left: horizontal,\n    [placement === 'top' ? 'bottom' : 'top']: vertical,\n  };\n});\n</script>\n\n<template>\n  <div :class=\"ui.wrapper()\">\n    <slot />\n    <!-- under reduced motion the badge appears and leaves at full size, with no scale -->\n    <Transition\n      appear\n      enter-active-class=\"transition-[scale] ease-out duration-200 motion-reduce:transition-none\"\n      enter-from-class=\"scale-0 motion-reduce:scale-100\"\n      enter-to-class=\"scale-100\"\n      leave-active-class=\"transition-[scale] ease-in duration-150 motion-reduce:transition-none\"\n      leave-from-class=\"scale-100\"\n      leave-to-class=\"scale-0 motion-reduce:scale-100\"\n    >\n      <div\n        v-if=\"modelValue\"\n        :class=\"ui.badge()\"\n        :style=\"positionStyle\"\n        :data-placement=\"placement\"\n        :data-dot=\"dot || undefined\"\n        :data-left=\"left || undefined\"\n        aria-atomic=\"true\"\n        aria-live=\"polite\"\n        role=\"status\"\n      >\n        <!-- no aria-label: on a live region it replaced the count, so a reader announced \"Badge\" -->\n        <span\n          v-if=\"!dot\"\n          :class=\"ui.content({ class: hasIconAndText ? 'px-2' : undefined })\"\n        >\n          <slot name=\"badge\">\n            {{ text }}\n          </slot>\n          <slot name=\"icon\">\n            <RuiIcon\n              v-if=\"icon\"\n              :name=\"icon\"\n            />\n          </slot>\n        </span>\n      </div>\n    </Transition>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0CA,MAAM,QAAQA,SAAA;EAMd,MAAM,UAAU,eAAwB,CAAC,CAAC,QAAA,QAAQ,CAAC,CAAC,MAAM,KAAK;EAE/D,MAAM,iBAAiB,gBAAyB,CAAC,CAAC,QAAA,QAAQ,CAAC,CAAC,MAAM,SAAS,IAAI,OAAO,CAAC;EAEvF,MAAM,KAAK,eAA+C,YAAY;GACpE,OAAI,QAAA;GACJ,MAAG,QAAA;GACH,SAAM,QAAA;GACN,KAAE,QAAA;GACF,WAAW,CAAC,CAAC,QAAA,QAAQ,CAAC,CAAC,MAAM,SAAS,CAAC,IAAI,OAAO;EACpD,CAAC,CAAC;;EAGF,MAAM,UAAwC;GAC5C,IAAI;IAAC;IAAO;IAAkB;IAAkB;GAAI;GACpD,IAAI;IAAC;IAAS;IAAoB;IAAoB;GAAM;GAC5D,IAAI;IAAC;IAAQ;IAAmB;IAAmB;GAAK;EAC1D;EACA,MAAM,YAA0C;GAC9C,IAAI;IAAC;IAAO;IAAmB;IAAmB;GAAI;GACtD,IAAI;IAAC;IAAO;IAAiB;IAAiB;GAAI;GAClD,IAAI;IAAC;IAAO;IAAiB;IAAiB;GAAI;EACpD;EAEA,MAAM,gBAAgB,eAAuC;GAC3D,MAAM,KAAK,OAAO,QAAA,OAAO,IAAI;GAC7B,MAAM,KAAK,OAAO,QAAA,OAAO,IAAI;GAC7B,MAAM,CAAC,GAAG,GAAG,MAAM,UAAU,QAAA,MAAM,QAAQ,QAAA,QAAQ,UAAU,QAAA;GAE7D,MAAM,aAAa,QAAQ,QAAA,OAAO,GAAG,EAAE,OAAO,EAAE,KAAK,GAAG;GACxD,MAAM,WAAW,QAAA,cAAc,WAC3B,cAAc,OAAO,QAAQ,GAAG,QAChC,QAAQ,KAAK,KAAK,GAAG;GAEzB,OAAO;IACL,MAAM;KACL,QAAA,cAAc,QAAQ,WAAW,QAAQ;GAC5C;EACF,CAAC;;GAIC,OAAAC,UAAA,GAAAC,mBAwCM,OAAA,EAxCA,OAAKC,eAAEC,MAAA,EAAA,CAAE,CAAC,QAAO,CAAA,EAAA,GAAA,CACrBC,WAAQ,KAAA,QAAA,SAAA,GAERC,YAoCaC,YAAA;IAnCX,QAAA;IACA,sBAAmB;IACnB,oBAAiB;IACjB,kBAAe;IACf,sBAAmB;IACnB,oBAAiB;IACjB,kBAAe;;IAEf,SAAAC,cA0BM,CAzBE,QAAA,cADRP,UAAA,GAAAC,mBA0BM,OAAA;;KAxBH,OAAKC,eAAEC,MAAA,EAAA,CAAE,CAAC,MAAK,CAAA;KACf,OAAKK,eAAEL,MAAA,aAAA,CAAa;KACpB,kBAAgB,QAAA;KAChB,YAAU,QAAA,OAAO,KAAA;KACjB,aAAW,QAAA,QAAQ,KAAA;KACpB,eAAY;KACZ,aAAU;KACV,MAAK;IAII,GAAA,CAAA,CAAA,QAAA,OADTH,UAAA,GAAAC,mBAaO,QAAA;;KAXJ,OAAKC,eAAEC,MAAA,EAAA,CAAE,CAAC,QAAO,EAAA,OAAUA,MAAA,cAAA,IAAc,SAAY,KAAA,EAAS,CAAA,CAAA;IAE/DC,GAAAA,CAAAA,WAEO,KAAA,QAAA,SAAA,CAAA,SAAA,CADFK,gBAAAC,gBAAA,QAAA,IAAI,GAAA,CAAA,CAAA,CAAA,GAETN,WAKO,KAAA,QAAA,QAAA,CAAA,SAAA,CAHG,QAAA,QADRJ,UAAA,GAAAW,YAGEC,iBAAA;;KADC,MAAM,QAAA"}

package/dist/components/overlays/bottom-sheet/RuiBottomSheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiBottomSheet.js","names":["_sfc_main"],"sources":["../../../../src/components/overlays/bottom-sheet/RuiBottomSheet.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport RuiDialog from '@/components/overlays/dialog/RuiDialog.vue';\n\n/** The sheet's props, which stay in step with RuiDialog's. */\nexport interface BottomSheetProps {\n  persistent?: boolean;\n  width?: string | number;\n  maxWidth?: string | number;\n}\n\ndefineOptions({\n  name: 'RuiBottomSheet',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<boolean>({ default: false });\n\nconst { persistent = false, width, maxWidth } = defineProps<BottomSheetProps>();\n</script>\n\n<template>\n  <RuiDialog\n    v-model=\"modelValue\"\n    bottom-sheet\n    v-bind=\"$attrs\"\n    :persistent=\"persistent\"\n    :width=\"width\"\n    :max-width=\"maxWidth\"\n  >\n    <template\n      v-for=\"slot in Object.keys($slots)\"\n      #[slot]=\"scope\"\n    >\n      <slot\n        v-bind=\"scope\"\n        :name=\"slot\"\n      />\n    </template>\n  </RuiDialog>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiBottomSheet.js","names":["_sfc_main"],"sources":["../../../../src/components/overlays/bottom-sheet/RuiBottomSheet.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport RuiDialog, { type DialogSlots } from '@/components/overlays/dialog/RuiDialog.vue';\n\n/** The sheet's props, which stay in step with RuiDialog's. */\nexport interface BottomSheetProps {\n  persistent?: boolean;\n  width?: string | number;\n  maxWidth?: string | number;\n}\n\n/**\n * What the sheet forwards to its RuiDialog through `$attrs`: the dialog's other props and its events\n * (`click:esc`, `click:outside`, `closed`, `dismiss`), besides the HTML attributes.\n */\ntype DialogAttributes = Omit<InstanceType<typeof RuiDialog>['$props'], keyof BottomSheetProps | 'bottomSheet' | 'modelValue' | 'onUpdate:modelValue'>;\n\ndefineOptions({\n  name: 'RuiBottomSheet',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<boolean>({ default: false });\n\nconst { persistent = false, width, maxWidth } = defineProps<BottomSheetProps & /* @vue-ignore */ DialogAttributes>();\n\ndefineSlots<{\n  activator?: DialogSlots['activator'];\n  default?: DialogSlots['default'];\n}>();\n</script>\n\n<template>\n  <RuiDialog\n    v-model=\"modelValue\"\n    bottom-sheet\n    v-bind=\"$attrs\"\n    :persistent=\"persistent\"\n    :width=\"width\"\n    :max-width=\"maxWidth\"\n  >\n    <template #activator=\"scope\">\n      <slot\n        name=\"activator\"\n        v-bind=\"scope\"\n      />\n    </template>\n    <template #default=\"scope\">\n      <slot v-bind=\"scope\" />\n    </template>\n  </RuiDialog>\n</template>\n"],"mappings":""}

package/dist/components/overlays/bottom-sheet/RuiBottomSheet.vue.d.ts

@@ -1,18 +1,24 @@
+import RuiDialog, { type DialogSlots } from '../dialog/RuiDialog.vue.js';
 /** The sheet's props, which stay in step with RuiDialog's. */
 export interface BottomSheetProps {
     persistent?: boolean;
     width?: string | number;
     maxWidth?: string | number;
 }
-type __VLS_Props = BottomSheetProps;
+/**
+ * What the sheet forwards to its RuiDialog through `$attrs`: the dialog's other props and its events
+ * (`click:esc`, `click:outside`, `closed`, `dismiss`), besides the HTML attributes.
+ */
+type DialogAttributes = Omit<InstanceType<typeof RuiDialog>['$props'], keyof BottomSheetProps | 'bottomSheet' | 'modelValue' | 'onUpdate:modelValue'>;
+type __VLS_Props = BottomSheetProps & /* @vue-ignore */ DialogAttributes;
+type __VLS_Slots = {
+    activator?: DialogSlots['activator'];
+    default?: DialogSlots['default'];
+};
 type __VLS_ModelProps = {
     modelValue?: boolean;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare var __VLS_10: string, __VLS_11: any;
-type __VLS_Slots = {} & {
-    [K in NonNullable<typeof __VLS_10>]?: (props: typeof __VLS_11) => any;
-};
 declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: boolean) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{

package/dist/components/overlays/bottom-sheet/RuiBottomSheet.vue_vue_type_script_setup_true_lang.js

@@ -1,5 +1,5 @@
 import RuiDialog_default from "../dialog/RuiDialog.js";
-import { createBlock, createSlots, defineComponent, guardReactiveProps, mergeModels, mergeProps, normalizeProps, openBlock, renderList, renderSlot, useModel, withCtx } from "vue";
+import { createBlock, defineComponent, guardReactiveProps, mergeModels, mergeProps, normalizeProps, openBlock, renderSlot, useModel, withCtx } from "vue";
 //#region src/components/overlays/bottom-sheet/RuiBottomSheet.vue?vue&type=script&setup=true&lang.ts
 var RuiBottomSheet_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "RuiBottomSheet",
@@ -31,12 +31,11 @@ var RuiBottomSheet_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ d
 				persistent: __props.persistent,
 				width: __props.width,
 				"max-width": __props.maxWidth
-			}), createSlots({ _: 2 }, [renderList(Object.keys(_ctx.$slots), (slot) => {
-				return {
-					name: slot,
-					fn: withCtx((scope) => [renderSlot(_ctx.$slots, slot, normalizeProps(guardReactiveProps(scope)))])
-				};
-			})]), 1040, [
+			}), {
+				activator: withCtx((scope) => [renderSlot(_ctx.$slots, "activator", normalizeProps(guardReactiveProps(scope)))]),
+				default: withCtx((scope) => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(scope)))]),
+				_: 3
+			}, 16, [
 				"modelValue",
 				"persistent",
 				"width",

package/dist/components/overlays/bottom-sheet/RuiBottomSheet.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiBottomSheet.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$slots","_useModel","_openBlock","_createBlock","RuiDialog","_mergeProps","_createSlots","_renderList","_withCtx","_renderSlot","_normalizeProps","_guardReactiveProps"],"sources":["../../../../src/components/overlays/bottom-sheet/RuiBottomSheet.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport RuiDialog from '@/components/overlays/dialog/RuiDialog.vue';\n\n/** The sheet's props, which stay in step with RuiDialog's. */\nexport interface BottomSheetProps {\n  persistent?: boolean;\n  width?: string | number;\n  maxWidth?: string | number;\n}\n\ndefineOptions({\n  name: 'RuiBottomSheet',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<boolean>({ default: false });\n\nconst { persistent = false, width, maxWidth } = defineProps<BottomSheetProps>();\n</script>\n\n<template>\n  <RuiDialog\n    v-model=\"modelValue\"\n    bottom-sheet\n    v-bind=\"$attrs\"\n    :persistent=\"persistent\"\n    :width=\"width\"\n    :max-width=\"maxWidth\"\n  >\n    <template\n      v-for=\"slot in Object.keys($slots)\"\n      #[slot]=\"scope\"\n    >\n      <slot\n        v-bind=\"scope\"\n        :name=\"slot\"\n      />\n    </template>\n  </RuiDialog>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;EAeA,MAAM,aAAaE,SAAoB,SAAA,YAAmB;;GAMxD,OAAAC,UAAA,GAAAC,YAiBYC,mBAjBZC,WAiBY;IAhBD,YAAA,WAAA;IAAA,uBAAA,OAAA,OAAA,OAAA,MAAA,WAAA,WAAU,QAAA;IACnB,gBAAA;GACQN,GAAAA,KAAAA,QAAM;IACb,YAAY,QAAA;IACZ,OAAO,QAAA;IACP,aAAW,QAAA;GAGKQ,CAAAA,GAAAA,YAAAA,EAAAA,GAAAA,EAAAA,GAAAA,CAAAA,WAAA,OAAO,KAAKP,KAAAA,MAAM,IAA1B,SAAI;;KACV,MAAA;KAED,IAAAQ,SAFS,UAAK,CAEdC,WAGE,KAAA,QADO,MAAIC,eAAAC,mBADH,KAAK,CAAA,CAAA,CAAA,CAAA"}
+{"version":3,"file":"RuiBottomSheet.vue_vue_type_script_setup_true_lang.js","names":["$attrs","_useModel","_openBlock","_createBlock","RuiDialog","_mergeProps","_withCtx","_renderSlot","_normalizeProps","_guardReactiveProps"],"sources":["../../../../src/components/overlays/bottom-sheet/RuiBottomSheet.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport RuiDialog, { type DialogSlots } from '@/components/overlays/dialog/RuiDialog.vue';\n\n/** The sheet's props, which stay in step with RuiDialog's. */\nexport interface BottomSheetProps {\n  persistent?: boolean;\n  width?: string | number;\n  maxWidth?: string | number;\n}\n\n/**\n * What the sheet forwards to its RuiDialog through `$attrs`: the dialog's other props and its events\n * (`click:esc`, `click:outside`, `closed`, `dismiss`), besides the HTML attributes.\n */\ntype DialogAttributes = Omit<InstanceType<typeof RuiDialog>['$props'], keyof BottomSheetProps | 'bottomSheet' | 'modelValue' | 'onUpdate:modelValue'>;\n\ndefineOptions({\n  name: 'RuiBottomSheet',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<boolean>({ default: false });\n\nconst { persistent = false, width, maxWidth } = defineProps<BottomSheetProps & /* @vue-ignore */ DialogAttributes>();\n\ndefineSlots<{\n  activator?: DialogSlots['activator'];\n  default?: DialogSlots['default'];\n}>();\n</script>\n\n<template>\n  <RuiDialog\n    v-model=\"modelValue\"\n    bottom-sheet\n    v-bind=\"$attrs\"\n    :persistent=\"persistent\"\n    :width=\"width\"\n    :max-width=\"maxWidth\"\n  >\n    <template #activator=\"scope\">\n      <slot\n        name=\"activator\"\n        v-bind=\"scope\"\n      />\n    </template>\n    <template #default=\"scope\">\n      <slot v-bind=\"scope\" />\n    </template>\n  </RuiDialog>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;EAqBA,MAAM,aAAaC,SAAoB,SAAA,YAAmB;;GAWxD,OAAAC,UAAA,GAAAC,YAiBYC,mBAjBZC,WAiBY;IAhBD,YAAA,WAAA;IAAA,uBAAA,OAAA,OAAA,OAAA,MAAA,WAAA,WAAU,QAAA;IACnB,gBAAA;GACQL,GAAAA,KAAAA,QAAM;IACb,YAAY,QAAA;IACZ,OAAO,QAAA;IACP,aAAW,QAAA;;IAED,WAASM,SAAE,UAAK,CACzBC,WAGE,KAAA,QAAA,aAAAC,eAAAC,mBADQ,KAAK,CAAA,CAAA,CAAA,CAAA;IAGN,SAAOH,SAAE,UAAK,CACvBC,WAAuB,KAAA,QAAA,WAAAC,eAAAC,mBAAT,KAAK,CAAA,CAAA,CAAA,CAAA"}

package/dist/components/overlays/dialog/RuiDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiDialog.js","names":["_sfc_main"],"sources":["../../../../src/components/overlays/dialog/RuiDialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { DialogSize } from '@/consts/tokens';\nimport type { VueClassValue } from '@/types/class-value';\nimport { ButtonGroupBoundary } from '@/components/buttons/button-group/button-group-context';\nimport { useDismissableOverlay } from '@/composables/overlay-stack';\nimport { useTimeoutManager } from '@/composables/timeout-manager';\nimport { getNonRootAttrs, getRootAttrs, transformPropsUnit } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\nimport { dialogStyles } from './dialog-styles';\n\nexport interface RuiDialogClassNames {\n  root?: VueClassValue;\n  content?: VueClassValue;\n}\n\nexport interface DialogProps {\n  persistent?: boolean;\n  width?: string | number;\n  maxWidth?: string | number;\n  /** A preset max width, `--rui-dialog-<size>`; an explicit `maxWidth` wins */\n  size?: DialogSize;\n  bottomSheet?: boolean;\n  classNames?: RuiDialogClassNames;\n  zIndex?: string | number;\n  ariaLabel?: string;\n}\n\ndefineOptions({\n  name: 'RuiDialog',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<boolean>({ default: false });\n\nconst {\n  persistent = false,\n  width = '98%',\n  maxWidth,\n  size,\n  bottomSheet = false,\n  classNames,\n  zIndex = 'var(--rui-z-dialog)',\n  ariaLabel,\n} = defineProps<DialogProps>();\n\nconst emit = defineEmits<{\n  'closed': [];\n  'click:outside': [];\n  'click:esc': [];\n  /**\n   * The overlay stack asked this dialog to go, which is what a back gesture\n   * reaches it as. Closes unless persistent, like escape does, so a dialog that\n   * has to ask before discarding should bind `persistent` and answer here.\n   */\n  'dismiss': [];\n}>();\n\ndefineSlots<{\n  activator?: (props: { attrs: { onClick: () => void }; isOpen: boolean }) => any;\n  default?: (props: { isOpen: boolean; close: () => void }) => any;\n}>();\n\nconst transitioning = ref<boolean>(false);\nconst contentRef = useTemplateRef<HTMLDivElement>('contentRef');\n\nconst leaveTimeout = useTimeoutManager();\n\nconst alive = computed<boolean>(() => get(modelValue) || get(transitioning));\n\nconst style = computed<{ width: string | undefined; maxWidth: string | undefined }>(() => ({\n  width: transformPropsUnit(width),\n  maxWidth: transformPropsUnit(maxWidth) ?? (size ? `var(--rui-dialog-${size})` : undefined),\n}));\n\nconst ui = computed<ReturnType<typeof dialogStyles>>(() => dialogStyles({ bottomSheet }));\n\nconst dialogAttrs: { onClick: () => void } = {\n  onClick: toggle,\n};\n\nconst contentTransition = computed<Record<string, string>>(() => {\n  if (!bottomSheet) {\n    return {\n      enterFromClass: 'opacity-0 scale-95',\n      enterActiveClass: 'transition-all ease-out duration-200',\n      enterToClass: 'opacity-100 scale-100',\n      leaveFromClass: 'opacity-100 scale-100',\n      leaveActiveClass: 'transition-all ease-in duration-150',\n      leaveToClass: 'opacity-0 scale-95',\n    };\n  }\n\n  return {\n    enterFromClass: 'translate-y-full',\n    enterActiveClass: 'transition-transform ease-out duration-300',\n    enterToClass: 'translate-y-0',\n    leaveFromClass: 'translate-y-0',\n    leaveActiveClass: 'transition-transform ease-in duration-200',\n    leaveToClass: 'translate-y-full',\n  };\n});\n\nfunction toggle(): void {\n  set(modelValue, !get(modelValue));\n}\n\nfunction close(): void {\n  set(modelValue, false);\n}\n\n/**\n * Closes on Escape unless persistent, and reports the press as `click:esc`.\n *\n * @remarks\n * An Escape that arrives while an IME is composing belongs to the IME, which\n * cancels the candidate with it. The dialog leaves that key alone entirely: no\n * close, no `click:esc`, and no `stopPropagation`, so a search field inside the\n * dialog does not lose the dialog mid-word.\n */\nfunction onEscKeydown(event: KeyboardEvent): void {\n  if (event.isComposing)\n    return;\n\n  event.stopPropagation();\n  if (!persistent) {\n    close();\n  }\n  emit('click:esc');\n}\n\nfunction onClickOutside(): void {\n  if (!persistent) {\n    close();\n  }\n  emit('click:outside');\n}\n\nfunction onDismiss(): void {\n  if (!persistent) {\n    close();\n  }\n  emit('dismiss');\n}\n\n/**\n * Registration follows `modelValue` alone, never `persistent`: a dialog that\n * turns persistent partway through its life has to stay in the stack and refuse\n * in `onDismiss`, or the gesture starts passing through exactly once there is\n * work to lose. A dialog playing its leave transition is already on its way out\n * and does not hold the stack.\n */\nuseDismissableOverlay(modelValue, onDismiss);\n\nfunction onLeaveComplete(): void {\n  leaveTimeout.clear();\n  if (get(transitioning)) {\n    set(transitioning, false);\n    emit('closed');\n  }\n}\n\nwatch(modelValue, (value) => {\n  if (!value) {\n    set(transitioning, true);\n    // Safety fallback if transitionend is not detected\n    leaveTimeout.create(onLeaveComplete, 400);\n  }\n});\n\nwatch(contentRef, (ref) => {\n  if (ref) {\n    nextTick(() => ref.focus());\n  }\n  else {\n    onLeaveComplete();\n  }\n});\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <slot\n      name=\"activator\"\n      v-bind=\"{ attrs: dialogAttrs, isOpen: modelValue }\"\n    />\n    <Teleport to=\"body\">\n      <div\n        v-if=\"alive\"\n        :class=\"ui.root({ class: cn(classNames?.root) })\"\n        :style=\"{ zIndex }\"\n        role=\"dialog\"\n        aria-modal=\"true\"\n        :aria-label=\"ariaLabel\"\n        tabindex=\"0\"\n        v-bind=\"getNonRootAttrs($attrs)\"\n        @keydown.esc=\"onEscKeydown($event)\"\n      >\n        <Transition\n          enter-from-class=\"opacity-0\"\n          enter-active-class=\"transition-opacity ease-out duration-200\"\n          enter-to-class=\"opacity-100\"\n          leave-from-class=\"opacity-100\"\n          leave-active-class=\"transition-opacity ease-in duration-150\"\n          leave-to-class=\"opacity-0\"\n        >\n          <div\n            v-if=\"modelValue\"\n            data-id=\"overlay\"\n            :class=\"ui.overlay()\"\n            @click.stop=\"onClickOutside()\"\n          />\n        </Transition>\n        <Transition\n          v-bind=\"contentTransition\"\n          @after-leave=\"onLeaveComplete()\"\n        >\n          <div\n            v-if=\"modelValue\"\n            ref=\"contentRef\"\n            data-id=\"content\"\n            :style=\"style\"\n            tabindex=\"0\"\n            :data-bottom-sheet=\"bottomSheet || undefined\"\n            :class=\"ui.content({ class: cn(classNames?.content) })\"\n          >\n            <ButtonGroupBoundary>\n              <slot v-bind=\"{ isOpen: modelValue, close }\" />\n            </ButtonGroupBoundary>\n          </div>\n        </Transition>\n      </div>\n    </Teleport>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiDialog.js","names":["_sfc_main"],"sources":["../../../../src/components/overlays/dialog/RuiDialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { HTMLAttributes } from 'vue';\nimport type { DialogSize } from '@/consts/tokens';\nimport type { VueClassValue } from '@/types/class-value';\nimport { ButtonGroupBoundary } from '@/components/buttons/button-group/button-group-context';\nimport { useDismissableOverlay } from '@/composables/overlay-stack';\nimport { useTimeoutManager } from '@/composables/timeout-manager';\nimport { getNonRootAttrs, getRootAttrs, transformPropsUnit } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\nimport { dialogStyles } from './dialog-styles';\n\nexport interface RuiDialogClassNames {\n  root?: VueClassValue;\n  content?: VueClassValue;\n}\n\nexport interface DialogProps {\n  persistent?: boolean;\n  width?: string | number;\n  maxWidth?: string | number;\n  /** A preset max width, `--rui-dialog-<size>`; an explicit `maxWidth` wins */\n  size?: DialogSize;\n  bottomSheet?: boolean;\n  classNames?: RuiDialogClassNames;\n  zIndex?: string | number;\n  ariaLabel?: string;\n}\n\nexport interface DialogSlots {\n  activator?: (props: { attrs: { onClick: () => void }; isOpen: boolean }) => any;\n  default?: (props: { isOpen: boolean; close: () => void }) => any;\n}\n\ndefineOptions({\n  name: 'RuiDialog',\n  inheritAttrs: false,\n});\n\nconst modelValue = defineModel<boolean>({ default: false });\n\nconst {\n  persistent = false,\n  width = '98%',\n  maxWidth,\n  size,\n  bottomSheet = false,\n  classNames,\n  zIndex = 'var(--rui-z-dialog)',\n  ariaLabel,\n} = defineProps<DialogProps & /* @vue-ignore */ Omit<HTMLAttributes, keyof DialogProps>>();\n\nconst emit = defineEmits<{\n  'closed': [];\n  'click:outside': [];\n  'click:esc': [];\n  /**\n   * The overlay stack asked this dialog to go, which is what a back gesture\n   * reaches it as. Closes unless persistent, like escape does, so a dialog that\n   * has to ask before discarding should bind `persistent` and answer here.\n   */\n  'dismiss': [];\n}>();\n\ndefineSlots<DialogSlots>();\n\nconst transitioning = ref<boolean>(false);\nconst contentRef = useTemplateRef<HTMLDivElement>('contentRef');\n\nconst leaveTimeout = useTimeoutManager();\n\nconst alive = computed<boolean>(() => get(modelValue) || get(transitioning));\n\nconst style = computed<{ width: string | undefined; maxWidth: string | undefined }>(() => ({\n  width: transformPropsUnit(width),\n  maxWidth: transformPropsUnit(maxWidth) ?? (size ? `var(--rui-dialog-${size})` : undefined),\n}));\n\nconst ui = computed<ReturnType<typeof dialogStyles>>(() => dialogStyles({ bottomSheet }));\n\nconst dialogAttrs: { onClick: () => void } = {\n  onClick: toggle,\n};\n\nconst contentTransition = computed<Record<string, string>>(() => {\n  if (!bottomSheet) {\n    return {\n      enterFromClass: 'opacity-0 scale-95',\n      enterActiveClass: 'transition-all ease-out duration-200',\n      enterToClass: 'opacity-100 scale-100',\n      leaveFromClass: 'opacity-100 scale-100',\n      leaveActiveClass: 'transition-all ease-in duration-150',\n      leaveToClass: 'opacity-0 scale-95',\n    };\n  }\n\n  return {\n    enterFromClass: 'translate-y-full',\n    enterActiveClass: 'transition-transform ease-out duration-300',\n    enterToClass: 'translate-y-0',\n    leaveFromClass: 'translate-y-0',\n    leaveActiveClass: 'transition-transform ease-in duration-200',\n    leaveToClass: 'translate-y-full',\n  };\n});\n\nfunction toggle(): void {\n  set(modelValue, !get(modelValue));\n}\n\nfunction close(): void {\n  set(modelValue, false);\n}\n\n/**\n * Closes on Escape unless persistent, and reports the press as `click:esc`.\n *\n * @remarks\n * An Escape that arrives while an IME is composing belongs to the IME, which\n * cancels the candidate with it. The dialog leaves that key alone entirely: no\n * close, no `click:esc`, and no `stopPropagation`, so a search field inside the\n * dialog does not lose the dialog mid-word.\n */\nfunction onEscKeydown(event: KeyboardEvent): void {\n  if (event.isComposing)\n    return;\n\n  event.stopPropagation();\n  if (!persistent) {\n    close();\n  }\n  emit('click:esc');\n}\n\nfunction onClickOutside(): void {\n  if (!persistent) {\n    close();\n  }\n  emit('click:outside');\n}\n\nfunction onDismiss(): void {\n  if (!persistent) {\n    close();\n  }\n  emit('dismiss');\n}\n\n/**\n * Registration follows `modelValue` alone, never `persistent`: a dialog that\n * turns persistent partway through its life has to stay in the stack and refuse\n * in `onDismiss`, or the gesture starts passing through exactly once there is\n * work to lose. A dialog playing its leave transition is already on its way out\n * and does not hold the stack.\n */\nuseDismissableOverlay(modelValue, onDismiss);\n\nfunction onLeaveComplete(): void {\n  leaveTimeout.clear();\n  if (get(transitioning)) {\n    set(transitioning, false);\n    emit('closed');\n  }\n}\n\nwatch(modelValue, (value) => {\n  if (!value) {\n    set(transitioning, true);\n    // Safety fallback if transitionend is not detected\n    leaveTimeout.create(onLeaveComplete, 400);\n  }\n});\n\nwatch(contentRef, (ref) => {\n  if (ref) {\n    nextTick(() => ref.focus());\n  }\n  else {\n    onLeaveComplete();\n  }\n});\n</script>\n\n<template>\n  <div v-bind=\"getRootAttrs($attrs)\">\n    <slot\n      name=\"activator\"\n      v-bind=\"{ attrs: dialogAttrs, isOpen: modelValue }\"\n    />\n    <Teleport to=\"body\">\n      <div\n        v-if=\"alive\"\n        :class=\"ui.root({ class: cn(classNames?.root) })\"\n        :style=\"{ zIndex }\"\n        role=\"dialog\"\n        aria-modal=\"true\"\n        :aria-label=\"ariaLabel\"\n        tabindex=\"0\"\n        v-bind=\"getNonRootAttrs($attrs)\"\n        @keydown.esc=\"onEscKeydown($event)\"\n      >\n        <Transition\n          enter-from-class=\"opacity-0\"\n          enter-active-class=\"transition-opacity ease-out duration-200\"\n          enter-to-class=\"opacity-100\"\n          leave-from-class=\"opacity-100\"\n          leave-active-class=\"transition-opacity ease-in duration-150\"\n          leave-to-class=\"opacity-0\"\n        >\n          <div\n            v-if=\"modelValue\"\n            data-id=\"overlay\"\n            :class=\"ui.overlay()\"\n            @click.stop=\"onClickOutside()\"\n          />\n        </Transition>\n        <Transition\n          v-bind=\"contentTransition\"\n          @after-leave=\"onLeaveComplete()\"\n        >\n          <div\n            v-if=\"modelValue\"\n            ref=\"contentRef\"\n            data-id=\"content\"\n            :style=\"style\"\n            tabindex=\"0\"\n            :data-bottom-sheet=\"bottomSheet || undefined\"\n            :class=\"ui.content({ class: cn(classNames?.content) })\"\n          >\n            <ButtonGroupBoundary>\n              <slot v-bind=\"{ isOpen: modelValue, close }\" />\n            </ButtonGroupBoundary>\n          </div>\n        </Transition>\n      </div>\n    </Teleport>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/overlays/dialog/RuiDialog.vue.d.ts

@@ -1,3 +1,4 @@
+import type { HTMLAttributes } from 'vue';
 import type { DialogSize } from '../../../consts/tokens.js';
 import type { VueClassValue } from '../../../types/class-value.js';
 export interface RuiDialogClassNames {
@@ -15,8 +16,7 @@ export interface DialogProps {
     zIndex?: string | number;
     ariaLabel?: string;
 }
-type __VLS_Props = DialogProps;
-type __VLS_Slots = {
+export interface DialogSlots {
     activator?: (props: {
         attrs: {
             onClick: () => void;
@@ -27,7 +27,9 @@ type __VLS_Slots = {
         isOpen: boolean;
         close: () => void;
     }) => any;
-};
+}
+type __VLS_Props = DialogProps & /* @vue-ignore */ Omit<HTMLAttributes, keyof DialogProps>;
+type __VLS_Slots = DialogSlots;
 type __VLS_ModelProps = {
     modelValue?: boolean;
 };