@rotki/ui-library 2.20.2 → 2.22.0

package/dist/components/forms/text-field/text-field-styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-field-styles.js","names":[],"sources":["../../../../src/components/forms/text-field/text-field-styles.ts"],"sourcesContent":["import { textInputBase, type TextInputVariant, underlinePseudo } from '@/components/forms/text-input-styles';\nimport { tv } from '@/utils/tv';\n\nexport type TextFieldVariant = TextInputVariant;\n\n/**\n * tv() styles for RuiTextField. Extends textInputBase for shared\n * fieldset/legend/label/validation core.\n *\n * IMPORTANT: tv() extend does NOT deduplicate conflicting Tailwind classes\n * between base and extension. Never put a class in the base slot that a\n * variant needs to override — put variant-specific classes in the variants.\n */\n\nexport const textFieldStyles = tv({\n  extend: textInputBase,\n  slots: {\n    // Re-declare base slots for type inference (extend merges classes at runtime)\n    fieldset: '',\n    legend: '',\n    // No pt-* here — each variant sets its own padding-top\n    wrapper: 'relative w-full flex items-center rounded bg-white dark:bg-transparent',\n    input: [\n      'peer leading-6 text-rui-text w-full bg-transparent pr-4',\n      'outline-0 outline-none transition-all',\n      'placeholder:opacity-0 focus:placeholder:opacity-100',\n    ].join(' '),\n    // No border-b or display here — each variant sets its own\n    label: [\n      // Use arbitrary `text-[1rem]` instead of `text-base` — the named class\n      // bundles `line-height: 1.5rem`, and the consumer's later-loaded\n      // `.text-base` rule would override our `leading-*` per variant. The\n      // arbitrary form emits font-size only, so `leading-*` stays authoritative.\n      'left-0 text-[1rem] pointer-events-none',\n      'absolute top-0 h-full w-full select-none',\n      // Dynamic padding via CSS variables\n      '[padding-left:calc(var(--x-padding,0px)+var(--prepend-w,0px))]',\n      '[padding-right:calc(var(--x-padding,0px)+var(--append-w,0px))]',\n      // CSS-only autofill fallback (before JS catches up)\n      'peer-autofill:text-[0.75rem] peer-autofill:leading-tight',\n    ].join(' '),\n    labelText: 'truncate transition-all duration-75',\n    inputWrapper: 'flex flex-1 overflow-hidden',\n    prepend: 'flex items-center gap-1 shrink-0',\n    append: 'flex items-center gap-1 shrink-0',\n    icon: 'text-black/[0.54] dark:text-white/[0.56]',\n    details: 'pt-1 px-4',\n    required: 'text-rui-error',\n    clearButton: '!p-2',\n  },\n  variants: {\n    variant: {\n      default: {\n        wrapper: 'pt-3',\n        input: 'py-1.5',\n        label: `flex leading-[3.75] ${underlinePseudo}`,\n        prepend: 'pr-3',\n        append: 'pl-3',\n      },\n      filled: {\n        input: 'px-4 py-4',\n        label: `flex leading-[3.5] [--x-padding:1rem] rounded-t bg-black/[0.06] dark:bg-white/[0.09] ${underlinePseudo}`,\n        prepend: 'pl-3',\n        append: 'pr-3',\n      },\n      outlined: {\n        inputWrapper: '!overflow-visible',\n        input: 'px-4 py-4',\n        label: [\n          'flex leading-[3.5] [--x-padding:1rem]',\n          'border-0 border-transparent',\n          'after:content-none',\n        ].join(' '),\n        fieldset: '!mt-0 !h-full',\n        prepend: 'pl-3',\n        append: 'pr-3',\n      },\n    },\n    dense: {\n      true: {},\n    },\n    hovered: {\n      true: {\n        label: 'border-black dark:border-white',\n      },\n    },\n    focused: {\n      true: {},\n    },\n    active: {\n      true: {\n        label: [\n          'text-[0.75rem] leading-tight',\n          // Keep --prepend-w / --append-w in the floated padding so the\n          // label sits above the input column, not above the prepend\n          // icon / append button.\n          '[padding-left:calc(var(--x-padding,0px)+var(--prepend-w,0px))]',\n          '[padding-right:calc(var(--x-padding,0px)+var(--append-w,0px))]',\n        ].join(' '),\n      },\n    },\n    noLabel: {\n      true: {},\n    },\n    showLabel: {\n      true: {},\n    },\n    textColor: {\n      primary: { prepend: 'text-rui-primary', append: 'text-rui-primary', input: 'text-rui-primary', icon: 'text-rui-primary' },\n      secondary: { prepend: 'text-rui-secondary', append: 'text-rui-secondary', input: 'text-rui-secondary', icon: 'text-rui-secondary' },\n      error: { prepend: 'text-rui-error', append: 'text-rui-error', input: 'text-rui-error', icon: 'text-rui-error' },\n      warning: { prepend: 'text-rui-warning', append: 'text-rui-warning', input: 'text-rui-warning', icon: 'text-rui-warning' },\n      info: { prepend: 'text-rui-info', append: 'text-rui-info', input: 'text-rui-info', icon: 'text-rui-info' },\n      success: { prepend: 'text-rui-success', append: 'text-rui-success', input: 'text-rui-success', icon: 'text-rui-success' },\n    },\n    validation: {\n      error: {\n        input: '!border-rui-error',\n        label: '!text-rui-error !after:border-rui-error',\n      },\n      success: {\n        input: '!border-rui-success',\n        label: '!text-rui-success !after:border-rui-success',\n      },\n    },\n  },\n  compoundVariants: [\n    // --- Default variant ---\n    { variant: 'default', focused: true, class: { label: 'after:scale-x-100' } },\n    { variant: 'default', dense: true, class: { input: 'py-1', label: 'leading-[3.5]' } },\n    // In dense mode, lift only the labelText glyphs (not the label\n    // container) so the floated label clears the compact ~32px input row.\n    // Translating the label container would drag its `after:` underline\n    // pseudo with it, leaving the focus underline floating above the\n    // input row; translating only the inner span keeps the underline\n    // anchored. Non-dense default has enough vertical breathing room\n    // (~36px input + 12px `pt-3` reserve) that the labelText sits cleanly\n    // above the input without any lift.\n    { variant: 'default', dense: true, active: true, class: { labelText: '-translate-y-[0.5rem]' } },\n    // Without a label, the wrapper's `pt-3` floating-label reserve serves no\n    // purpose and leaves the field ~4–12px taller than an equivalent\n    // RuiMenuSelect dense activator. Strip it and tighten the input padding\n    // so the underline sits at a matching baseline (40px non-dense, 32px\n    // dense) — these match min-h-10 and !min-h-8 of the menu-select\n    // activator.\n    { variant: 'default', noLabel: true, class: { wrapper: '!pt-0', input: 'py-2' } },\n    { variant: 'default', noLabel: true, dense: true, class: { input: 'py-1' } },\n\n    // --- Filled variant ---\n    { variant: 'filled', focused: true, class: { label: 'bg-black/[0.09] dark:bg-white/[0.13]' } },\n    { variant: 'filled', active: true, class: { label: 'leading-[1.5]' } },\n    { variant: 'filled', dense: true, class: { input: 'pt-5 pb-1', label: 'leading-[3]' } },\n    { variant: 'filled', dense: true, active: true, class: { label: 'leading-[2.25]' } },\n    { variant: 'filled', noLabel: true, class: { input: 'py-4' } },\n    { variant: 'filled', noLabel: true, dense: true, class: { input: 'py-3' } },\n\n    // --- Outlined variant ---\n    { variant: 'outlined', active: true, class: {\n      input: 'border-t-transparent',\n      // Use a fixed translate in rem (≈50% of the active label's\n      // 0.9375rem height — text-[0.75rem] × leading-tight). A percentage\n      // translate gets recomputed against the *current* label height,\n      // which jumps from 0.9375rem to the input's full height the moment\n      // !h-auto is removed on blur — producing a transient transform far\n      // larger than the floated value and a visible upward overshoot\n      // before the transition settles. Anchoring in rem (rather than %)\n      // keeps the start/end values consistent across the height swap and\n      // scales with the root font-size.\n      //\n      // Override the active slot's padding-left to drop `--prepend-w` and\n      // stay anchored to the field's left edge — per MD3, the floated\n      // label of an outlined field straddles the border at the start of\n      // the field, not above the input column. Filled/default both keep\n      // the prepend offset (label sits above the input), but outlined\n      // does not.\n      label: '!h-auto -translate-y-[0.5rem] [padding-left:var(--x-padding,0px)]',\n    } },\n    { variant: 'outlined', dense: true, class: { input: 'py-2', label: 'leading-[2.5]' } },\n    // Re-assert `leading-tight` for outlined+dense+active. The dense rule\n    // above sets `leading-[2.5]` which twMerge keeps as the winning leading\n    // (it appears later than the active slot's `leading-tight`), inflating\n    // the floated label's line-box from ~15px to ~30px and pushing its\n    // visual centre below the fieldset border.\n    { variant: 'outlined', dense: true, active: true, class: { label: '!leading-tight' } },\n\n    // --- Focus label color (per color) ---\n    { focused: true, color: 'primary', class: { label: 'text-rui-primary' } },\n    { focused: true, color: 'secondary', class: { label: 'text-rui-secondary' } },\n    { focused: true, color: 'error', class: { label: 'text-rui-error' } },\n    { focused: true, color: 'warning', class: { label: 'text-rui-warning' } },\n    { focused: true, color: 'info', class: { label: 'text-rui-info' } },\n    { focused: true, color: 'success', class: { label: 'text-rui-success' } },\n\n    // --- Label after border color (always applied when color set) ---\n    { color: 'primary', class: { label: 'after:border-rui-primary' } },\n    { color: 'secondary', class: { label: 'after:border-rui-secondary' } },\n    { color: 'error', class: { label: 'after:border-rui-error' } },\n    { color: 'warning', class: { label: 'after:border-rui-warning' } },\n    { color: 'info', class: { label: 'after:border-rui-info' } },\n    { color: 'success', class: { label: 'after:border-rui-success' } },\n  ],\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n"],"mappings":"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"}
+{"version":3,"file":"text-field-styles.js","names":[],"sources":["../../../../src/components/forms/text-field/text-field-styles.ts"],"sourcesContent":["import { textInputBase, type TextInputVariant, underlinePseudo } from '@/components/forms/text-input-styles';\nimport { tv } from '@/utils/tv';\n\nexport type TextFieldVariant = TextInputVariant;\n\n/**\n * tv() styles for RuiTextField. Extends textInputBase for shared\n * fieldset/legend/label/validation core.\n *\n * IMPORTANT: tv() extend does NOT deduplicate conflicting Tailwind classes\n * between base and extension. Never put a class in the base slot that a\n * variant needs to override — put variant-specific classes in the variants.\n */\n\nexport const textFieldStyles = tv({\n  extend: textInputBase,\n  slots: {\n    // Re-declare base slots for type inference (extend merges classes at runtime)\n    fieldset: '',\n    legend: '',\n    // No pt-* here — each variant sets its own padding-top\n    wrapper: 'relative w-full flex items-center rounded bg-white dark:bg-transparent',\n    input: [\n      'peer leading-6 text-rui-text w-full bg-transparent pr-4',\n      'outline-0 outline-none transition-all',\n      'placeholder:opacity-0 focus:placeholder:opacity-100',\n    ].join(' '),\n    // No border-b or display here — each variant sets its own\n    label: [\n      // Use arbitrary `text-[1rem]` instead of `text-base` — the named class\n      // bundles `line-height: 1.5rem`, and the consumer's later-loaded\n      // `.text-base` rule would override our `leading-*` per variant. The\n      // arbitrary form emits font-size only, so `leading-*` stays authoritative.\n      'left-0 text-[1rem] pointer-events-none',\n      'absolute top-0 h-full w-full select-none',\n      // Dynamic padding via CSS variables\n      '[padding-left:calc(var(--x-padding,0px)+var(--prepend-w,0px))]',\n      '[padding-right:calc(var(--x-padding,0px)+var(--append-w,0px))]',\n      // CSS-only autofill fallback (before JS catches up)\n      'peer-autofill:text-[0.75rem] peer-autofill:leading-tight',\n    ].join(' '),\n    labelText: 'truncate transition-all duration-75',\n    inputWrapper: 'flex flex-1 overflow-hidden',\n    prepend: 'flex items-center gap-1 shrink-0',\n    append: 'flex items-center gap-1 shrink-0',\n    icon: 'text-black/[0.54] dark:text-white/[0.56]',\n    details: 'pt-1 px-4',\n    required: 'text-rui-error',\n    clearButton: '!p-2',\n  },\n  variants: {\n    variant: {\n      default: {\n        wrapper: 'pt-3',\n        input: 'py-1.5',\n        label: `flex leading-[3.75] ${underlinePseudo}`,\n        prepend: 'pr-3',\n        append: 'pl-3',\n      },\n      filled: {\n        input: 'px-4 py-4',\n        label: `flex leading-[3.5] [--x-padding:1rem] rounded-t bg-black/[0.06] dark:bg-white/[0.09] ${underlinePseudo}`,\n        prepend: 'pl-3',\n        append: 'pr-3',\n      },\n      outlined: {\n        inputWrapper: '!overflow-visible',\n        input: 'px-4 py-4',\n        label: [\n          'flex leading-[3.5] [--x-padding:1rem]',\n          'border-0 border-transparent',\n          'after:content-none',\n        ].join(' '),\n        fieldset: '!mt-0 !h-full',\n        prepend: 'pl-3',\n        append: 'pr-3',\n      },\n    },\n    dense: {\n      true: {},\n    },\n    hovered: {\n      true: {\n        label: 'border-black dark:border-white',\n      },\n    },\n    focused: {\n      true: {},\n    },\n    active: {\n      true: {\n        label: [\n          'text-[0.75rem] leading-tight',\n          // Keep --prepend-w / --append-w in the floated padding so the\n          // label sits above the input column, not above the prepend\n          // icon / append button.\n          '[padding-left:calc(var(--x-padding,0px)+var(--prepend-w,0px))]',\n          '[padding-right:calc(var(--x-padding,0px)+var(--append-w,0px))]',\n        ].join(' '),\n      },\n    },\n    noLabel: {\n      true: {},\n    },\n    showLabel: {\n      true: {},\n    },\n    textColor: {\n      primary: { prepend: 'text-rui-primary', append: 'text-rui-primary', input: 'text-rui-primary', icon: 'text-rui-primary' },\n      secondary: { prepend: 'text-rui-secondary', append: 'text-rui-secondary', input: 'text-rui-secondary', icon: 'text-rui-secondary' },\n      error: { prepend: 'text-rui-error', append: 'text-rui-error', input: 'text-rui-error', icon: 'text-rui-error' },\n      warning: { prepend: 'text-rui-warning', append: 'text-rui-warning', input: 'text-rui-warning', icon: 'text-rui-warning' },\n      info: { prepend: 'text-rui-info', append: 'text-rui-info', input: 'text-rui-info', icon: 'text-rui-info' },\n      success: { prepend: 'text-rui-success', append: 'text-rui-success', input: 'text-rui-success', icon: 'text-rui-success' },\n    },\n    validation: {\n      error: {\n        input: '!border-rui-error',\n        label: '!text-rui-error !after:border-rui-error',\n      },\n      success: {\n        input: '!border-rui-success',\n        label: '!text-rui-success !after:border-rui-success',\n      },\n    },\n  },\n  compoundVariants: [\n    // --- Default variant ---\n    { variant: 'default', focused: true, class: { label: 'after:scale-x-100' } },\n    { variant: 'default', dense: true, class: { input: 'py-1', label: 'leading-[3.5]' } },\n    // In dense mode, lift only the labelText glyphs (not the label\n    // container) so the floated label clears the compact ~32px input row.\n    // Translating the label container would drag its `after:` underline\n    // pseudo with it, leaving the focus underline floating above the\n    // input row; translating only the inner span keeps the underline\n    // anchored. Non-dense default has enough vertical breathing room\n    // (~36px input + 12px `pt-3` reserve) that the labelText sits cleanly\n    // above the input without any lift.\n    { variant: 'default', dense: true, active: true, class: { labelText: '-translate-y-[0.5rem]' } },\n    // Without a label, the wrapper's `pt-3` floating-label reserve serves no\n    // purpose and leaves the field ~4–12px taller than an equivalent\n    // RuiMenuSelect dense activator. Strip it and tighten the input padding\n    // so the underline sits at a matching baseline (40px non-dense, 32px\n    // dense) — these match min-h-10 and !min-h-8 of the menu-select\n    // activator.\n    { variant: 'default', noLabel: true, class: { wrapper: '!pt-0', input: 'py-2' } },\n    { variant: 'default', noLabel: true, dense: true, class: { input: 'py-1' } },\n\n    // --- Filled variant ---\n    { variant: 'filled', focused: true, class: { label: 'bg-black/[0.09] dark:bg-white/[0.13]' } },\n    { variant: 'filled', active: true, class: { label: 'leading-[1.5]' } },\n    { variant: 'filled', dense: true, class: { input: 'pt-5 pb-1', label: 'leading-[3]' } },\n    { variant: 'filled', dense: true, active: true, class: { label: 'leading-[2.25]' } },\n    { variant: 'filled', noLabel: true, class: { input: 'py-4' } },\n    { variant: 'filled', noLabel: true, dense: true, class: { input: 'py-3' } },\n\n    // --- Outlined variant ---\n    { variant: 'outlined', active: true, class: {\n      input: 'border-t-transparent',\n      // Use a fixed translate in rem (≈50% of the active label's\n      // 0.9375rem height — text-[0.75rem] × leading-tight). A percentage\n      // translate gets recomputed against the *current* label height,\n      // which jumps from 0.9375rem to the input's full height the moment\n      // !h-auto is removed on blur — producing a transient transform far\n      // larger than the floated value and a visible upward overshoot\n      // before the transition settles. Anchoring in rem (rather than %)\n      // keeps the start/end values consistent across the height swap and\n      // scales with the root font-size.\n      //\n      // Override the active slot's padding-left to drop `--prepend-w` and\n      // stay anchored to the field's left edge — per MD3, the floated\n      // label of an outlined field straddles the border at the start of\n      // the field, not above the input column. Filled/default both keep\n      // the prepend offset (label sits above the input), but outlined\n      // does not.\n      label: '!h-auto -translate-y-[0.5rem] [padding-left:var(--x-padding,0px)]',\n    } },\n    { variant: 'outlined', dense: true, class: { input: 'py-2', label: 'leading-[2.5]' } },\n    // Re-assert `leading-tight` for outlined+dense+active. The dense rule\n    // above sets `leading-[2.5]` which twMerge keeps as the winning leading\n    // (it appears later than the active slot's `leading-tight`), inflating\n    // the floated label's line-box from ~15px to ~30px and pushing its\n    // visual centre below the fieldset border.\n    { variant: 'outlined', dense: true, active: true, class: { label: '!leading-tight' } },\n\n    // --- Focus label color (per color) ---\n    { focused: true, color: 'primary', class: { label: 'text-rui-primary' } },\n    { focused: true, color: 'secondary', class: { label: 'text-rui-secondary' } },\n    { focused: true, color: 'error', class: { label: 'text-rui-error' } },\n    { focused: true, color: 'warning', class: { label: 'text-rui-warning' } },\n    { focused: true, color: 'info', class: { label: 'text-rui-info' } },\n    { focused: true, color: 'success', class: { label: 'text-rui-success' } },\n\n    // --- Label after border color (always applied when color set) ---\n    { color: 'primary', class: { label: 'after:border-rui-primary' } },\n    { color: 'secondary', class: { label: 'after:border-rui-secondary' } },\n    { color: 'error', class: { label: 'after:border-rui-error' } },\n    { color: 'warning', class: { label: 'after:border-rui-warning' } },\n    { color: 'info', class: { label: 'after:border-rui-info' } },\n    { color: 'success', class: { label: 'after:border-rui-success' } },\n  ],\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n"],"mappings":"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"}

package/dist/components/forms/text-input-styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-input-styles.js","names":[],"sources":["../../../src/components/forms/text-input-styles.ts"],"sourcesContent":["import { tv } from '@/utils/tv';\n\nexport const TextInputVariant = {\n  default: 'default',\n  filled: 'filled',\n  outlined: 'outlined',\n} as const;\n\nexport type TextInputVariant = (typeof TextInputVariant)[keyof typeof TextInputVariant];\n\n/**\n * Shared underline pseudo-element classes for default and filled variants.\n * Used by TextField and TextArea label slots.\n */\nexport const underlinePseudo = [\n  'border-b border-black/[0.42] dark:border-white/[0.42]',\n  'after:content-[\\'\\'] after:absolute after:bottom-0 after:left-0 after:block after:w-full',\n  'after:scale-x-0 after:border-b-2 after:mb-[-1px] after:transition-transform after:duration-300',\n  'after:border-black dark:after:border-white',\n].join(' ');\n\n/**\n * Shared base tv() for all text-input-family components.\n * Extended by: TextField, TextArea, MenuSelect, AutoComplete, DateTimePicker.\n *\n * Provides the common core: floating label, fieldset/legend (outlined),\n * validation colors, disabled state, dark mode, and focus color.\n *\n * ## State approach (JS-driven for all 5 components)\n *\n * - `focused`: from useFocus (Group A) or computed from isOpen (Group B)\n * - `active`: focused || hasValue — drives label float\n * - `hovered`: mouseenter/mouseleave ref\n *\n * ## Legend content\n *\n * The legend's `after:content` uses CSS variable `--rui-legend`.\n * Bind via `:style=\"{ '--rui-legend': labelWithQuote }\"` on the legend element.\n */\nexport const textInputBase = tv({\n  slots: {\n    label: 'text-rui-text-secondary transition-all duration-75',\n    fieldset: [\n      'absolute w-full min-w-0 h-[calc(100%+0.5rem)] top-0 left-0',\n      'rounded pointer-events-none px-2 transition-all -mt-2',\n      'border border-black/[0.23]',\n      'dark:border-white/[0.23]',\n      // Force the fieldset onto its own GPU compositing layer so the\n      // focused border is rasterized on integer pixel boundaries. Without\n      // this, at fractional y-coordinates with non-integer device pixel\n      // ratios (e.g. DPR 1.25), Chromium anti-aliases the 1.6px-2px focus\n      // border across two physical pixel rows behind the floated label,\n      // appearing as \"two thin lines crossing the label\". translateZ(0)\n      // promotes to a layer; the layer's raster snaps to integer pixels.\n      'transform-gpu',\n    ].join(' '),\n    legend: 'invisible text-[0.75rem] truncate [max-width:calc(100%-1rem)] leading-[0]',\n  },\n  variants: {\n    focused: {\n      true: {\n        fieldset: '!border-2',\n      },\n    },\n    hovered: {\n      true: {\n        fieldset: 'border-black dark:border-white',\n      },\n    },\n    disabled: {\n      true: {\n        fieldset: '!border-dotted !border-black/[0.23] dark:!border-white/[0.23]',\n        label: 'text-rui-text-disabled',\n      },\n    },\n    active: {\n      true: {},\n    },\n    showLabel: {\n      true: {},\n    },\n    validation: {\n      error: {\n        fieldset: '!border-rui-error',\n        label: '!text-rui-error',\n      },\n      success: {\n        fieldset: '!border-rui-success',\n        label: '!text-rui-success',\n      },\n    },\n    color: {\n      primary: {},\n      secondary: {},\n      error: {},\n      warning: {},\n      info: {},\n      success: {},\n    },\n  },\n  compoundVariants: [\n    // Legend padding only when label is floated (active + has label)\n    { showLabel: true, active: true, class: { legend: 'px-2' } },\n    // Focused + color → fieldset border takes the color\n    { focused: true, color: 'primary', class: { fieldset: '!border-rui-primary' } },\n    { focused: true, color: 'secondary', class: { fieldset: '!border-rui-secondary' } },\n    { focused: true, color: 'error', class: { fieldset: '!border-rui-error' } },\n    { focused: true, color: 'warning', class: { fieldset: '!border-rui-warning' } },\n    { focused: true, color: 'info', class: { fieldset: '!border-rui-info' } },\n    { focused: true, color: 'success', class: { fieldset: '!border-rui-success' } },\n  ],\n  defaultVariants: {\n    color: 'primary',\n  },\n});\n\n/**\n * Shared tv() styles for the activator-based components (Group B):\n * MenuSelect, AutoComplete, DateTimePicker.\n *\n * IMPORTANT: tv() extend does NOT deduplicate conflicting Tailwind classes.\n * Never put a class in the base slot that a variant needs to override.\n *\n * State-driven via JS refs: `outlined`, `float` (open || hasValue),\n * `opened`, `disabled`, `readonly`, `dense`.\n */\nexport const activatorStyles = tv({\n  extend: textInputBase,\n  slots: {\n    // Re-declare base slots for type inference\n    fieldset: '',\n    legend: '',\n    // `w-full inline-flex flex-col` so the activator fills its parent\n    // regardless of context (block, flex-row, grid). A consumer-passed\n    // width utility like `w-[20rem]` would normally collide with `w-full`\n    // on the same element and lose to cascade order; RuiAutoComplete /\n    // RuiMenuSelect / RuiDateTimePicker route consumer classes through\n    // `ui.wrapper({ class })` so tailwind-variants' twMerge deduplicates\n    // and the consumer's width wins.\n    wrapper: 'w-full inline-flex flex-col',\n    activator: [\n      'group relative inline-flex items-center w-full',\n      'outline-none focus:outline-none focus-within:outline-none cursor-pointer',\n      'min-h-14 pl-4 py-2 pr-8 rounded',\n      'm-0 transition-all text-body-1 text-left',\n      'dark:text-rui-text',\n    ].join(' '),\n    label: [\n      'text-rui-text-secondary [max-width:calc(100%-2.5rem)]',\n      'block truncate transition-all duration-75',\n    ].join(' '),\n    value: 'w-full block truncate transition-all duration-75',\n    clear: 'ml-auto shrink-0 invisible group-hover:!visible',\n    menu: 'overflow-y-auto max-h-60 min-w-[2.5rem]',\n    highlighted: '!bg-rui-grey-200 dark:!bg-rui-grey-800',\n    progress: 'absolute left-0 bottom-0 w-full',\n    icon: 'text-rui-text transition',\n    iconWrapper: 'flex items-center justify-end absolute right-3 top-px bottom-0',\n    required: 'text-rui-error',\n  },\n  variants: {\n    dense: {\n      true: {\n        activator: 'py-1.5 min-h-10',\n      },\n    },\n    disabled: {\n      true: {\n        activator: 'opacity-65 text-rui-text-disabled active:text-rui-text-disabled cursor-default pointer-events-none',\n      },\n    },\n    readonly: {\n      true: {\n        activator: 'opacity-80 pointer-events-none cursor-default bg-gray-50 dark:bg-white/10',\n      },\n    },\n    filled: {\n      true: {\n        activator: [\n          '!rounded-t !rounded-b-none !bg-black/[0.06]',\n          '!hover:bg-black/[0.09] !focus-within:bg-black/[0.09]',\n          'dark:!bg-white/[0.09]',\n          'dark:!hover:bg-white/[0.13] dark:!focus-within:bg-white/[0.13]',\n          underlinePseudo,\n        ].join(' '),\n      },\n    },\n    outlined: {\n      true: {\n        activator: 'bg-white dark:bg-transparent border-none hover:border-none',\n        label: 'absolute',\n        fieldset: '!mt-0 !h-full',\n      },\n      false: {\n        activator: `!rounded-none ${underlinePseudo}`,\n      },\n    },\n    float: {\n      true: {\n        label: '-translate-y-2 top-0 text-[0.75rem] leading-4',\n      },\n    },\n    opened: {\n      true: {\n        icon: 'rotate-180',\n      },\n    },\n    active: {\n      true: {\n        highlighted: '!bg-rui-grey-300 dark:!bg-rui-grey-700',\n      },\n    },\n    hasError: {\n      true: {},\n    },\n    hasSuccess: {\n      true: {},\n    },\n    // Re-declare for type inference — actual styles are in textInputBase\n    hovered: { true: {} },\n  },\n  compoundVariants: [\n    // Legend padding when label is floated\n    { float: true, class: { legend: 'px-2' } },\n\n    // Non-outlined + opened → underline scales up\n    { outlined: false, opened: true, class: { activator: 'after:scale-x-100 after:border-rui-primary' } },\n\n    // Non-outlined + error → underline color\n    { outlined: false, hasError: true, class: { activator: 'after:scale-x-100 after:!border-rui-error' } },\n\n    // Non-outlined + success → underline color\n    { outlined: false, hasSuccess: true, class: { activator: 'after:scale-x-100 after:!border-rui-success' } },\n\n    // Non-outlined + disabled in dark mode\n    { outlined: false, disabled: true, class: { activator: 'dark:bg-white/10' } },\n\n    // Filled + disabled\n    { filled: true, disabled: true, class: { activator: 'bg-black/[0.03] dark:bg-white/[0.05]' } },\n\n    // Outlined + hovered → fieldset border\n    { outlined: true, hovered: true, class: { fieldset: 'border-black dark:border-white' } },\n\n    // Outlined + opened/focused → primary border\n    { outlined: true, opened: true, class: {\n      fieldset: '!border-rui-primary !border-2',\n      label: 'text-rui-primary',\n    } },\n\n    // Outlined + error → fieldset + label\n    { outlined: true, hasError: true, class: {\n      fieldset: '!border-rui-error',\n      label: '!text-rui-error',\n    } },\n    // Outlined + success → fieldset + label\n    { outlined: true, hasSuccess: true, class: {\n      fieldset: '!border-rui-success',\n      label: '!text-rui-success',\n    } },\n\n    // Outlined + disabled → dotted fieldset\n    { outlined: true, disabled: true, class: {\n      fieldset: '!border-dotted !border-black/[0.23] dark:!border-white/[0.23]',\n    } },\n\n    // Float + opened → label color\n    { float: true, opened: true, class: { label: 'text-rui-primary' } },\n  ],\n  defaultVariants: {\n    filled: false,\n    outlined: false,\n    dense: false,\n    disabled: false,\n    readonly: false,\n    float: false,\n    opened: false,\n  },\n});\n"],"mappings":"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"}
+{"version":3,"file":"text-input-styles.js","names":[],"sources":["../../../src/components/forms/text-input-styles.ts"],"sourcesContent":["import { tv } from '@/utils/tv';\n\nexport const TextInputVariant = {\n  default: 'default',\n  filled: 'filled',\n  outlined: 'outlined',\n} as const;\n\nexport type TextInputVariant = (typeof TextInputVariant)[keyof typeof TextInputVariant];\n\n/**\n * Shared underline pseudo-element classes for default and filled variants.\n * Used by TextField and TextArea label slots.\n */\nexport const underlinePseudo = [\n  'border-b border-black/[0.42] dark:border-white/[0.42]',\n  'after:content-[\\'\\'] after:absolute after:bottom-0 after:left-0 after:block after:w-full',\n  'after:scale-x-0 after:border-b-2 after:mb-[-1px] after:transition-transform after:duration-300',\n  'after:border-black dark:after:border-white',\n].join(' ');\n\n/**\n * Shared base tv() for all text-input-family components.\n * Extended by: TextField, TextArea, MenuSelect, AutoComplete, DateTimePicker.\n *\n * Provides the common core: floating label, fieldset/legend (outlined),\n * validation colors, disabled state, dark mode, and focus color.\n *\n * ## State approach (JS-driven for all 5 components)\n *\n * - `focused`: from useFocus (Group A) or computed from isOpen (Group B)\n * - `active`: focused || hasValue — drives label float\n * - `hovered`: mouseenter/mouseleave ref\n *\n * ## Legend content\n *\n * The legend's `after:content` uses CSS variable `--rui-legend`.\n * Bind via `:style=\"{ '--rui-legend': labelWithQuote }\"` on the legend element.\n */\nexport const textInputBase = tv({\n  slots: {\n    label: 'text-rui-text-secondary transition-all duration-75',\n    fieldset: [\n      'absolute w-full min-w-0 h-[calc(100%+0.5rem)] top-0 left-0',\n      'rounded pointer-events-none px-2 transition-all -mt-2',\n      'border border-black/[0.23]',\n      'dark:border-white/[0.23]',\n      // Force the fieldset onto its own GPU compositing layer so the\n      // focused border is rasterized on integer pixel boundaries. Without\n      // this, at fractional y-coordinates with non-integer device pixel\n      // ratios (e.g. DPR 1.25), Chromium anti-aliases the 1.6px-2px focus\n      // border across two physical pixel rows behind the floated label,\n      // appearing as \"two thin lines crossing the label\". translateZ(0)\n      // promotes to a layer; the layer's raster snaps to integer pixels.\n      'transform-gpu',\n    ].join(' '),\n    legend: 'invisible text-[0.75rem] truncate [max-width:calc(100%-1rem)] leading-[0]',\n  },\n  variants: {\n    focused: {\n      true: {\n        fieldset: '!border-2',\n      },\n    },\n    hovered: {\n      true: {\n        fieldset: 'border-black dark:border-white',\n      },\n    },\n    disabled: {\n      true: {\n        fieldset: '!border-dotted !border-black/[0.23] dark:!border-white/[0.23]',\n        label: 'text-rui-text-disabled',\n      },\n    },\n    active: {\n      true: {},\n    },\n    showLabel: {\n      true: {},\n    },\n    validation: {\n      error: {\n        fieldset: '!border-rui-error',\n        label: '!text-rui-error',\n      },\n      success: {\n        fieldset: '!border-rui-success',\n        label: '!text-rui-success',\n      },\n    },\n    color: {\n      primary: {},\n      secondary: {},\n      error: {},\n      warning: {},\n      info: {},\n      success: {},\n    },\n  },\n  compoundVariants: [\n    // Legend padding only when label is floated (active + has label)\n    { showLabel: true, active: true, class: { legend: 'px-2' } },\n    // Focused + color → fieldset border takes the color\n    { focused: true, color: 'primary', class: { fieldset: '!border-rui-primary' } },\n    { focused: true, color: 'secondary', class: { fieldset: '!border-rui-secondary' } },\n    { focused: true, color: 'error', class: { fieldset: '!border-rui-error' } },\n    { focused: true, color: 'warning', class: { fieldset: '!border-rui-warning' } },\n    { focused: true, color: 'info', class: { fieldset: '!border-rui-info' } },\n    { focused: true, color: 'success', class: { fieldset: '!border-rui-success' } },\n  ],\n  defaultVariants: {\n    color: 'primary',\n  },\n});\n\n/**\n * Shared tv() styles for the activator-based components (Group B):\n * MenuSelect, AutoComplete, DateTimePicker.\n *\n * IMPORTANT: tv() extend does NOT deduplicate conflicting Tailwind classes.\n * Never put a class in the base slot that a variant needs to override.\n *\n * State-driven via JS refs: `outlined`, `float` (open || hasValue),\n * `opened`, `disabled`, `readonly`, `dense`.\n */\nexport const activatorStyles = tv({\n  extend: textInputBase,\n  slots: {\n    // Re-declare base slots for type inference\n    fieldset: '',\n    legend: '',\n    // `w-full inline-flex flex-col` so the activator fills its parent\n    // regardless of context (block, flex-row, grid). A consumer-passed\n    // width utility like `w-[20rem]` would normally collide with `w-full`\n    // on the same element and lose to cascade order; RuiAutoComplete /\n    // RuiMenuSelect / RuiDateTimePicker route consumer classes through\n    // `ui.wrapper({ class })` so tailwind-variants' twMerge deduplicates\n    // and the consumer's width wins.\n    wrapper: 'w-full inline-flex flex-col',\n    activator: [\n      'group relative inline-flex items-center w-full',\n      'outline-none focus:outline-none focus-within:outline-none cursor-pointer',\n      'min-h-14 pl-4 py-2 pr-8 rounded',\n      'm-0 transition-all text-body-1 text-left',\n      'dark:text-rui-text',\n    ].join(' '),\n    label: [\n      'text-rui-text-secondary [max-width:calc(100%-2.5rem)]',\n      'block truncate transition-all duration-75',\n    ].join(' '),\n    value: 'w-full block truncate transition-all duration-75',\n    clear: 'ml-auto shrink-0 invisible group-hover:!visible',\n    menu: 'overflow-y-auto max-h-60 min-w-[2.5rem]',\n    highlighted: '!bg-rui-grey-200 dark:!bg-rui-grey-800',\n    progress: 'absolute left-0 bottom-0 w-full',\n    icon: 'text-rui-text transition',\n    iconWrapper: 'flex items-center justify-end absolute right-3 top-px bottom-0',\n    required: 'text-rui-error',\n  },\n  variants: {\n    dense: {\n      true: {\n        activator: 'py-1.5 min-h-10',\n      },\n    },\n    disabled: {\n      true: {\n        activator: 'opacity-65 text-rui-text-disabled active:text-rui-text-disabled cursor-default pointer-events-none',\n      },\n    },\n    readonly: {\n      true: {\n        activator: 'opacity-80 pointer-events-none cursor-default bg-gray-50 dark:bg-white/10',\n      },\n    },\n    filled: {\n      true: {\n        activator: [\n          '!rounded-t !rounded-b-none !bg-black/[0.06]',\n          '!hover:bg-black/[0.09] !focus-within:bg-black/[0.09]',\n          'dark:!bg-white/[0.09]',\n          'dark:!hover:bg-white/[0.13] dark:!focus-within:bg-white/[0.13]',\n          underlinePseudo,\n        ].join(' '),\n      },\n    },\n    outlined: {\n      true: {\n        activator: 'bg-white dark:bg-transparent border-none hover:border-none',\n        label: 'absolute',\n        fieldset: '!mt-0 !h-full',\n      },\n      false: {\n        activator: `!rounded-none ${underlinePseudo}`,\n      },\n    },\n    float: {\n      true: {\n        label: '-translate-y-2 top-0 text-[0.75rem] leading-4',\n      },\n    },\n    opened: {\n      true: {\n        icon: 'rotate-180',\n      },\n    },\n    active: {\n      true: {\n        highlighted: '!bg-rui-grey-300 dark:!bg-rui-grey-700',\n      },\n    },\n    hasError: {\n      true: {},\n    },\n    hasSuccess: {\n      true: {},\n    },\n    // Re-declare for type inference — actual styles are in textInputBase\n    hovered: { true: {} },\n  },\n  compoundVariants: [\n    // Legend padding when label is floated\n    { float: true, class: { legend: 'px-2' } },\n\n    // Non-outlined + opened → underline scales up\n    { outlined: false, opened: true, class: { activator: 'after:scale-x-100 after:border-rui-primary' } },\n\n    // Non-outlined + error → underline color\n    { outlined: false, hasError: true, class: { activator: 'after:scale-x-100 after:!border-rui-error' } },\n\n    // Non-outlined + success → underline color\n    { outlined: false, hasSuccess: true, class: { activator: 'after:scale-x-100 after:!border-rui-success' } },\n\n    // Non-outlined + disabled in dark mode\n    { outlined: false, disabled: true, class: { activator: 'dark:bg-white/10' } },\n\n    // Filled + disabled\n    { filled: true, disabled: true, class: { activator: 'bg-black/[0.03] dark:bg-white/[0.05]' } },\n\n    // Outlined + hovered → fieldset border\n    { outlined: true, hovered: true, class: { fieldset: 'border-black dark:border-white' } },\n\n    // Outlined + opened/focused → primary border\n    { outlined: true, opened: true, class: {\n      fieldset: '!border-rui-primary !border-2',\n      label: 'text-rui-primary',\n    } },\n\n    // Outlined + error → fieldset + label\n    { outlined: true, hasError: true, class: {\n      fieldset: '!border-rui-error',\n      label: '!text-rui-error',\n    } },\n    // Outlined + success → fieldset + label\n    { outlined: true, hasSuccess: true, class: {\n      fieldset: '!border-rui-success',\n      label: '!text-rui-success',\n    } },\n\n    // Outlined + disabled → dotted fieldset\n    { outlined: true, disabled: true, class: {\n      fieldset: '!border-dotted !border-black/[0.23] dark:!border-white/[0.23]',\n    } },\n\n    // Float + opened → label color\n    { float: true, opened: true, class: { label: 'text-rui-primary' } },\n  ],\n  defaultVariants: {\n    filled: false,\n    outlined: false,\n    dense: false,\n    disabled: false,\n    readonly: false,\n    float: false,\n    opened: false,\n  },\n});\n"],"mappings":";;;;;;AAcA,IAAa,kBAAkB;CAC7B;CACA;CACA;CACA;AACF,CAAC,CAAC,KAAK,GAAG;;;;;;;;;;;;;;;;;;;AAoBV,IAAa,gBAAgB,GAAG;CAC9B,OAAO;EACL,OAAO;EACP,UAAU;GACR;GACA;GACA;GACA;GAQA;EACF,CAAC,CAAC,KAAK,GAAG;EACV,QAAQ;CACV;CACA,UAAU;EACR,SAAS,EACP,MAAM,EACJ,UAAU,YACZ,EACF;EACA,SAAS,EACP,MAAM,EACJ,UAAU,iCACZ,EACF;EACA,UAAU,EACR,MAAM;GACJ,UAAU;GACV,OAAO;EACT,EACF;EACA,QAAQ,EACN,MAAM,CAAC,EACT;EACA,WAAW,EACT,MAAM,CAAC,EACT;EACA,YAAY;GACV,OAAO;IACL,UAAU;IACV,OAAO;GACT;GACA,SAAS;IACP,UAAU;IACV,OAAO;GACT;EACF;EACA,OAAO;GACL,SAAS,CAAC;GACV,WAAW,CAAC;GACZ,OAAO,CAAC;GACR,SAAS,CAAC;GACV,MAAM,CAAC;GACP,SAAS,CAAC;EACZ;CACF;CACA,kBAAkB;EAEhB;GAAE,WAAW;GAAM,QAAQ;GAAM,OAAO,EAAE,QAAQ,OAAO;EAAE;EAE3D;GAAE,SAAS;GAAM,OAAO;GAAW,OAAO,EAAE,UAAU,sBAAsB;EAAE;EAC9E;GAAE,SAAS;GAAM,OAAO;GAAa,OAAO,EAAE,UAAU,wBAAwB;EAAE;EAClF;GAAE,SAAS;GAAM,OAAO;GAAS,OAAO,EAAE,UAAU,oBAAoB;EAAE;EAC1E;GAAE,SAAS;GAAM,OAAO;GAAW,OAAO,EAAE,UAAU,sBAAsB;EAAE;EAC9E;GAAE,SAAS;GAAM,OAAO;GAAQ,OAAO,EAAE,UAAU,mBAAmB;EAAE;EACxE;GAAE,SAAS;GAAM,OAAO;GAAW,OAAO,EAAE,UAAU,sBAAsB;EAAE;CAChF;CACA,iBAAiB,EACf,OAAO,UACT;AACF,CAAC;;;;;;;;;;;AAYD,IAAa,kBAAkB,GAAG;CAChC,QAAQ;CACR,OAAO;EAEL,UAAU;EACV,QAAQ;EAQR,SAAS;EACT,WAAW;GACT;GACA;GACA;GACA;GACA;EACF,CAAC,CAAC,KAAK,GAAG;EACV,OAAO,CACL,yDACA,2CACF,CAAC,CAAC,KAAK,GAAG;EACV,OAAO;EACP,OAAO;EACP,MAAM;EACN,aAAa;EACb,UAAU;EACV,MAAM;EACN,aAAa;EACb,UAAU;CACZ;CACA,UAAU;EACR,OAAO,EACL,MAAM,EACJ,WAAW,kBACb,EACF;EACA,UAAU,EACR,MAAM,EACJ,WAAW,qGACb,EACF;EACA,UAAU,EACR,MAAM,EACJ,WAAW,4EACb,EACF;EACA,QAAQ,EACN,MAAM,EACJ,WAAW;GACT;GACA;GACA;GACA;GACA;EACF,CAAC,CAAC,KAAK,GAAG,EACZ,EACF;EACA,UAAU;GACR,MAAM;IACJ,WAAW;IACX,OAAO;IACP,UAAU;GACZ;GACA,OAAO,EACL,WAAW,iBAAiB,kBAC9B;EACF;EACA,OAAO,EACL,MAAM,EACJ,OAAO,gDACT,EACF;EACA,QAAQ,EACN,MAAM,EACJ,MAAM,aACR,EACF;EACA,QAAQ,EACN,MAAM,EACJ,aAAa,yCACf,EACF;EACA,UAAU,EACR,MAAM,CAAC,EACT;EACA,YAAY,EACV,MAAM,CAAC,EACT;EAEA,SAAS,EAAE,MAAM,CAAC,EAAE;CACtB;CACA,kBAAkB;EAEhB;GAAE,OAAO;GAAM,OAAO,EAAE,QAAQ,OAAO;EAAE;EAGzC;GAAE,UAAU;GAAO,QAAQ;GAAM,OAAO,EAAE,WAAW,6CAA6C;EAAE;EAGpG;GAAE,UAAU;GAAO,UAAU;GAAM,OAAO,EAAE,WAAW,4CAA4C;EAAE;EAGrG;GAAE,UAAU;GAAO,YAAY;GAAM,OAAO,EAAE,WAAW,8CAA8C;EAAE;EAGzG;GAAE,UAAU;GAAO,UAAU;GAAM,OAAO,EAAE,WAAW,mBAAmB;EAAE;EAG5E;GAAE,QAAQ;GAAM,UAAU;GAAM,OAAO,EAAE,WAAW,uCAAuC;EAAE;EAG7F;GAAE,UAAU;GAAM,SAAS;GAAM,OAAO,EAAE,UAAU,iCAAiC;EAAE;EAGvF;GAAE,UAAU;GAAM,QAAQ;GAAM,OAAO;IACrC,UAAU;IACV,OAAO;GACT;EAAE;EAGF;GAAE,UAAU;GAAM,UAAU;GAAM,OAAO;IACvC,UAAU;IACV,OAAO;GACT;EAAE;EAEF;GAAE,UAAU;GAAM,YAAY;GAAM,OAAO;IACzC,UAAU;IACV,OAAO;GACT;EAAE;EAGF;GAAE,UAAU;GAAM,UAAU;GAAM,OAAO,EACvC,UAAU,gEACZ;EAAE;EAGF;GAAE,OAAO;GAAM,QAAQ;GAAM,OAAO,EAAE,OAAO,mBAAmB;EAAE;CACpE;CACA,iBAAiB;EACf,QAAQ;EACR,UAAU;EACV,OAAO;EACP,UAAU;EACV,UAAU;EACV,OAAO;EACP,QAAQ;CACV;AACF,CAAC"}

package/dist/components/helpers/RuiFormTextDetail.vue_vue_type_script_setup_true_lang.js

@@ -13,7 +13,7 @@ var _hoisted_3 = {
 	key: "hint",
 	class: "text-rui-text-secondary text-caption"
 };
-var RuiFormTextDetail_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var RuiFormTextDetail_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "RuiFormTextDetail",
 	props: {
 		errorMessages: { default: () => [] },

package/dist/components/helpers/RuiFormTextDetail.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiFormTextDetail.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/helpers/RuiFormTextDetail.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useFormTextDetail } from '@/utils/form-text-detail';\n\nconst {\n  errorMessages = [],\n  successMessages = [],\n  hint = '',\n} = defineProps<{\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hint?: string;\n}>();\n\nconst { formattedErrorMessages, formattedSuccessMessages, hasError, hasSuccess } =\n  useFormTextDetail(\n    () => errorMessages,\n    () => successMessages,\n  );\n</script>\n\n<template>\n  <TransitionGroup\n    tag=\"div\"\n    class=\"details min-h-[1.5rem]\"\n    enter-from-class=\"opacity-0 -translate-y-2 h-0\"\n    enter-active-class=\"transform transition\"\n    enter-to-class=\"opacity-100 translate-y-0\"\n    leave-from-class=\"opacity-100 -translate-y-2\"\n    leave-active-class=\"transform transition\"\n    leave-to-class=\"opacity-0 -translate-y-2 h-0\"\n    appear\n  >\n    <div\n      v-if=\"hasError\"\n      key=\"error\"\n      class=\"text-rui-error text-caption\"\n    >\n      {{ formattedErrorMessages[0] }}\n    </div>\n    <div\n      v-else-if=\"hasSuccess\"\n      key=\"success\"\n      class=\"text-rui-success text-caption\"\n    >\n      {{ formattedSuccessMessages[0] }}\n    </div>\n    <div\n      v-else-if=\"hint\"\n      key=\"hint\"\n      class=\"text-rui-text-secondary text-caption\"\n    >\n      {{ hint }}\n    </div>\n  </TransitionGroup>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;EAaA,MAAM,EAAE,wBAAwB,0BAA0B,UAAU,eAClE,wBACQ,QAAA,qBACA,QAAA,gBACP;;uBAID,YAgCkB,iBAAA;IA/BhB,KAAI;IACJ,OAAM;IACN,oBAAiB;IACjB,sBAAmB;IACnB,kBAAe;IACf,oBAAiB;IACjB,sBAAmB;IACnB,kBAAe;IACf,QAAA;;2BAQM,CALE,MAAA,SAAQ,IAAA,WAAA,EADhB,mBAMM,OANN,YAMM,gBADD,MAAA,uBAAsB,CAAA,GAAA,EAAA,EAAA,IAGd,MAAA,WAAU,IAAA,WAAA,EADvB,mBAMM,OANN,YAMM,gBADD,MAAA,yBAAwB,CAAA,GAAA,EAAA,EAAA,IAGhB,QAAA,QAAA,WAAA,EADb,mBAMM,OANN,YAMM,gBADD,QAAA,KAAI,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA,CAAA,CAAA"}
+{"version":3,"file":"RuiFormTextDetail.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/helpers/RuiFormTextDetail.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useFormTextDetail } from '@/utils/form-text-detail';\n\nconst {\n  errorMessages = [],\n  successMessages = [],\n  hint = '',\n} = defineProps<{\n  errorMessages?: string | string[];\n  successMessages?: string | string[];\n  hint?: string;\n}>();\n\nconst { formattedErrorMessages, formattedSuccessMessages, hasError, hasSuccess } =\n  useFormTextDetail(\n    () => errorMessages,\n    () => successMessages,\n  );\n</script>\n\n<template>\n  <TransitionGroup\n    tag=\"div\"\n    class=\"details min-h-[1.5rem]\"\n    enter-from-class=\"opacity-0 -translate-y-2 h-0\"\n    enter-active-class=\"transform transition\"\n    enter-to-class=\"opacity-100 translate-y-0\"\n    leave-from-class=\"opacity-100 -translate-y-2\"\n    leave-active-class=\"transform transition\"\n    leave-to-class=\"opacity-0 -translate-y-2 h-0\"\n    appear\n  >\n    <div\n      v-if=\"hasError\"\n      key=\"error\"\n      class=\"text-rui-error text-caption\"\n    >\n      {{ formattedErrorMessages[0] }}\n    </div>\n    <div\n      v-else-if=\"hasSuccess\"\n      key=\"success\"\n      class=\"text-rui-success text-caption\"\n    >\n      {{ formattedSuccessMessages[0] }}\n    </div>\n    <div\n      v-else-if=\"hint\"\n      key=\"hint\"\n      class=\"text-rui-text-secondary text-caption\"\n    >\n      {{ hint }}\n    </div>\n  </TransitionGroup>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;EAaA,MAAM,EAAE,wBAAwB,0BAA0B,UAAU,eAClE,wBACQ,QAAA,qBACA,QAAA,eACR;;uBAIA,YAgCkB,iBAAA;IA/BhB,KAAI;IACJ,OAAM;IACN,oBAAiB;IACjB,sBAAmB;IACnB,kBAAe;IACf,oBAAiB;IACjB,sBAAmB;IACnB,kBAAe;IACf,QAAA;;2BAQM,CALE,MAAA,QAAA,KAAA,UAAA,GADR,mBAMM,OANN,YAMM,gBADD,MAAA,sBAAA,CAAsB,CAAA,EAAA,GAAA,CAAA,KAGd,MAAA,UAAA,KAAA,UAAA,GADb,mBAMM,OANN,YAMM,gBADD,MAAA,wBAAA,CAAwB,CAAA,EAAA,GAAA,CAAA,KAGhB,QAAA,QAAA,UAAA,GADb,mBAMM,OANN,YAMM,gBADD,QAAA,IAAI,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,CAAA"}

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

@@ -4,7 +4,7 @@ import { tv } from "../../utils/tv.js";
 import { Fragment, computed, createBlock, createElementBlock, defineComponent, mergeProps, normalizeClass, normalizeStyle, openBlock, renderList, resolveDynamicComponent, unref } from "vue";
 import { get } from "@vueuse/shared";
 //#region src/components/icons/RuiIcon.vue?vue&type=script&setup=true&lang.ts
-var RuiIcon_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var RuiIcon_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "RuiIcon",
 	__name: "RuiIcon",
 	props: {

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":[],"sources":["../../../src/components/icons/RuiIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { ContextColorsType } from '@/consts/colors';\nimport { useIcons } from '@/composables/icons';\nimport { isRuiIcon, type RuiIcons } from '@/icons';\nimport { tv } from '@/utils/tv';\n\nexport interface Props {\n  name: RuiIcons;\n  size?: number | string;\n  color?: ContextColorsType;\n}\n\ndefineOptions({\n  name: 'RuiIcon',\n});\n\nconst { name, size, color } = defineProps<Props>();\n\nconst { registeredIcons } = useIcons();\n\ntype SvgComponent = [tag: string, attrs: Record<string, string>];\n\nconst iconStyles = tv({\n  // `shrink-0` keeps the icon at its declared `--rui-icon-size` when it sits\n  // in a flex container next to a long flex-grow sibling (e.g. a `w-full`\n  // button label in `variant=\"list\"`). Without it, the SVG — even with an\n  // explicit width — gets compressed along the main axis when the row is\n  // narrower than the label's intrinsic width, while the height stays put,\n  // producing a sliver glyph. The icon's box is always intentionally driven\n  // by `--rui-icon-size`, so flex shrinking is never the desired behavior.\n  base: 'shrink-0 w-[var(--rui-icon-size,1.5rem)] h-[var(--rui-icon-size,1.5rem)]',\n  variants: {\n    color: {\n      primary: 'text-rui-primary',\n      secondary: 'text-rui-secondary',\n      error: 'text-rui-error',\n      warning: 'text-rui-warning',\n      info: 'text-rui-info',\n      success: 'text-rui-success',\n    },\n  },\n});\n\nconst hasExplicitSize = computed<boolean>(() => size !== undefined);\nconst ui = computed<string>(() => iconStyles({ color }));\n\n// Render the `size` prop as an inline CSS custom property on the svg. Because\n// inline style wins against any inherited value for the same property on this\n// element, the consumer-supplied size beats the button's `--rui-icon-size`\n// assignment without needing !important. A bare number (or numeric string —\n// `:size=\"16\"` resolves to a string in the template binding) is coerced to px;\n// values that already include a unit (`1rem`, `18px`, `calc(...)`) pass\n// through unchanged. The previous SVG-attr path accepted bare numbers because\n// `width`/`height` presentation attrs treat them as px; CSS does not.\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\nconst isFill = computed<boolean>(() => name.endsWith('-fill'));\n\nconst components = computed<SvgComponent[] | undefined>(() => {\n  if (!isRuiIcon(name)) {\n    console.warn(`icon ${name} must be a valid RuiIcon`);\n  }\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\"\n    :style=\"sizeStyle\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <component\n      :is=\"component[0]\"\n      v-for=\"(component, index) in components\"\n      :key=\"index\"\n      v-bind=\"component[1]\"\n      :fill=\"!isFill ? 'none' : 'currentColor'\"\n      :stroke=\"!isFill ? 'currentColor' : 'none'\"\n      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n    />\n  </svg>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;EAkBA,MAAM,EAAE,oBAAoB,UAAU;EAItC,MAAM,aAAa,GAAG;GAQpB,MAAM;GACN,UAAU,EACR,OAAO;IACL,SAAS;IACT,WAAW;IACX,OAAO;IACP,SAAS;IACT,MAAM;IACN,SAAS;IACV,EAAA;GAEJ,CAAC;EAEF,MAAM,kBAAkB,eAAwB,QAAA,SAAS,KAAA,EAAU;EACnE,MAAM,KAAK,eAAuB,WAAW,EAAE,OAAI,QAAA,OAAG,CAAC,CAAC;EAUxD,MAAM,YAAY,eAAmD;AACnE,OAAI,CAAC,IAAI,gBAAgB,CACvB,QAAO,KAAA;GACT,MAAM,MAAM,OAAO,QAAA,KAAK;AAExB,UAAO,EAAE,mBADK,kBAAkB,KAAK,IAAI,GAAG,GAAG,IAAI,MAAM,KACtB;IACnC;EAEF,MAAM,SAAS,eAAwB,QAAA,KAAK,SAAS,QAAQ,CAAC;EAE9D,MAAM,aAAa,eAA2C;AAC5D,OAAI,CAAC,UAAU,QAAA,KAAK,CAClB,SAAQ,KAAK,QAAQ,QAAA,KAAK,0BAA0B;GAEtD,MAAM,QAAQ,gBAAgB,QAAA;AAE9B,OAAI,CAAC,MACH,SAAQ,MACN,UAAU,QAAA,KAAK,sFAChB;AAEH,UAAO;IACP;;uBAIA,mBAqBM,OAAA;IApBJ,eAAY;IACZ,OAAK,eAAA,CAAC,YACE,MAAA,GAAE,CAAA,CAAA;IACT,OAAK,eAAE,MAAA,UAAS,CAAA;IACjB,SAAQ;IACR,OAAM;yBAEN,mBAYE,UAAA,MAAA,WAV6B,MAAA,WAAU,GAA/B,WAAW,UAAK;wBAF1B,YAYE,wBAXK,UAAS,GAAA,EADhB,WAYE,EATC,KAAK,OAAK,EAAA,EAAA,SAAA,MAAA,EACH,UAAS,IAAA;KAChB,MAAI,CAAG,MAAA,OAAM,GAAA,SAAA;KACb,QAAM,CAAG,MAAA,OAAM,GAAA,iBAAA;KAChB,gBAAa;KACb,kBAAe;KACf,mBAAgB;KAChB,aAAU;KACV,aAAU"}
+{"version":3,"file":"RuiIcon.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/icons/RuiIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { ContextColorsType } from '@/consts/colors';\nimport { useIcons } from '@/composables/icons';\nimport { isRuiIcon, type RuiIcons } from '@/icons';\nimport { tv } from '@/utils/tv';\n\nexport interface Props {\n  name: RuiIcons;\n  size?: number | string;\n  color?: ContextColorsType;\n}\n\ndefineOptions({\n  name: 'RuiIcon',\n});\n\nconst { name, size, color } = defineProps<Props>();\n\nconst { registeredIcons } = useIcons();\n\ntype SvgComponent = [tag: string, attrs: Record<string, string>];\n\nconst iconStyles = tv({\n  // `shrink-0` keeps the icon at its declared `--rui-icon-size` when it sits\n  // in a flex container next to a long flex-grow sibling (e.g. a `w-full`\n  // button label in `variant=\"list\"`). Without it, the SVG — even with an\n  // explicit width — gets compressed along the main axis when the row is\n  // narrower than the label's intrinsic width, while the height stays put,\n  // producing a sliver glyph. The icon's box is always intentionally driven\n  // by `--rui-icon-size`, so flex shrinking is never the desired behavior.\n  base: 'shrink-0 w-[var(--rui-icon-size,1.5rem)] h-[var(--rui-icon-size,1.5rem)]',\n  variants: {\n    color: {\n      primary: 'text-rui-primary',\n      secondary: 'text-rui-secondary',\n      error: 'text-rui-error',\n      warning: 'text-rui-warning',\n      info: 'text-rui-info',\n      success: 'text-rui-success',\n    },\n  },\n});\n\nconst hasExplicitSize = computed<boolean>(() => size !== undefined);\nconst ui = computed<string>(() => iconStyles({ color }));\n\n// Render the `size` prop as an inline CSS custom property on the svg. Because\n// inline style wins against any inherited value for the same property on this\n// element, the consumer-supplied size beats the button's `--rui-icon-size`\n// assignment without needing !important. A bare number (or numeric string —\n// `:size=\"16\"` resolves to a string in the template binding) is coerced to px;\n// values that already include a unit (`1rem`, `18px`, `calc(...)`) pass\n// through unchanged. The previous SVG-attr path accepted bare numbers because\n// `width`/`height` presentation attrs treat them as px; CSS does not.\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\nconst isFill = computed<boolean>(() => name.endsWith('-fill'));\n\nconst components = computed<SvgComponent[] | undefined>(() => {\n  if (!isRuiIcon(name)) {\n    console.warn(`icon ${name} must be a valid RuiIcon`);\n  }\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\"\n    :style=\"sizeStyle\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <component\n      :is=\"component[0]\"\n      v-for=\"(component, index) in components\"\n      :key=\"index\"\n      v-bind=\"component[1]\"\n      :fill=\"!isFill ? 'none' : 'currentColor'\"\n      :stroke=\"!isFill ? 'currentColor' : 'none'\"\n      stroke-width=\"2\"\n      stroke-linecap=\"round\"\n      stroke-linejoin=\"round\"\n      fill-rule=\"evenodd\"\n      clip-rule=\"evenodd\"\n    />\n  </svg>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;EAkBA,MAAM,EAAE,oBAAoB,SAAS;EAIrC,MAAM,aAAa,GAAG;GAQpB,MAAM;GACN,UAAU,EACR,OAAO;IACL,SAAS;IACT,WAAW;IACX,OAAO;IACP,SAAS;IACT,MAAM;IACN,SAAS;GACX,EACF;EACF,CAAC;EAED,MAAM,kBAAkB,eAAwB,QAAA,SAAS,KAAA,CAAS;EAClE,MAAM,KAAK,eAAuB,WAAW,EAAE,OAAI,QAAA,MAAE,CAAC,CAAC;EAUvD,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;EAED,MAAM,SAAS,eAAwB,QAAA,KAAK,SAAS,OAAO,CAAC;EAE7D,MAAM,aAAa,eAA2C;GAC5D,IAAI,CAAC,UAAU,QAAA,IAAI,GACjB,QAAQ,KAAK,QAAQ,QAAA,KAAK,yBAAyB;GAErD,MAAM,QAAQ,gBAAgB,QAAA;GAE9B,IAAI,CAAC,OACH,QAAQ,MACN,UAAU,QAAA,KAAK,qFACjB;GAEF,OAAO;EACT,CAAC;;uBAIC,mBAqBM,OAAA;IApBJ,eAAY;IACZ,OAAK,eAAA,CAAC,YACE,MAAA,EAAA,CAAE,CAAA;IACT,OAAK,eAAE,MAAA,SAAA,CAAS;IACjB,SAAQ;IACR,OAAM;yBAEN,mBAYE,UAAA,MAAA,WAV6B,MAAA,UAAA,IAArB,WAAW,UAAK;wBAF1B,YAYE,wBAXK,UAAS,EAAA,GADhB,WAYE,EATC,KAAK,MAAK,GAAA,EAAA,SAAA,KAAA,GACH,UAAS,IAAA;KAChB,MAAI,CAAG,MAAA,MAAA,IAAM,SAAA;KACb,QAAM,CAAG,MAAA,MAAA,IAAM,iBAAA;KAChB,gBAAa;KACb,kBAAe;KACf,mBAAgB;KAChB,aAAU;KACV,aAAU"}

package/dist/components/index.d.ts

@@ -15,8 +15,10 @@ import RuiDateTimePicker, { type RuiDateTimePickerProps } from '../components/da
 import RuiTimezoneSelect, { type RuiTimezoneSelectProps } from '../components/date-time-picker/RuiTimezoneSelect.vue';
 import RuiDivider, { type Props as DividerProps } from '../components/divider/RuiDivider.vue';
 import RuiAutoComplete, { type AutoCompleteProps, type RuiAutoCompleteClassNames } from '../components/forms/auto-complete/RuiAutoComplete.vue';
+import RuiCategoryPicker, { type RuiCategoryPickerClassNames, type RuiCategoryPickerProps } from '../components/forms/category-picker/RuiCategoryPicker.vue';
 import RuiCheckboxGroup, { type Props as CheckboxGroupProps } from '../components/forms/checkbox/checkbox-group/RuiCheckboxGroup.vue';
 import RuiCheckbox, { type Props as CheckboxProps } from '../components/forms/checkbox/RuiCheckbox.vue';
+import RuiFileUpload, { type FileUploadProps } from '../components/forms/file-upload/RuiFileUpload.vue';
 import RuiRadioGroup, { type Props as RadioGroupProps } from '../components/forms/radio-button/radio-group/RuiRadioGroup.vue';
 import RuiRadio, { type RadioProps } from '../components/forms/radio-button/radio/RuiRadio.vue';
 import RuiRevealableTextField, { type Props as RevealableTextFieldProps } from '../components/forms/revealable-text-field/RuiRevealableTextField.vue';
@@ -47,5 +49,5 @@ import RuiTabItems from '../components/tabs/tab-items/RuiTabItems.vue';
 import RuiTab, { type RuiTabClassNames, type Props as TabProps } from '../components/tabs/tab/RuiTab.vue';
 import RuiTabs, { type Props as TabsProps } from '../components/tabs/tabs/RuiTabs.vue';
 import RuiTimePicker, { type RuiTimePickerProps } from '../components/time-picker/RuiTimePicker.vue';
-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, FooterStepperProps, GroupData, IconProps, LogoProps, MenuProps, MenuSelectProps, NavigationDrawerProps, NotificationProps, ProgressProps, RadioGroupProps, RadioProps, RevealableTextFieldProps, RuiAccordionClassNames, RuiAutoCompleteClassNames, RuiCardClassNames, RuiChipClassNames, RuiDateTimePickerProps, RuiDialogClassNames, RuiMenuClassNames, RuiMenuSelectClassNames, RuiNavigationDrawerClassNames, RuiSliderClassNames, RuiStepperClassNames, RuiTabClassNames, RuiTimePickerProps, RuiTimezoneSelectProps, RuiTooltipClassNames, SimpleSelectProps, SkeletonLoaderProps, SliderProps, StepperProps, SwitchProps, TabItemProps, TablePaginationData, TablePaginationProps, TabProps, TabsProps, TextAreaProps, TextFieldProps, TooltipProps, };
-export { RuiAccordion, RuiAccordions, RuiAlert, RuiAutoComplete, RuiAvatar, RuiAvatarGroup, RuiBadge, RuiBottomSheet, RuiButton, RuiButtonGroup, RuiCalendar, RuiCard, RuiCardHeader, RuiCheckbox, RuiCheckboxGroup, RuiChip, RuiColorPicker, RuiDataTable, RuiDateTimePicker, RuiDialog, RuiDivider, RuiFooterStepper, RuiIcon, RuiLogo, RuiMenu, RuiMenuSelect, RuiNavigationDrawer, RuiNotification, RuiProgress, RuiRadio, RuiRadioGroup, RuiRevealableTextField, RuiSimpleSelect, RuiSkeletonLoader, RuiSlider, RuiStepper, RuiSwitch, RuiTab, RuiTabItem, RuiTabItems, RuiTablePagination, RuiTableRowExpander, RuiTabs, RuiTextArea, RuiTextField, RuiTimePicker, RuiTimezoneSelect, RuiTooltip, };
+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, FileUploadProps, FooterStepperProps, GroupData, IconProps, LogoProps, MenuProps, MenuSelectProps, NavigationDrawerProps, NotificationProps, ProgressProps, RadioGroupProps, RadioProps, RevealableTextFieldProps, RuiAccordionClassNames, RuiAutoCompleteClassNames, RuiCardClassNames, RuiCategoryPickerClassNames, RuiCategoryPickerProps, RuiChipClassNames, RuiDateTimePickerProps, RuiDialogClassNames, RuiMenuClassNames, RuiMenuSelectClassNames, RuiNavigationDrawerClassNames, RuiSliderClassNames, RuiStepperClassNames, RuiTabClassNames, RuiTimePickerProps, RuiTimezoneSelectProps, RuiTooltipClassNames, SimpleSelectProps, SkeletonLoaderProps, SliderProps, StepperProps, SwitchProps, TabItemProps, TablePaginationData, TablePaginationProps, 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, RuiFileUpload, RuiFooterStepper, RuiIcon, RuiLogo, RuiMenu, RuiMenuSelect, RuiNavigationDrawer, RuiNotification, RuiProgress, RuiRadio, RuiRadioGroup, RuiRevealableTextField, RuiSimpleSelect, RuiSkeletonLoader, RuiSlider, RuiStepper, RuiSwitch, RuiTab, RuiTabItem, RuiTabItems, RuiTablePagination, RuiTableRowExpander, RuiTabs, RuiTextArea, RuiTextField, RuiTimePicker, RuiTimezoneSelect, RuiTooltip, };

package/dist/components/index.js

@@ -20,8 +20,11 @@ import RuiTimezoneSelect_default from "./date-time-picker/RuiTimezoneSelect.js";
 import RuiTimePicker_default from "./time-picker/RuiTimePicker.js";
 import RuiDateTimePicker_default from "./date-time-picker/RuiDateTimePicker.js";
 import RuiDivider_default from "./divider/RuiDivider.js";
+import RuiDialog_default from "./overlays/dialog/RuiDialog.js";
+import RuiCategoryPicker_default from "./forms/category-picker/RuiCategoryPicker.js";
 import RuiCheckboxGroup_default from "./forms/checkbox/checkbox-group/RuiCheckboxGroup.js";
 import RuiCheckbox_default from "./forms/checkbox/RuiCheckbox.js";
+import RuiFileUpload_default from "./forms/file-upload/RuiFileUpload.js";
 import RuiRadioGroup_default from "./forms/radio-button/radio-group/RuiRadioGroup.js";
 import RuiRadio_default from "./forms/radio-button/radio/RuiRadio.js";
 import RuiRevealableTextField_default from "./forms/revealable-text-field/RuiRevealableTextField.js";
@@ -33,7 +36,6 @@ import RuiTextArea_default from "./forms/text-area/RuiTextArea.js";
 import RuiSkeletonLoader_default from "./loaders/RuiSkeletonLoader.js";
 import RuiLogo_default from "./logos/RuiLogo.js";
 import RuiBadge_default from "./overlays/badge/RuiBadge.js";
-import RuiDialog_default from "./overlays/dialog/RuiDialog.js";
 import RuiBottomSheet_default from "./overlays/bottom-sheet/RuiBottomSheet.js";
 import RuiNavigationDrawer_default from "./overlays/navigation-drawer/RuiNavigationDrawer.js";
 import RuiNotification_default from "./overlays/notification/RuiNotification.js";
@@ -46,4 +48,4 @@ import RuiTabItem_default from "./tabs/tab-item/RuiTabItem.js";
 import RuiTabItems_default from "./tabs/tab-items/RuiTabItems.js";
 import RuiTab_default from "./tabs/tab/RuiTab.js";
 import RuiTabs_default from "./tabs/tabs/RuiTabs.js";
-export { RuiAccordion_default as RuiAccordion, RuiAccordions_default as RuiAccordions, RuiAlert_default as RuiAlert, RuiAutoComplete_default as RuiAutoComplete, RuiAvatar_default as RuiAvatar, RuiAvatarGroup_default as RuiAvatarGroup, RuiBadge_default as RuiBadge, RuiBottomSheet_default as RuiBottomSheet, RuiButton_default as RuiButton, RuiButtonGroup_default as RuiButtonGroup, RuiCalendar_default as RuiCalendar, RuiCard_default as RuiCard, RuiCardHeader_default as RuiCardHeader, RuiCheckbox_default as RuiCheckbox, RuiCheckboxGroup_default as RuiCheckboxGroup, RuiChip_default as RuiChip, RuiColorPicker_default as RuiColorPicker, RuiDataTable_default as RuiDataTable, RuiDateTimePicker_default as RuiDateTimePicker, RuiDialog_default as RuiDialog, RuiDivider_default as RuiDivider, RuiFooterStepper_default as RuiFooterStepper, RuiIcon_default as RuiIcon, RuiLogo_default as RuiLogo, RuiMenu_default as RuiMenu, RuiMenuSelect_default as RuiMenuSelect, RuiNavigationDrawer_default as RuiNavigationDrawer, RuiNotification_default as RuiNotification, RuiProgress_default as RuiProgress, RuiRadio_default as RuiRadio, RuiRadioGroup_default as RuiRadioGroup, RuiRevealableTextField_default as RuiRevealableTextField, RuiSimpleSelect_default as RuiSimpleSelect, RuiSkeletonLoader_default as RuiSkeletonLoader, RuiSlider_default as RuiSlider, RuiStepper_default as RuiStepper, RuiSwitch_default as RuiSwitch, RuiTab_default as RuiTab, RuiTabItem_default as RuiTabItem, RuiTabItems_default as RuiTabItems, RuiTablePagination_default as RuiTablePagination, RuiExpandButton_default as RuiTableRowExpander, RuiTabs_default as RuiTabs, RuiTextArea_default as RuiTextArea, RuiTextField_default as RuiTextField, RuiTimePicker_default as RuiTimePicker, RuiTimezoneSelect_default as RuiTimezoneSelect, RuiTooltip_default as RuiTooltip };
+export { RuiAccordion_default as RuiAccordion, RuiAccordions_default as RuiAccordions, RuiAlert_default as RuiAlert, RuiAutoComplete_default as RuiAutoComplete, RuiAvatar_default as RuiAvatar, RuiAvatarGroup_default as RuiAvatarGroup, RuiBadge_default as RuiBadge, RuiBottomSheet_default as RuiBottomSheet, RuiButton_default as RuiButton, RuiButtonGroup_default as RuiButtonGroup, RuiCalendar_default as RuiCalendar, RuiCard_default as RuiCard, RuiCardHeader_default as RuiCardHeader, RuiCategoryPicker_default as RuiCategoryPicker, RuiCheckbox_default as RuiCheckbox, RuiCheckboxGroup_default as RuiCheckboxGroup, RuiChip_default as RuiChip, RuiColorPicker_default as RuiColorPicker, RuiDataTable_default as RuiDataTable, RuiDateTimePicker_default as RuiDateTimePicker, RuiDialog_default as RuiDialog, RuiDivider_default as RuiDivider, RuiFileUpload_default as RuiFileUpload, RuiFooterStepper_default as RuiFooterStepper, RuiIcon_default as RuiIcon, RuiLogo_default as RuiLogo, RuiMenu_default as RuiMenu, RuiMenuSelect_default as RuiMenuSelect, RuiNavigationDrawer_default as RuiNavigationDrawer, RuiNotification_default as RuiNotification, RuiProgress_default as RuiProgress, RuiRadio_default as RuiRadio, RuiRadioGroup_default as RuiRadioGroup, RuiRevealableTextField_default as RuiRevealableTextField, RuiSimpleSelect_default as RuiSimpleSelect, RuiSkeletonLoader_default as RuiSkeletonLoader, RuiSlider_default as RuiSlider, RuiStepper_default as RuiStepper, RuiSwitch_default as RuiSwitch, RuiTab_default as RuiTab, RuiTabItem_default as RuiTabItem, RuiTabItems_default as RuiTabItems, RuiTablePagination_default as RuiTablePagination, RuiExpandButton_default as RuiTableRowExpander, RuiTabs_default as RuiTabs, RuiTextArea_default as RuiTextArea, RuiTextField_default as RuiTextField, RuiTimePicker_default as RuiTimePicker, RuiTimezoneSelect_default as RuiTimezoneSelect, RuiTooltip_default as RuiTooltip };

package/dist/components/loaders/RuiSkeletonBase.vue_vue_type_script_setup_true_lang.js

@@ -1,7 +1,7 @@
 import { tv } from "../../utils/tv.js";
 import { computed, createElementBlock, defineComponent, normalizeClass, openBlock, unref } from "vue";
 //#region src/components/loaders/RuiSkeletonBase.vue?vue&type=script&setup=true&lang.ts
-var RuiSkeletonBase_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var RuiSkeletonBase_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "RuiSkeletonLoaderBase",
 	__name: "RuiSkeletonBase",
 	props: { rounded: {} },

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

@@ -1 +1 @@
-{"version":3,"file":"RuiSkeletonBase.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/loaders/RuiSkeletonBase.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { tv } from '@/utils/tv';\n\nexport interface Props {\n  rounded?: 'none' | 'sm' | 'md' | 'lg' | 'full';\n}\n\ndefineOptions({\n  name: 'RuiSkeletonLoaderBase',\n});\n\nconst { rounded } = defineProps<Props>();\n\nconst skeleton = tv({\n  base: 'animate-pulse bg-black/[.12] dark:bg-white/[.16]',\n  variants: {\n    rounded: {\n      none: 'rounded-none',\n      sm: 'rounded-sm',\n      md: 'rounded-md',\n      lg: 'rounded-lg',\n      full: 'rounded-full',\n    },\n  },\n});\n\nconst ui = computed<string>(() => skeleton({ rounded }));\n</script>\n\n<template>\n  <div\n    :class=\"ui\"\n    role=\"alert\"\n  />\n</template>\n"],"mappings":";;;;;;;;EAaA,MAAM,WAAW,GAAG;GAClB,MAAM;GACN,UAAU,EACR,SAAS;IACP,MAAM;IACN,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,MAAM;IACP,EAAA;GAEJ,CAAC;EAEF,MAAM,KAAK,eAAuB,SAAS,EAAE,SAAM,QAAA,SAAG,CAAC,CAAC;;uBAItD,mBAGE,OAAA;IAFC,OAAK,eAAE,MAAA,GAAE,CAAA;IACV,MAAK"}
+{"version":3,"file":"RuiSkeletonBase.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/loaders/RuiSkeletonBase.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { tv } from '@/utils/tv';\n\nexport interface Props {\n  rounded?: 'none' | 'sm' | 'md' | 'lg' | 'full';\n}\n\ndefineOptions({\n  name: 'RuiSkeletonLoaderBase',\n});\n\nconst { rounded } = defineProps<Props>();\n\nconst skeleton = tv({\n  base: 'animate-pulse bg-black/[.12] dark:bg-white/[.16]',\n  variants: {\n    rounded: {\n      none: 'rounded-none',\n      sm: 'rounded-sm',\n      md: 'rounded-md',\n      lg: 'rounded-lg',\n      full: 'rounded-full',\n    },\n  },\n});\n\nconst ui = computed<string>(() => skeleton({ rounded }));\n</script>\n\n<template>\n  <div\n    :class=\"ui\"\n    role=\"alert\"\n  />\n</template>\n"],"mappings":";;;;;;;;EAaA,MAAM,WAAW,GAAG;GAClB,MAAM;GACN,UAAU,EACR,SAAS;IACP,MAAM;IACN,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,MAAM;GACR,EACF;EACF,CAAC;EAED,MAAM,KAAK,eAAuB,SAAS,EAAE,SAAM,QAAA,QAAE,CAAC,CAAC;;uBAIrD,mBAGE,OAAA;IAFC,OAAK,eAAE,MAAA,EAAA,CAAE;IACV,MAAK"}

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

@@ -3,7 +3,7 @@ import RuiSkeletonBase_default from "./RuiSkeletonBase.js";
 import { SkeletonType } from "./skeleton-type.js";
 import { computed, createBlock, createCommentVNode, createElementBlock, createVNode, defineComponent, mergeProps, openBlock, unref, useAttrs } from "vue";
 //#region src/components/loaders/RuiSkeletonLoader.vue?vue&type=script&setup=true&lang.ts
-var RuiSkeletonLoader_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var RuiSkeletonLoader_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "RuiSkeletonLoader",
 	inheritAttrs: false,
 	__name: "RuiSkeletonLoader",

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":[],"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, tv } from '@/utils/tv';\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 skeletonType = tv({\n  variants: {\n    type: {\n      [SkeletonType.CUSTOM]: 'box-border',\n      [SkeletonType.TEXT]: 'w-full h-4 rounded-md',\n      [SkeletonType.HEADING]: 'w-full h-6 rounded-md',\n      [SkeletonType.BUTTON]: 'w-full max-w-[6rem] h-[2.25rem] rounded-md',\n      [SkeletonType.ICON]: 'w-6 h-6 rounded-full',\n      [SkeletonType.AVATAR]: 'w-10 h-10 rounded-full',\n      [SkeletonType.THUMBNAIL]: 'w-14 h-14 rounded-sm',\n      [SkeletonType.PARAGRAPH]: 'flex flex-col gap-2',\n      [SkeletonType.ARTICLE]: 'flex flex-col gap-2',\n    },\n  },\n});\n\nconst attrs = useAttrs();\nconst ui = computed<string>(() => skeletonType({ 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-md mb-1\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-md\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-md max-w-[80%]\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-md max-w-[90%]\"\n      :rounded=\"rounded\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAkBA,MAAM,iBAAiC,CAAC,aAAa,WAAW,aAAa,QAAQ;EAErF,MAAM,eAAe,GAAG,EACtB,UAAU,EACR,MAAM;IACH,aAAa,SAAS;IACtB,aAAa,OAAO;IACpB,aAAa,UAAU;IACvB,aAAa,SAAS;IACtB,aAAa,OAAO;IACpB,aAAa,SAAS;IACtB,aAAa,YAAY;IACzB,aAAa,YAAY;IACzB,aAAa,UAAU;GACzB,EACF,EACF,CAAC;EAEF,MAAM,QAAQ,UAAU;EACxB,MAAM,KAAK,eAAuB,aAAa;GAAE,MAAG,QAAA;GAAG,OAAO,GAAG,MAAM,MAAA;GAAQ,CAAC,CAAC;EACjF,MAAM,cAAc,eAAwB,eAAe,SAAS,QAAA,KAAK,CAAC;;WAK/D,MAAA,YAAW,IAAA,WAAA,EADpB,YAKE,yBALF,WAKE;;IAHC,OAAO,MAAA,GAAE;IACT,SAAS,QAAA;;OACG,MAAA,MAAK;IAAA,OAAS,KAAA;IAAS,CAAA,EAAA,MAAA,IAAA,CAAA,SAAA,UAAA,CAAA,KAAA,WAAA,EAEtC,mBAsBM,OAtBN,WAsBM;;IApBH,OAAO,MAAA,GAAA;;OACK,MAAA,MAAK;IAAA,OAAS,KAAA;IAAS,CAAA,EAAA;IAG5B,QAAA,SAAS,MAAA,aAAY,CAAC,WAAA,WAAA,EAD9B,YAIE,yBAAA;;KAFA,OAAM;KACL,SAAS,QAAA;;IAEZ,YAGE,yBAAA;KAFA,OAAM;KACL,SAAS,QAAA;;IAEZ,YAGE,yBAAA;KAFA,OAAM;KACL,SAAS,QAAA;;IAEZ,YAGE,yBAAA;KAFA,OAAM;KACL,SAAS,QAAA"}
+{"version":3,"file":"RuiSkeletonLoader.vue_vue_type_script_setup_true_lang.js","names":[],"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, tv } from '@/utils/tv';\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 skeletonType = tv({\n  variants: {\n    type: {\n      [SkeletonType.CUSTOM]: 'box-border',\n      [SkeletonType.TEXT]: 'w-full h-4 rounded-md',\n      [SkeletonType.HEADING]: 'w-full h-6 rounded-md',\n      [SkeletonType.BUTTON]: 'w-full max-w-[6rem] h-[2.25rem] rounded-md',\n      [SkeletonType.ICON]: 'w-6 h-6 rounded-full',\n      [SkeletonType.AVATAR]: 'w-10 h-10 rounded-full',\n      [SkeletonType.THUMBNAIL]: 'w-14 h-14 rounded-sm',\n      [SkeletonType.PARAGRAPH]: 'flex flex-col gap-2',\n      [SkeletonType.ARTICLE]: 'flex flex-col gap-2',\n    },\n  },\n});\n\nconst attrs = useAttrs();\nconst ui = computed<string>(() => skeletonType({ 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-md mb-1\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-md\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-md max-w-[80%]\"\n      :rounded=\"rounded\"\n    />\n    <RuiSkeletonBase\n      class=\"w-full h-3 rounded-md max-w-[90%]\"\n      :rounded=\"rounded\"\n    />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAkBA,MAAM,iBAAiC,CAAC,aAAa,WAAW,aAAa,OAAO;EAEpF,MAAM,eAAe,GAAG,EACtB,UAAU,EACR,MAAM;IACH,aAAa,SAAS;IACtB,aAAa,OAAO;IACpB,aAAa,UAAU;IACvB,aAAa,SAAS;IACtB,aAAa,OAAO;IACpB,aAAa,SAAS;IACtB,aAAa,YAAY;IACzB,aAAa,YAAY;IACzB,aAAa,UAAU;EAC1B,EACF,EACF,CAAC;EAED,MAAM,QAAQ,SAAS;EACvB,MAAM,KAAK,eAAuB,aAAa;GAAE,MAAG,QAAA;GAAG,OAAO,GAAG,MAAM,KAAK;EAAE,CAAC,CAAC;EAChF,MAAM,cAAc,eAAwB,eAAe,SAAS,QAAA,IAAI,CAAC;;WAK9D,MAAA,WAAA,KAAA,UAAA,GADT,YAKE,yBALF,WAKE;;IAHC,OAAO,MAAA,EAAA;IACP,SAAS,QAAA;;OACG,MAAA,KAAA;IAAK,OAAS,KAAA;GAAS,CAAA,GAAA,MAAA,IAAA,CAAA,SAAA,SAAA,CAAA,MAAA,UAAA,GAEtC,mBAsBM,OAtBN,WAsBM;;IApBH,OAAO,MAAA,EAAA;;OACK,MAAA,KAAA;IAAK,OAAS,KAAA;GAAS,CAAA,GAAA;IAG5B,QAAA,SAAS,MAAA,YAAA,CAAY,CAAC,WAAA,UAAA,GAD9B,YAIE,yBAAA;;KAFA,OAAM;KACL,SAAS,QAAA;;IAEZ,YAGE,yBAAA;KAFA,OAAM;KACL,SAAS,QAAA;;IAEZ,YAGE,yBAAA;KAFA,OAAM;KACL,SAAS,QAAA;;IAEZ,YAGE,yBAAA;KAFA,OAAM;KACL,SAAS,QAAA"}

package/dist/components/loaders/skeleton-type.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton-type.js","names":[],"sources":["../../../src/components/loaders/skeleton-type.ts"],"sourcesContent":["export const SkeletonType = {\n  TEXT: 'text',\n  PARAGRAPH: 'paragraph',\n  HEADING: 'heading',\n  ARTICLE: 'article',\n  BUTTON: 'button',\n  ICON: 'icon',\n  AVATAR: 'avatar',\n  THUMBNAIL: 'thumbnail',\n  CUSTOM: 'custom',\n} as const;\n\nexport type SkeletonType = (typeof SkeletonType)[keyof typeof SkeletonType];\n"],"mappings":";AAAA,IAAa,eAAe;CAC1B,MAAM;CACN,WAAW;CACX,SAAS;CACT,SAAS;CACT,QAAQ;CACR,MAAM;CACN,QAAQ;CACR,WAAW;CACX,QAAQ;CACT"}
+{"version":3,"file":"skeleton-type.js","names":[],"sources":["../../../src/components/loaders/skeleton-type.ts"],"sourcesContent":["export const SkeletonType = {\n  TEXT: 'text',\n  PARAGRAPH: 'paragraph',\n  HEADING: 'heading',\n  ARTICLE: 'article',\n  BUTTON: 'button',\n  ICON: 'icon',\n  AVATAR: 'avatar',\n  THUMBNAIL: 'thumbnail',\n  CUSTOM: 'custom',\n} as const;\n\nexport type SkeletonType = (typeof SkeletonType)[keyof typeof SkeletonType];\n"],"mappings":";AAAA,IAAa,eAAe;CAC1B,MAAM;CACN,WAAW;CACX,SAAS;CACT,SAAS;CACT,QAAQ;CACR,MAAM;CACN,QAAQ;CACR,WAAW;CACX,QAAQ;AACV"}

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

@@ -10,7 +10,7 @@ var _hoisted_3 = {
 	class: "text-h4 text-rui-primary dark:text-white"
 };
 var appName = "rotki";
-var RuiLogo_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var RuiLogo_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "RuiLogo",
 	__name: "RuiLogo",
 	props: {

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":[],"sources":["../../../src/components/logos/RuiLogo.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { isClient } from '@vueuse/shared';\nimport { useSSRContext } from 'vue';\nimport fallback from '@/components/logos/logo.svg';\nimport { getCachedLogoSources, getLogoSources, getVerifiedLogoUrl, removeVerifiedLogoUrl, setVerifiedLogoUrl } from '@/components/logos/use-logo-sources';\n\nexport interface ExternalLinks {\n  drawer?: string;\n  app?: string;\n  website?: string;\n  about?: string;\n  emptyScreen?: string;\n  [key: string]: string | undefined;\n}\n\nexport interface Props {\n  text?: boolean;\n  branch?: 'develop' | 'main' | string;\n  logo?: keyof ExternalLinks;\n  size?: string | number; // in rems\n  uniqueKey?: string | number;\n  src?: string;\n}\n\ndefineOptions({\n  name: 'RuiLogo',\n});\n\nconst { text = false, branch = 'develop', logo, size = 3, uniqueKey, src } = defineProps<Props>();\n\nconst appName = 'rotki';\nconst emptyLinks: () => ExternalLinks = () => ({\n  app: undefined,\n  website: undefined,\n  about: undefined,\n  emptyScreen: undefined,\n});\n\nconst error = ref<boolean>(false);\nconst seasonalReady = ref<boolean>(false);\nconst externalSources = ref<ExternalLinks>(emptyLinks());\n\nconst customImageRef = useTemplateRef<HTMLImageElement>('customImageRef');\n\n// Synchronously hydrate from sessionStorage so the URL is available immediately on refresh\nif (isClient && logo && !src) {\n  const cached = getCachedLogoSources(branch);\n  if (cached)\n    set(externalSources, cached);\n}\n\nfunction buildExternalUrl(sources: ExternalLinks): string | undefined {\n  if (!logo || !sources[logo])\n    return undefined;\n\n  const url = `https://raw.githubusercontent.com/rotki/data/${branch}/assets/icons/${sources[logo]}`;\n\n  if (uniqueKey !== undefined)\n    return `${url}?key=${uniqueKey}`;\n\n  return url;\n}\n\nconst externalSource = computed<string | undefined>(() => {\n  if (src)\n    return src;\n\n  return buildExternalUrl(get(externalSources));\n});\n\nconst showCustom = computed<boolean>(() => !!src || (!!get(externalSource) && get(seasonalReady) && !get(error)));\n\n// If we have a previously verified URL that matches the current source, trust it immediately\nif (isClient && logo && !src) {\n  const verifiedUrl = getVerifiedLogoUrl(branch, String(logo));\n  const currentUrl = get(externalSource);\n  if (verifiedUrl && currentUrl && verifiedUrl === currentUrl)\n    set(seasonalReady, true);\n}\n\nfunction preloadImage(url: string): void {\n  if (!isClient)\n    return;\n\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\n// Inject a preload hint for the seasonal image so the browser starts fetching early\nif (isClient && logo && !src) {\n  const url = get(externalSource);\n  if (url)\n    preloadImage(url);\n}\n\nasync function fetchSources(): Promise<void> {\n  if (!logo || src)\n    return;\n\n  const links = await getLogoSources(branch);\n\n  if (links)\n    set(externalSources, links);\n}\n\nfunction onImageError(): void {\n  set(error, true);\n  if (logo)\n    removeVerifiedLogoUrl(branch, String(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      // Cache the verified URL so subsequent page loads can trust it immediately\n      const url = get(externalSource);\n      if (url && logo)\n        setVerifiedLogoUrl(branch, String(logo), url);\n    })\n    .catch(() => set(error, true));\n}\n\nwatch(() => get(customImageRef)?.complete, (complete) => {\n  if (complete)\n    onImageLoaded();\n});\n\nwatchEffect(fetchSources);\n\nif (!isClient)\n  useSSRContext();\n\nonServerPrefetch(async () => {\n  await fetchSources();\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-white\"\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":[],"sources":["../../../src/components/logos/RuiLogo.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { isClient } from '@vueuse/shared';\nimport { useSSRContext } from 'vue';\nimport fallback from '@/components/logos/logo.svg';\nimport { getCachedLogoSources, getLogoSources, getVerifiedLogoUrl, removeVerifiedLogoUrl, setVerifiedLogoUrl } from '@/components/logos/use-logo-sources';\n\nexport interface ExternalLinks {\n  drawer?: string;\n  app?: string;\n  website?: string;\n  about?: string;\n  emptyScreen?: string;\n  [key: string]: string | undefined;\n}\n\nexport interface Props {\n  text?: boolean;\n  branch?: 'develop' | 'main' | string;\n  logo?: keyof ExternalLinks;\n  size?: string | number; // in rems\n  uniqueKey?: string | number;\n  src?: string;\n}\n\ndefineOptions({\n  name: 'RuiLogo',\n});\n\nconst { text = false, branch = 'develop', logo, size = 3, uniqueKey, src } = defineProps<Props>();\n\nconst appName = 'rotki';\nconst emptyLinks: () => ExternalLinks = () => ({\n  app: undefined,\n  website: undefined,\n  about: undefined,\n  emptyScreen: undefined,\n});\n\nconst error = ref<boolean>(false);\nconst seasonalReady = ref<boolean>(false);\nconst externalSources = ref<ExternalLinks>(emptyLinks());\n\nconst customImageRef = useTemplateRef<HTMLImageElement>('customImageRef');\n\n// Synchronously hydrate from sessionStorage so the URL is available immediately on refresh\nif (isClient && logo && !src) {\n  const cached = getCachedLogoSources(branch);\n  if (cached)\n    set(externalSources, cached);\n}\n\nfunction buildExternalUrl(sources: ExternalLinks): string | undefined {\n  if (!logo || !sources[logo])\n    return undefined;\n\n  const url = `https://raw.githubusercontent.com/rotki/data/${branch}/assets/icons/${sources[logo]}`;\n\n  if (uniqueKey !== undefined)\n    return `${url}?key=${uniqueKey}`;\n\n  return url;\n}\n\nconst externalSource = computed<string | undefined>(() => {\n  if (src)\n    return src;\n\n  return buildExternalUrl(get(externalSources));\n});\n\nconst showCustom = computed<boolean>(() => !!src || (!!get(externalSource) && get(seasonalReady) && !get(error)));\n\n// If we have a previously verified URL that matches the current source, trust it immediately\nif (isClient && logo && !src) {\n  const verifiedUrl = getVerifiedLogoUrl(branch, String(logo));\n  const currentUrl = get(externalSource);\n  if (verifiedUrl && currentUrl && verifiedUrl === currentUrl)\n    set(seasonalReady, true);\n}\n\nfunction preloadImage(url: string): void {\n  if (!isClient)\n    return;\n\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\n// Inject a preload hint for the seasonal image so the browser starts fetching early\nif (isClient && logo && !src) {\n  const url = get(externalSource);\n  if (url)\n    preloadImage(url);\n}\n\nasync function fetchSources(): Promise<void> {\n  if (!logo || src)\n    return;\n\n  const links = await getLogoSources(branch);\n\n  if (links)\n    set(externalSources, links);\n}\n\nfunction onImageError(): void {\n  set(error, true);\n  if (logo)\n    removeVerifiedLogoUrl(branch, String(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      // Cache the verified URL so subsequent page loads can trust it immediately\n      const url = get(externalSource);\n      if (url && logo)\n        setVerifiedLogoUrl(branch, String(logo), url);\n    })\n    .catch(() => set(error, true));\n}\n\nwatch(() => get(customImageRef)?.complete, (complete) => {\n  if (complete)\n    onImageLoaded();\n});\n\nwatchEffect(fetchSources);\n\nif (!isClient)\n  useSSRContext();\n\nonServerPrefetch(async () => {\n  await fetchSources();\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-white\"\n    >\n      {{ appName }}\n    </div>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/logos/use-logo-sources.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-logo-sources.js","names":[],"sources":["../../../src/components/logos/use-logo-sources.ts"],"sourcesContent":["import type { ExternalLinks } from '@/components/logos/RuiLogo.vue';\nimport { transformCase } from '@/utils/helpers';\n\nconst ASSET_MAPPINGS_URL = 'https://raw.githubusercontent.com/rotki/data';\nconst SESSION_SOURCES_PREFIX = 'rui-logo-sources';\nconst SESSION_VERIFIED_PREFIX = 'rui-logo-verified';\n\n// Module-level cache: deduplicates asset-mappings fetches across all RuiLogo instances.\n// Keyed by branch so different branches don't share stale data.\nconst sourcesCache = new Map<string, Promise<ExternalLinks | undefined>>();\n\nfunction isExternalLinks(value: unknown): value is ExternalLinks {\n  if (typeof value !== 'object' || value === null)\n    return false;\n\n  return Object.values(value).every(v => v === undefined || typeof v === 'string');\n}\n\nfunction writeSessionStorage(key: string, value: string): void {\n  try {\n    sessionStorage.setItem(key, value);\n  }\n  catch {\n    // sessionStorage may be full or unavailable\n  }\n}\n\nfunction readSessionStorage(key: string): string | undefined {\n  try {\n    return sessionStorage.getItem(key) ?? undefined;\n  }\n  catch {\n    return undefined;\n  }\n}\n\nfunction clearSessionStorage(prefix: string): void {\n  try {\n    const keysToRemove: string[] = [];\n    for (let i = 0; i < sessionStorage.length; i++) {\n      const key = sessionStorage.key(i);\n      if (key?.startsWith(prefix))\n        keysToRemove.push(key);\n    }\n    keysToRemove.forEach(key => sessionStorage.removeItem(key));\n  }\n  catch {\n    // sessionStorage may be unavailable\n  }\n}\n\n/**\n * Returns cached logo sources synchronously from sessionStorage.\n * Returns undefined if nothing is cached or sessionStorage is unavailable.\n */\nexport function getCachedLogoSources(branch: string): ExternalLinks | undefined {\n  const raw = readSessionStorage(`${SESSION_SOURCES_PREFIX}:${branch}`);\n  if (!raw)\n    return undefined;\n\n  try {\n    const parsed: unknown = JSON.parse(raw);\n    if (isExternalLinks(parsed))\n      return parsed;\n  }\n  catch {\n    // Invalid JSON, ignore\n  }\n  return undefined;\n}\n\n/**\n * Returns a previously verified (successfully decoded) seasonal logo URL\n * for the given branch and logo type from sessionStorage.\n */\nexport function getVerifiedLogoUrl(branch: string, logo: string): string | undefined {\n  return readSessionStorage(`${SESSION_VERIFIED_PREFIX}:${branch}:${logo}`);\n}\n\n/**\n * Stores a verified seasonal logo URL in sessionStorage after successful decode.\n */\nexport function setVerifiedLogoUrl(branch: string, logo: string, url: string): void {\n  writeSessionStorage(`${SESSION_VERIFIED_PREFIX}:${branch}:${logo}`, url);\n}\n\n/**\n * Removes a previously verified seasonal logo URL from sessionStorage.\n * Called when an image fails to load so stale entries aren't trusted on next load.\n */\nexport function removeVerifiedLogoUrl(branch: string, logo: string): void {\n  try {\n    sessionStorage.removeItem(`${SESSION_VERIFIED_PREFIX}:${branch}:${logo}`);\n  }\n  catch {\n    // sessionStorage may be unavailable\n  }\n}\n\nasync function fetchSourcesFromNetwork(branch: string): Promise<ExternalLinks | undefined> {\n  try {\n    const response = await fetch(\n      `${ASSET_MAPPINGS_URL}/${branch}/constants/asset-mappings.json`,\n    );\n\n    if (!response.ok)\n      return undefined;\n\n    const json = await response.json();\n    const links = transformCase(json?.logo, 'camelCase');\n    if (isExternalLinks(links)) {\n      writeSessionStorage(`${SESSION_SOURCES_PREFIX}:${branch}`, JSON.stringify(links));\n      return links;\n    }\n\n    return undefined;\n  }\n  catch {\n    return undefined;\n  }\n}\n\n/**\n * Fetches external logo sources for a given branch, deduplicating concurrent requests.\n * Uses a module-level cache so all RuiLogo instances share a single fetch per branch.\n */\nexport function getLogoSources(branch: string): Promise<ExternalLinks | undefined> {\n  const cached = sourcesCache.get(branch);\n  if (cached)\n    return cached;\n\n  const promise = fetchSourcesFromNetwork(branch);\n  sourcesCache.set(branch, promise);\n  return promise;\n}\n\n/**\n * Clears the module-level cache and sessionStorage entries. Exposed for testing only.\n */\nexport function clearLogoSourcesCache(): void {\n  sourcesCache.clear();\n  clearSessionStorage(SESSION_SOURCES_PREFIX);\n  clearSessionStorage(SESSION_VERIFIED_PREFIX);\n}\n"],"mappings":";;AAGA,IAAM,qBAAqB;AAC3B,IAAM,yBAAyB;AAC/B,IAAM,0BAA0B;AAIhC,IAAM,+BAAe,IAAI,KAAiD;AAE1E,SAAS,gBAAgB,OAAwC;AAC/D,KAAI,OAAO,UAAU,YAAY,UAAU,KACzC,QAAO;AAET,QAAO,OAAO,OAAO,MAAM,CAAC,OAAM,MAAK,MAAM,KAAA,KAAa,OAAO,MAAM,SAAS;;AAGlF,SAAS,oBAAoB,KAAa,OAAqB;AAC7D,KAAI;AACF,iBAAe,QAAQ,KAAK,MAAM;SAE9B;;AAKR,SAAS,mBAAmB,KAAiC;AAC3D,KAAI;AACF,SAAO,eAAe,QAAQ,IAAI,IAAI,KAAA;SAElC;AACJ;;;;;;;AAuBJ,SAAgB,qBAAqB,QAA2C;CAC9E,MAAM,MAAM,mBAAmB,GAAG,uBAAuB,GAAG,SAAS;AACrE,KAAI,CAAC,IACH,QAAO,KAAA;AAET,KAAI;EACF,MAAM,SAAkB,KAAK,MAAM,IAAI;AACvC,MAAI,gBAAgB,OAAO,CACzB,QAAO;SAEL;;;;;;AAUR,SAAgB,mBAAmB,QAAgB,MAAkC;AACnF,QAAO,mBAAmB,GAAG,wBAAwB,GAAG,OAAO,GAAG,OAAO;;;;;AAM3E,SAAgB,mBAAmB,QAAgB,MAAc,KAAmB;AAClF,qBAAoB,GAAG,wBAAwB,GAAG,OAAO,GAAG,QAAQ,IAAI;;;;;;AAO1E,SAAgB,sBAAsB,QAAgB,MAAoB;AACxE,KAAI;AACF,iBAAe,WAAW,GAAG,wBAAwB,GAAG,OAAO,GAAG,OAAO;SAErE;;AAKR,eAAe,wBAAwB,QAAoD;AACzF,KAAI;EACF,MAAM,WAAW,MAAM,MACrB,GAAG,mBAAmB,GAAG,OAAO,gCACjC;AAED,MAAI,CAAC,SAAS,GACZ,QAAO,KAAA;EAGT,MAAM,QAAQ,eADD,MAAM,SAAS,MAAM,GACA,MAAM,YAAY;AACpD,MAAI,gBAAgB,MAAM,EAAE;AAC1B,uBAAoB,GAAG,uBAAuB,GAAG,UAAU,KAAK,UAAU,MAAM,CAAC;AACjF,UAAO;;AAGT;SAEI;AACJ;;;;;;;AAQJ,SAAgB,eAAe,QAAoD;CACjF,MAAM,SAAS,aAAa,IAAI,OAAO;AACvC,KAAI,OACF,QAAO;CAET,MAAM,UAAU,wBAAwB,OAAO;AAC/C,cAAa,IAAI,QAAQ,QAAQ;AACjC,QAAO"}
+{"version":3,"file":"use-logo-sources.js","names":[],"sources":["../../../src/components/logos/use-logo-sources.ts"],"sourcesContent":["import type { ExternalLinks } from '@/components/logos/RuiLogo.vue';\nimport { transformCase } from '@/utils/helpers';\n\nconst ASSET_MAPPINGS_URL = 'https://raw.githubusercontent.com/rotki/data';\nconst SESSION_SOURCES_PREFIX = 'rui-logo-sources';\nconst SESSION_VERIFIED_PREFIX = 'rui-logo-verified';\n\n// Module-level cache: deduplicates asset-mappings fetches across all RuiLogo instances.\n// Keyed by branch so different branches don't share stale data.\nconst sourcesCache = new Map<string, Promise<ExternalLinks | undefined>>();\n\nfunction isExternalLinks(value: unknown): value is ExternalLinks {\n  if (typeof value !== 'object' || value === null)\n    return false;\n\n  return Object.values(value).every(v => v === undefined || typeof v === 'string');\n}\n\nfunction writeSessionStorage(key: string, value: string): void {\n  try {\n    sessionStorage.setItem(key, value);\n  }\n  catch {\n    // sessionStorage may be full or unavailable\n  }\n}\n\nfunction readSessionStorage(key: string): string | undefined {\n  try {\n    return sessionStorage.getItem(key) ?? undefined;\n  }\n  catch {\n    return undefined;\n  }\n}\n\nfunction clearSessionStorage(prefix: string): void {\n  try {\n    const keysToRemove: string[] = [];\n    for (let i = 0; i < sessionStorage.length; i++) {\n      const key = sessionStorage.key(i);\n      if (key?.startsWith(prefix))\n        keysToRemove.push(key);\n    }\n    keysToRemove.forEach(key => sessionStorage.removeItem(key));\n  }\n  catch {\n    // sessionStorage may be unavailable\n  }\n}\n\n/**\n * Returns cached logo sources synchronously from sessionStorage.\n * Returns undefined if nothing is cached or sessionStorage is unavailable.\n */\nexport function getCachedLogoSources(branch: string): ExternalLinks | undefined {\n  const raw = readSessionStorage(`${SESSION_SOURCES_PREFIX}:${branch}`);\n  if (!raw)\n    return undefined;\n\n  try {\n    const parsed: unknown = JSON.parse(raw);\n    if (isExternalLinks(parsed))\n      return parsed;\n  }\n  catch {\n    // Invalid JSON, ignore\n  }\n  return undefined;\n}\n\n/**\n * Returns a previously verified (successfully decoded) seasonal logo URL\n * for the given branch and logo type from sessionStorage.\n */\nexport function getVerifiedLogoUrl(branch: string, logo: string): string | undefined {\n  return readSessionStorage(`${SESSION_VERIFIED_PREFIX}:${branch}:${logo}`);\n}\n\n/**\n * Stores a verified seasonal logo URL in sessionStorage after successful decode.\n */\nexport function setVerifiedLogoUrl(branch: string, logo: string, url: string): void {\n  writeSessionStorage(`${SESSION_VERIFIED_PREFIX}:${branch}:${logo}`, url);\n}\n\n/**\n * Removes a previously verified seasonal logo URL from sessionStorage.\n * Called when an image fails to load so stale entries aren't trusted on next load.\n */\nexport function removeVerifiedLogoUrl(branch: string, logo: string): void {\n  try {\n    sessionStorage.removeItem(`${SESSION_VERIFIED_PREFIX}:${branch}:${logo}`);\n  }\n  catch {\n    // sessionStorage may be unavailable\n  }\n}\n\nasync function fetchSourcesFromNetwork(branch: string): Promise<ExternalLinks | undefined> {\n  try {\n    const response = await fetch(\n      `${ASSET_MAPPINGS_URL}/${branch}/constants/asset-mappings.json`,\n    );\n\n    if (!response.ok)\n      return undefined;\n\n    const json = await response.json();\n    const links = transformCase(json?.logo, 'camelCase');\n    if (isExternalLinks(links)) {\n      writeSessionStorage(`${SESSION_SOURCES_PREFIX}:${branch}`, JSON.stringify(links));\n      return links;\n    }\n\n    return undefined;\n  }\n  catch {\n    return undefined;\n  }\n}\n\n/**\n * Fetches external logo sources for a given branch, deduplicating concurrent requests.\n * Uses a module-level cache so all RuiLogo instances share a single fetch per branch.\n */\nexport function getLogoSources(branch: string): Promise<ExternalLinks | undefined> {\n  const cached = sourcesCache.get(branch);\n  if (cached)\n    return cached;\n\n  const promise = fetchSourcesFromNetwork(branch);\n  sourcesCache.set(branch, promise);\n  return promise;\n}\n\n/**\n * Clears the module-level cache and sessionStorage entries. Exposed for testing only.\n */\nexport function clearLogoSourcesCache(): void {\n  sourcesCache.clear();\n  clearSessionStorage(SESSION_SOURCES_PREFIX);\n  clearSessionStorage(SESSION_VERIFIED_PREFIX);\n}\n"],"mappings":";;AAGA,IAAM,qBAAqB;AAC3B,IAAM,yBAAyB;AAC/B,IAAM,0BAA0B;AAIhC,IAAM,+BAAe,IAAI,IAAgD;AAEzE,SAAS,gBAAgB,OAAwC;CAC/D,IAAI,OAAO,UAAU,YAAY,UAAU,MACzC,OAAO;CAET,OAAO,OAAO,OAAO,KAAK,CAAC,CAAC,OAAM,MAAK,MAAM,KAAA,KAAa,OAAO,MAAM,QAAQ;AACjF;AAEA,SAAS,oBAAoB,KAAa,OAAqB;CAC7D,IAAI;EACF,eAAe,QAAQ,KAAK,KAAK;CACnC,QACM,CAEN;AACF;AAEA,SAAS,mBAAmB,KAAiC;CAC3D,IAAI;EACF,OAAO,eAAe,QAAQ,GAAG,KAAK,KAAA;CACxC,QACM;EACJ;CACF;AACF;;;;;AAqBA,SAAgB,qBAAqB,QAA2C;CAC9E,MAAM,MAAM,mBAAmB,GAAG,uBAAuB,GAAG,QAAQ;CACpE,IAAI,CAAC,KACH,OAAO,KAAA;CAET,IAAI;EACF,MAAM,SAAkB,KAAK,MAAM,GAAG;EACtC,IAAI,gBAAgB,MAAM,GACxB,OAAO;CACX,QACM,CAEN;AAEF;;;;;AAMA,SAAgB,mBAAmB,QAAgB,MAAkC;CACnF,OAAO,mBAAmB,GAAG,wBAAwB,GAAG,OAAO,GAAG,MAAM;AAC1E;;;;AAKA,SAAgB,mBAAmB,QAAgB,MAAc,KAAmB;CAClF,oBAAoB,GAAG,wBAAwB,GAAG,OAAO,GAAG,QAAQ,GAAG;AACzE;;;;;AAMA,SAAgB,sBAAsB,QAAgB,MAAoB;CACxE,IAAI;EACF,eAAe,WAAW,GAAG,wBAAwB,GAAG,OAAO,GAAG,MAAM;CAC1E,QACM,CAEN;AACF;AAEA,eAAe,wBAAwB,QAAoD;CACzF,IAAI;EACF,MAAM,WAAW,MAAM,MACrB,GAAG,mBAAmB,GAAG,OAAO,+BAClC;EAEA,IAAI,CAAC,SAAS,IACZ,OAAO,KAAA;EAGT,MAAM,QAAQ,eAAc,MADT,SAAS,KAAK,EAAA,EACC,MAAM,WAAW;EACnD,IAAI,gBAAgB,KAAK,GAAG;GAC1B,oBAAoB,GAAG,uBAAuB,GAAG,UAAU,KAAK,UAAU,KAAK,CAAC;GAChF,OAAO;EACT;EAEA;CACF,QACM;EACJ;CACF;AACF;;;;;AAMA,SAAgB,eAAe,QAAoD;CACjF,MAAM,SAAS,aAAa,IAAI,MAAM;CACtC,IAAI,QACF,OAAO;CAET,MAAM,UAAU,wBAAwB,MAAM;CAC9C,aAAa,IAAI,QAAQ,OAAO;CAChC,OAAO;AACT"}

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

@@ -9,7 +9,7 @@ var _hoisted_1 = [
 	"data-dot",
 	"data-left"
 ];
-var RuiBadge_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var RuiBadge_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "RuiBadge",
 	__name: "RuiBadge",
 	props: {

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":[],"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 { tv } from '@/utils/tv';\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 badgeStyles = tv({\n  slots: {\n    wrapper: 'relative inline-block',\n    badge: 'flex items-center justify-center text-xs font-medium absolute bg-transparent text-rui-light-text dark:text-rui-text',\n    content: 'flex items-center px-1.5',\n  },\n  variants: {\n    color: {\n      default: {},\n      primary: { badge: 'text-white bg-rui-primary' },\n      secondary: { badge: 'text-white bg-rui-secondary' },\n      error: { badge: 'text-white bg-rui-error' },\n      warning: { badge: 'text-white bg-rui-warning' },\n      info: { badge: 'text-white bg-rui-info' },\n      success: { badge: 'text-white bg-rui-success' },\n    },\n    size: {\n      sm: { badge: 'min-h-4 min-w-4' },\n      md: { badge: 'min-h-5 min-w-5' },\n      lg: { badge: 'min-h-6 min-w-6' },\n    },\n    rounded: {\n      sm: { badge: 'rounded-sm' },\n      md: { badge: 'rounded-md' },\n      lg: { badge: 'rounded-lg' },\n      full: { badge: 'rounded-full' },\n    },\n    dot: {\n      true: {},\n    },\n  },\n  compoundVariants: [\n    // Dot default color\n    { dot: true, color: 'default', class: { badge: 'bg-gray-500' } },\n\n    // Dot sizes (smaller than normal badge)\n    { dot: true, size: 'sm', class: { badge: 'min-w-1.5 min-h-1.5' } },\n    { dot: true, size: 'md', class: { badge: 'min-w-2 min-h-2' } },\n    { dot: true, size: 'lg', class: { badge: 'min-w-2.5 min-h-2.5' } },\n  ],\n  compoundSlots: [\n    // Dark mode: warning/success/info keep light text on colored bg\n    { slots: ['badge'], color: ['warning', 'success', 'info'], class: 'dark:text-rui-light-text' },\n  ],\n  defaultVariants: {\n    color: 'primary',\n    size: 'md',\n    rounded: 'full',\n    dot: false,\n  },\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}));\n\n// Position configs: [leftOffset, rightBase, edgeBase, centerOffset] (rem / calc expressions)\nconst DOT_POS: PosConfig = [-0.25, '100% - 0.25rem', '100% - 0.25rem', 0.25];\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 : 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    <Transition\n      appear\n      enter-active-class=\"transform ease-out duration-200\"\n      enter-from-class=\"scale-0\"\n      enter-to-class=\"scale-100\"\n      leave-active-class=\"transform ease-in duration-150\"\n      leave-from-class=\"scale-100\"\n      leave-to-class=\"scale-0\"\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-label=\"Badge\"\n        aria-live=\"polite\"\n        role=\"status\"\n      >\n        <span\n          v-if=\"!dot\"\n          :class=\"ui.content({ class: hasIconAndText ? 'px-2.5' : undefined })\"\n        >\n          <slot name=\"badge\">\n            {{ text }}\n          </slot>\n          <slot name=\"icon\">\n            <RuiIcon\n              v-if=\"icon\"\n              :name=\"icon\"\n              size=\"16\"\n              :class=\"{ 'ml-0.5': hasText }\"\n            />\n          </slot>\n        </span>\n      </div>\n    </Transition>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"RuiBadge.vue_vue_type_script_setup_true_lang.js","names":[],"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 { tv } from '@/utils/tv';\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 badgeStyles = tv({\n  slots: {\n    wrapper: 'relative inline-block',\n    badge: 'flex items-center justify-center text-xs font-medium absolute bg-transparent text-rui-light-text dark:text-rui-text',\n    content: 'flex items-center px-1.5',\n  },\n  variants: {\n    color: {\n      default: {},\n      primary: { badge: 'text-white bg-rui-primary' },\n      secondary: { badge: 'text-white bg-rui-secondary' },\n      error: { badge: 'text-white bg-rui-error' },\n      warning: { badge: 'text-white bg-rui-warning' },\n      info: { badge: 'text-white bg-rui-info' },\n      success: { badge: 'text-white bg-rui-success' },\n    },\n    size: {\n      sm: { badge: 'min-h-4 min-w-4' },\n      md: { badge: 'min-h-5 min-w-5' },\n      lg: { badge: 'min-h-6 min-w-6' },\n    },\n    rounded: {\n      sm: { badge: 'rounded-sm' },\n      md: { badge: 'rounded-md' },\n      lg: { badge: 'rounded-lg' },\n      full: { badge: 'rounded-full' },\n    },\n    dot: {\n      true: {},\n    },\n  },\n  compoundVariants: [\n    // Dot default color\n    { dot: true, color: 'default', class: { badge: 'bg-gray-500' } },\n\n    // Dot sizes (smaller than normal badge)\n    { dot: true, size: 'sm', class: { badge: 'min-w-1.5 min-h-1.5' } },\n    { dot: true, size: 'md', class: { badge: 'min-w-2 min-h-2' } },\n    { dot: true, size: 'lg', class: { badge: 'min-w-2.5 min-h-2.5' } },\n  ],\n  compoundSlots: [\n    // Dark mode: warning/success/info keep light text on colored bg\n    { slots: ['badge'], color: ['warning', 'success', 'info'], class: 'dark:text-rui-light-text' },\n  ],\n  defaultVariants: {\n    color: 'primary',\n    size: 'md',\n    rounded: 'full',\n    dot: false,\n  },\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}));\n\n// Position configs: [leftOffset, rightBase, edgeBase, centerOffset] (rem / calc expressions)\nconst DOT_POS: PosConfig = [-0.25, '100% - 0.25rem', '100% - 0.25rem', 0.25];\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 : 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    <Transition\n      appear\n      enter-active-class=\"transform ease-out duration-200\"\n      enter-from-class=\"scale-0\"\n      enter-to-class=\"scale-100\"\n      leave-active-class=\"transform ease-in duration-150\"\n      leave-from-class=\"scale-100\"\n      leave-to-class=\"scale-0\"\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-label=\"Badge\"\n        aria-live=\"polite\"\n        role=\"status\"\n      >\n        <span\n          v-if=\"!dot\"\n          :class=\"ui.content({ class: hasIconAndText ? 'px-2.5' : undefined })\"\n        >\n          <slot name=\"badge\">\n            {{ text }}\n          </slot>\n          <slot name=\"icon\">\n            <RuiIcon\n              v-if=\"icon\"\n              :name=\"icon\"\n              size=\"16\"\n              :class=\"{ 'ml-0.5': hasText }\"\n            />\n          </slot>\n        </span>\n      </div>\n    </Transition>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/overlays/badge/badge-props.js.map

@@ -1 +1 @@
-{"version":3,"file":"badge-props.js","names":[],"sources":["../../../../src/components/overlays/badge/badge-props.ts"],"sourcesContent":["export const BadgePlacement = {\n  top: 'top',\n  center: 'center',\n  bottom: 'bottom',\n} as const;\n\nexport type BadgePlacement = (typeof BadgePlacement)[keyof typeof BadgePlacement];\n\nexport const BadgeSize = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n} as const;\n\nexport type BadgeSize = (typeof BadgeSize)[keyof typeof BadgeSize];\n\nexport const BadgeRounded = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n  full: 'full',\n} as const;\n\nexport type BadgeRounded = (typeof BadgeRounded)[keyof typeof BadgeRounded];\n"],"mappings":";AAAA,IAAa,iBAAiB;CAC5B,KAAK;CACL,QAAQ;CACR,QAAQ;CACT;AAID,IAAa,YAAY;CACvB,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAID,IAAa,eAAe;CAC1B,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,MAAM;CACP"}
+{"version":3,"file":"badge-props.js","names":[],"sources":["../../../../src/components/overlays/badge/badge-props.ts"],"sourcesContent":["export const BadgePlacement = {\n  top: 'top',\n  center: 'center',\n  bottom: 'bottom',\n} as const;\n\nexport type BadgePlacement = (typeof BadgePlacement)[keyof typeof BadgePlacement];\n\nexport const BadgeSize = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n} as const;\n\nexport type BadgeSize = (typeof BadgeSize)[keyof typeof BadgeSize];\n\nexport const BadgeRounded = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n  full: 'full',\n} as const;\n\nexport type BadgeRounded = (typeof BadgeRounded)[keyof typeof BadgeRounded];\n"],"mappings":";AAAA,IAAa,iBAAiB;CAC5B,KAAK;CACL,QAAQ;CACR,QAAQ;AACV;AAIA,IAAa,YAAY;CACvB,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAIA,IAAa,eAAe;CAC1B,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,MAAM;AACR"}

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

@@ -1,11 +1,11 @@
 import RuiDialog_default from "../dialog/RuiDialog.js";
 import { createBlock, createSlots, defineComponent, guardReactiveProps, mergeModels, mergeProps, normalizeProps, openBlock, renderList, 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({
+var RuiBottomSheet_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "RuiBottomSheet",
 	inheritAttrs: false,
 	__name: "RuiBottomSheet",
-	props: /* @__PURE__ */ mergeModels({
+	props: /*@__PURE__*/ mergeModels({
 		persistent: {
 			type: Boolean,
 			default: false

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"],"sources":["../../../../src/components/overlays/bottom-sheet/RuiBottomSheet.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport RuiDialog from '@/components/overlays/dialog/RuiDialog.vue';\n\n// keep these props in sync with Dialog props\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,aAAa,SAAoB,SAAA,aAAoB;;uBAMzD,YAiBY,mBAjBZ,WAiBY;gBAhBD,WAAA;4EAAU,QAAA;IACnB,gBAAA;MACQA,KAAAA,QAAM;IACb,YAAY,QAAA;IACZ,OAAO,QAAA;IACP,aAAW,QAAA;yCAGK,OAAO,KAAKC,KAAAA,OAAM,GAA1B,SAAI;;WACV;kBAAQ,UAAK,CAEd,WAGE,KAAA,QADO,MAAI,eAAA,mBADH,MAAK,CAAA,CAAA,CAAA,CAAA"}
+{"version":3,"file":"RuiBottomSheet.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$slots"],"sources":["../../../../src/components/overlays/bottom-sheet/RuiBottomSheet.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport RuiDialog from '@/components/overlays/dialog/RuiDialog.vue';\n\n// keep these props in sync with Dialog props\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,aAAa,SAAoB,SAAA,YAAmB;;uBAMxD,YAiBY,mBAjBZ,WAiBY;gBAhBD,WAAA;4EAAU,QAAA;IACnB,gBAAA;MACQA,KAAAA,QAAM;IACb,YAAY,QAAA;IACZ,OAAO,QAAA;IACP,aAAW,QAAA;yCAGK,OAAO,KAAKC,KAAAA,MAAM,IAA1B,SAAI;;WACV;kBAAQ,UAAK,CAEd,WAGE,KAAA,QADO,MAAI,eAAA,mBADH,KAAK,CAAA,CAAA,CAAA,CAAA"}

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

@@ -6,11 +6,11 @@ import { get, set } from "@vueuse/shared";
 //#region src/components/overlays/dialog/RuiDialog.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["aria-label"];
 var _hoisted_2 = ["data-bottom-sheet"];
-var RuiDialog_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var RuiDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "RuiDialog",
 	inheritAttrs: false,
 	__name: "RuiDialog",
-	props: /* @__PURE__ */ mergeModels({
+	props: /*@__PURE__*/ mergeModels({
 		persistent: {
 			type: Boolean,
 			default: false
@@ -32,7 +32,7 @@ var RuiDialog_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
 		},
 		"modelModifiers": {}
 	}),
-	emits: /* @__PURE__ */ mergeModels([
+	emits: /*@__PURE__*/ mergeModels([
 		"closed",
 		"click:outside",
 		"click:esc"