@vuetify/nightly 3.8.1-dev.2025-04-07 → 3.8.1-dev.2025-04-12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/vuetify.d.ts CHANGED
@@ -132,11 +132,12 @@ type DeepPartial<T> = T extends object ? {
132
132
  } : T;
133
133
  type ThemeOptions = false | {
134
134
  cspNonce?: string;
135
- defaultTheme?: string;
135
+ defaultTheme?: 'light' | 'dark' | 'system' | string;
136
136
  variations?: false | VariationsOptions;
137
137
  themes?: Record<string, ThemeDefinition>;
138
138
  stylesheetId?: string;
139
139
  scope?: string;
140
+ unimportant?: boolean;
140
141
  };
141
142
  type ThemeDefinition = DeepPartial<InternalThemeDefinition>;
142
143
  interface VariationsOptions {
@@ -173,11 +174,15 @@ interface OnColors {
173
174
  'on-info': string;
174
175
  }
175
176
  interface ThemeInstance {
177
+ change: (themeName: string) => void;
178
+ cycle: (themeArray?: string[]) => void;
179
+ toggle: (themeArray?: [string, string]) => void;
176
180
  readonly isDisabled: boolean;
177
181
  readonly themes: Ref<Record<string, InternalThemeDefinition>>;
178
182
  readonly name: Readonly<Ref<string>>;
179
183
  readonly current: DeepReadonly<Ref<InternalThemeDefinition>>;
180
184
  readonly computedThemes: DeepReadonly<Ref<Record<string, InternalThemeDefinition>>>;
185
+ readonly prefix: string;
181
186
  readonly themeClasses: Readonly<Ref<string | undefined>>;
182
187
  readonly styles: Readonly<Ref<string>>;
183
188
  readonly global: {
@@ -82943,40 +82948,43 @@ declare module 'vue' {
82943
82948
  $children?: VNodeChild
82944
82949
  }
82945
82950
  export interface GlobalComponents {
82951
+ VAlert: VAlert
82952
+ VAlertTitle: VAlertTitle
82946
82953
  VApp: VApp
82954
+ VAutocomplete: VAutocomplete
82947
82955
  VAppBar: VAppBar
82948
82956
  VAppBarNavIcon: VAppBarNavIcon
82949
82957
  VAppBarTitle: VAppBarTitle
82950
- VAvatar: VAvatar
82951
- VAlert: VAlert
82952
- VAlertTitle: VAlertTitle
82953
- VAutocomplete: VAutocomplete
82954
82958
  VBadge: VBadge
82959
+ VAvatar: VAvatar
82955
82960
  VBanner: VBanner
82956
82961
  VBannerActions: VBannerActions
82957
82962
  VBannerText: VBannerText
82963
+ VBtn: VBtn
82964
+ VBtnGroup: VBtnGroup
82965
+ VBtnToggle: VBtnToggle
82966
+ VBottomNavigation: VBottomNavigation
82958
82967
  VBreadcrumbs: VBreadcrumbs
82959
82968
  VBreadcrumbsItem: VBreadcrumbsItem
82960
82969
  VBreadcrumbsDivider: VBreadcrumbsDivider
82970
+ VChip: VChip
82971
+ VCarousel: VCarousel
82972
+ VCarouselItem: VCarouselItem
82961
82973
  VBottomSheet: VBottomSheet
82962
- VBottomNavigation: VBottomNavigation
82963
- VBtnGroup: VBtnGroup
82964
- VBtn: VBtn
82965
- VCheckbox: VCheckbox
82966
- VCheckboxBtn: VCheckboxBtn
82974
+ VCode: VCode
82975
+ VChipGroup: VChipGroup
82967
82976
  VCard: VCard
82968
82977
  VCardActions: VCardActions
82969
82978
  VCardItem: VCardItem
82970
82979
  VCardSubtitle: VCardSubtitle
82971
82980
  VCardText: VCardText
82972
82981
  VCardTitle: VCardTitle
82973
- VBtnToggle: VBtnToggle
82974
- VChipGroup: VChipGroup
82975
- VCarousel: VCarousel
82976
- VCarouselItem: VCarouselItem
82977
- VColorPicker: VColorPicker
82978
- VCode: VCode
82979
82982
  VCombobox: VCombobox
82983
+ VCheckbox: VCheckbox
82984
+ VCheckboxBtn: VCheckboxBtn
82985
+ VDialog: VDialog
82986
+ VCounter: VCounter
82987
+ VColorPicker: VColorPicker
82980
82988
  VDataTable: VDataTable
82981
82989
  VDataTableHeaders: VDataTableHeaders
82982
82990
  VDataTableFooter: VDataTableFooter
@@ -82990,32 +82998,28 @@ declare module 'vue' {
82990
82998
  VDatePickerMonth: VDatePickerMonth
82991
82999
  VDatePickerMonths: VDatePickerMonths
82992
83000
  VDatePickerYears: VDatePickerYears
82993
- VCounter: VCounter
82994
- VChip: VChip
82995
- VEmptyState: VEmptyState
82996
- VDivider: VDivider
82997
83001
  VExpansionPanels: VExpansionPanels
82998
83002
  VExpansionPanel: VExpansionPanel
82999
83003
  VExpansionPanelText: VExpansionPanelText
83000
83004
  VExpansionPanelTitle: VExpansionPanelTitle
83001
- VDialog: VDialog
83002
- VFab: VFab
83005
+ VDivider: VDivider
83006
+ VEmptyState: VEmptyState
83003
83007
  VField: VField
83004
83008
  VFieldLabel: VFieldLabel
83005
- VFooter: VFooter
83006
83009
  VFileInput: VFileInput
83010
+ VFooter: VFooter
83011
+ VFab: VFab
83007
83012
  VIcon: VIcon
83008
83013
  VComponentIcon: VComponentIcon
83009
83014
  VSvgIcon: VSvgIcon
83010
83015
  VLigatureIcon: VLigatureIcon
83011
83016
  VClassIcon: VClassIcon
83012
- VInput: VInput
83013
- VLabel: VLabel
83014
- VInfiniteScroll: VInfiniteScroll
83017
+ VImg: VImg
83015
83018
  VItemGroup: VItemGroup
83016
83019
  VItem: VItem
83020
+ VInput: VInput
83017
83021
  VKbd: VKbd
83018
- VImg: VImg
83022
+ VLabel: VLabel
83019
83023
  VList: VList
83020
83024
  VListGroup: VListGroup
83021
83025
  VListImg: VListImg
@@ -83025,66 +83029,67 @@ declare module 'vue' {
83025
83029
  VListItemSubtitle: VListItemSubtitle
83026
83030
  VListItemTitle: VListItemTitle
83027
83031
  VListSubheader: VListSubheader
83032
+ VInfiniteScroll: VInfiniteScroll
83028
83033
  VMain: VMain
83029
- VNavigationDrawer: VNavigationDrawer
83030
- VMenu: VMenu
83031
- VOtpInput: VOtpInput
83032
- VOverlay: VOverlay
83033
83034
  VMessages: VMessages
83035
+ VMenu: VMenu
83036
+ VNavigationDrawer: VNavigationDrawer
83034
83037
  VNumberInput: VNumberInput
83035
- VPagination: VPagination
83038
+ VOtpInput: VOtpInput
83036
83039
  VProgressLinear: VProgressLinear
83037
- VRadioGroup: VRadioGroup
83040
+ VPagination: VPagination
83041
+ VOverlay: VOverlay
83038
83042
  VProgressCircular: VProgressCircular
83039
- VSelect: VSelect
83043
+ VRadioGroup: VRadioGroup
83040
83044
  VRating: VRating
83045
+ VSelect: VSelect
83046
+ VSheet: VSheet
83041
83047
  VSelectionControl: VSelectionControl
83048
+ VSkeletonLoader: VSkeletonLoader
83042
83049
  VSelectionControlGroup: VSelectionControlGroup
83043
83050
  VSlideGroup: VSlideGroup
83044
83051
  VSlideGroupItem: VSlideGroupItem
83045
- VSnackbar: VSnackbar
83046
- VSheet: VSheet
83047
- VSkeletonLoader: VSkeletonLoader
83048
83052
  VSlider: VSlider
83053
+ VSnackbar: VSnackbar
83049
83054
  VSwitch: VSwitch
83050
- VTab: VTab
83051
- VTabs: VTabs
83052
- VTabsWindow: VTabsWindow
83053
- VTabsWindowItem: VTabsWindowItem
83054
- VSystemBar: VSystemBar
83055
83055
  VStepper: VStepper
83056
83056
  VStepperActions: VStepperActions
83057
83057
  VStepperHeader: VStepperHeader
83058
83058
  VStepperItem: VStepperItem
83059
83059
  VStepperWindow: VStepperWindow
83060
83060
  VStepperWindowItem: VStepperWindowItem
83061
- VTextarea: VTextarea
83062
83061
  VTable: VTable
83062
+ VTab: VTab
83063
+ VTabs: VTabs
83064
+ VTabsWindow: VTabsWindow
83065
+ VTabsWindowItem: VTabsWindowItem
83066
+ VTimeline: VTimeline
83067
+ VTimelineItem: VTimelineItem
83068
+ VTextField: VTextField
83063
83069
  VToolbar: VToolbar
83064
83070
  VToolbarTitle: VToolbarTitle
83065
83071
  VToolbarItems: VToolbarItems
83066
- VTextField: VTextField
83067
- VTimeline: VTimeline
83068
- VTimelineItem: VTimelineItem
83072
+ VTextarea: VTextarea
83073
+ VTooltip: VTooltip
83069
83074
  VWindow: VWindow
83070
83075
  VWindowItem: VWindowItem
83071
- VTooltip: VTooltip
83076
+ VSystemBar: VSystemBar
83072
83077
  VConfirmEdit: VConfirmEdit
83073
83078
  VDataIterator: VDataIterator
83074
83079
  VDefaultsProvider: VDefaultsProvider
83075
83080
  VForm: VForm
83076
- VHover: VHover
83077
83081
  VContainer: VContainer
83078
83082
  VCol: VCol
83079
83083
  VRow: VRow
83080
83084
  VSpacer: VSpacer
83085
+ VHover: VHover
83081
83086
  VLayout: VLayout
83082
83087
  VLayoutItem: VLayoutItem
83083
83088
  VLazy: VLazy
83084
83089
  VLocaleProvider: VLocaleProvider
83085
83090
  VNoSsr: VNoSsr
83086
- VParallax: VParallax
83087
83091
  VRadio: VRadio
83092
+ VParallax: VParallax
83088
83093
  VRangeSlider: VRangeSlider
83089
83094
  VResponsive: VResponsive
83090
83095
  VSnackbarQueue: VSnackbarQueue
@@ -83109,26 +83114,26 @@ declare module 'vue' {
83109
83114
  VExpandTransition: VExpandTransition
83110
83115
  VExpandXTransition: VExpandXTransition
83111
83116
  VDialogTransition: VDialogTransition
83112
- VFileUpload: VFileUpload
83113
- VFileUploadItem: VFileUploadItem
83114
- VStepperVertical: VStepperVertical
83115
- VStepperVerticalItem: VStepperVerticalItem
83116
- VStepperVerticalActions: VStepperVerticalActions
83117
+ VIconBtn: VIconBtn
83117
83118
  VCalendar: VCalendar
83118
83119
  VCalendarDay: VCalendarDay
83119
83120
  VCalendarHeader: VCalendarHeader
83120
83121
  VCalendarInterval: VCalendarInterval
83121
83122
  VCalendarIntervalEvent: VCalendarIntervalEvent
83122
83123
  VCalendarMonthDay: VCalendarMonthDay
83123
- VIconBtn: VIconBtn
83124
+ VFileUpload: VFileUpload
83125
+ VFileUploadItem: VFileUploadItem
83126
+ VStepperVertical: VStepperVertical
83127
+ VStepperVerticalItem: VStepperVerticalItem
83128
+ VStepperVerticalActions: VStepperVerticalActions
83124
83129
  VPicker: VPicker
83125
83130
  VPickerTitle: VPickerTitle
83126
- VTimePicker: VTimePicker
83127
- VTimePickerClock: VTimePickerClock
83128
- VTimePickerControls: VTimePickerControls
83129
83131
  VTreeview: VTreeview
83130
83132
  VTreeviewItem: VTreeviewItem
83131
83133
  VTreeviewGroup: VTreeviewGroup
83134
+ VTimePicker: VTimePicker
83135
+ VTimePickerClock: VTimePickerClock
83136
+ VTimePickerControls: VTimePickerControls
83132
83137
  VDateInput: VDateInput
83133
83138
  VPullToRefresh: VPullToRefresh
83134
83139
  }
@@ -1,15 +1,16 @@
1
1
  /*!
2
- * Vuetify v3.8.1-dev.2025-04-07
2
+ * Vuetify v3.8.1-dev.2025-04-12
3
3
  * Forged by John Leider
4
4
  * Released under the MIT License.
5
5
  */
6
6
 
7
- import { shallowRef, reactive, computed, watchEffect, toRefs, capitalize, unref, Fragment, isVNode, Comment, warn, getCurrentInstance as getCurrentInstance$1, ref, provide, inject as inject$1, defineComponent as defineComponent$1, h, camelize, createVNode, mergeProps, onBeforeUnmount, watch, readonly, onMounted, useId, onDeactivated, onActivated, onScopeDispose, effectScope, toRaw, TransitionGroup, Transition, isRef, toRef, onBeforeMount, nextTick, withDirectives, resolveDirective, vShow, onUpdated, Text, resolveDynamicComponent, toDisplayString, markRaw, Teleport, cloneVNode, createTextVNode, onUnmounted, onBeforeUpdate, withModifiers, vModelText, resolveComponent, render } from 'vue';
7
+ import { shallowRef, reactive, computed, watchEffect, toRefs, capitalize, unref, Fragment, isVNode, Comment, warn, getCurrentInstance as getCurrentInstance$1, ref, provide, inject as inject$1, defineComponent as defineComponent$1, h, camelize, createVNode, mergeProps, onBeforeUnmount, watch, readonly, onMounted, useId, onDeactivated, onActivated, onScopeDispose, effectScope, toRaw, getCurrentScope, TransitionGroup, Transition, isRef, toRef, onBeforeMount, nextTick, withDirectives, resolveDirective, vShow, onUpdated, Text, resolveDynamicComponent, toDisplayString, markRaw, Teleport, cloneVNode, createTextVNode, onUnmounted, onBeforeUpdate, withModifiers, vModelText, resolveComponent, render } from 'vue';
8
8
 
9
9
  const IN_BROWSER = typeof window !== 'undefined';
10
10
  const SUPPORTS_INTERSECTION = IN_BROWSER && 'IntersectionObserver' in window;
11
11
  const SUPPORTS_TOUCH = IN_BROWSER && ('ontouchstart' in window || window.navigator.maxTouchPoints > 0);
12
12
  const SUPPORTS_EYE_DROPPER = IN_BROWSER && 'EyeDropper' in window;
13
+ const SUPPORTS_MATCH_MEDIA = IN_BROWSER && 'matchMedia' in window && typeof window.matchMedia === 'function';
13
14
 
14
15
  function _classPrivateFieldInitSpec(e, t, a) { _checkPrivateRedeclaration(e, t), t.set(e, a); }
15
16
  function _checkPrivateRedeclaration(e, t) { if (t.has(e)) throw new TypeError("Cannot initialize the same private elements twice on an object"); }
@@ -2754,6 +2755,7 @@ const makeThemeProps = propsFactory({
2754
2755
  function genDefaults$1() {
2755
2756
  return {
2756
2757
  defaultTheme: 'light',
2758
+ prefix: 'v-',
2757
2759
  variations: {
2758
2760
  colors: [],
2759
2761
  lighten: 0,
@@ -2835,7 +2837,10 @@ function genDefaults$1() {
2835
2837
  }
2836
2838
  }
2837
2839
  },
2838
- stylesheetId: 'vuetify-theme-stylesheet'
2840
+ stylesheetId: 'vuetify-theme-stylesheet',
2841
+ scoped: false,
2842
+ unimportant: false,
2843
+ utilities: true
2839
2844
  };
2840
2845
  }
2841
2846
  function parseThemeOptions() {
@@ -2858,21 +2863,21 @@ function parseThemeOptions() {
2858
2863
  function createCssClass(lines, selector, content, scope) {
2859
2864
  lines.push(`${getScopedSelector(selector, scope)} {\n`, ...content.map(line => ` ${line};\n`), '}\n');
2860
2865
  }
2861
- function genCssVariables(theme) {
2866
+ function genCssVariables(theme, prefix) {
2862
2867
  const lightOverlay = theme.dark ? 2 : 1;
2863
2868
  const darkOverlay = theme.dark ? 1 : 2;
2864
2869
  const variables = [];
2865
2870
  for (const [key, value] of Object.entries(theme.colors)) {
2866
2871
  const rgb = parseColor(value);
2867
- variables.push(`--v-theme-${key}: ${rgb.r},${rgb.g},${rgb.b}`);
2872
+ variables.push(`--${prefix}theme-${key}: ${rgb.r},${rgb.g},${rgb.b}`);
2868
2873
  if (!key.startsWith('on-')) {
2869
- variables.push(`--v-theme-${key}-overlay-multiplier: ${getLuma(value) > 0.18 ? lightOverlay : darkOverlay}`);
2874
+ variables.push(`--${prefix}theme-${key}-overlay-multiplier: ${getLuma(value) > 0.18 ? lightOverlay : darkOverlay}`);
2870
2875
  }
2871
2876
  }
2872
2877
  for (const [key, value] of Object.entries(theme.variables)) {
2873
2878
  const color = typeof value === 'string' && value.startsWith('#') ? parseColor(value) : undefined;
2874
2879
  const rgb = color ? `${color.r}, ${color.g}, ${color.b}` : undefined;
2875
- variables.push(`--v-${key}: ${rgb ?? value}`);
2880
+ variables.push(`--${prefix}${key}: ${rgb ?? value}`);
2876
2881
  }
2877
2882
  return variables;
2878
2883
  }
@@ -2916,7 +2921,8 @@ function getScopedSelector(selector, scope) {
2916
2921
  const scopeSelector = `:where(${scope})`;
2917
2922
  return selector === ':root' ? scopeSelector : `${scopeSelector} ${selector}`;
2918
2923
  }
2919
- function upsertStyles(styleEl, styles) {
2924
+ function upsertStyles(id, cspNonce, styles) {
2925
+ const styleEl = getOrCreateStyleElement(id, cspNonce);
2920
2926
  if (!styleEl) return;
2921
2927
  styleEl.innerHTML = styles;
2922
2928
  }
@@ -2936,8 +2942,17 @@ function getOrCreateStyleElement(id, cspNonce) {
2936
2942
  // Composables
2937
2943
  function createTheme(options) {
2938
2944
  const parsedOptions = parseThemeOptions(options);
2939
- const name = shallowRef(parsedOptions.defaultTheme);
2945
+ const _name = shallowRef(parsedOptions.defaultTheme);
2940
2946
  const themes = ref(parsedOptions.themes);
2947
+ const systemName = shallowRef('light');
2948
+ const name = computed({
2949
+ get() {
2950
+ return _name.value === 'system' ? systemName.value : _name.value;
2951
+ },
2952
+ set(val) {
2953
+ _name.value = val;
2954
+ }
2955
+ });
2941
2956
  const computedThemes = computed(() => {
2942
2957
  const acc = {};
2943
2958
  for (const [name, original] of Object.entries(themes.value)) {
@@ -2958,28 +2973,49 @@ function createTheme(options) {
2958
2973
  const current = computed(() => computedThemes.value[name.value]);
2959
2974
  const styles = computed(() => {
2960
2975
  const lines = [];
2976
+ const important = parsedOptions.unimportant ? '' : ' !important';
2977
+ const scoped = parsedOptions.scoped ? parsedOptions.prefix : '';
2961
2978
  if (current.value?.dark) {
2962
2979
  createCssClass(lines, ':root', ['color-scheme: dark'], parsedOptions.scope);
2963
2980
  }
2964
- createCssClass(lines, ':root', genCssVariables(current.value), parsedOptions.scope);
2981
+ createCssClass(lines, ':root', genCssVariables(current.value, parsedOptions.prefix), parsedOptions.scope);
2965
2982
  for (const [themeName, theme] of Object.entries(computedThemes.value)) {
2966
- createCssClass(lines, `.v-theme--${themeName}`, [`color-scheme: ${theme.dark ? 'dark' : 'normal'}`, ...genCssVariables(theme)], parsedOptions.scope);
2967
- }
2968
- const bgLines = [];
2969
- const fgLines = [];
2970
- const colors = new Set(Object.values(computedThemes.value).flatMap(theme => Object.keys(theme.colors)));
2971
- for (const key of colors) {
2972
- if (key.startsWith('on-')) {
2973
- createCssClass(fgLines, `.${key}`, [`color: rgb(var(--v-theme-${key})) !important`], parsedOptions.scope);
2974
- } else {
2975
- createCssClass(bgLines, `.bg-${key}`, [`--v-theme-overlay-multiplier: var(--v-theme-${key}-overlay-multiplier)`, `background-color: rgb(var(--v-theme-${key})) !important`, `color: rgb(var(--v-theme-on-${key})) !important`], parsedOptions.scope);
2976
- createCssClass(fgLines, `.text-${key}`, [`color: rgb(var(--v-theme-${key})) !important`], parsedOptions.scope);
2977
- createCssClass(fgLines, `.border-${key}`, [`--v-border-color: var(--v-theme-${key})`], parsedOptions.scope);
2983
+ createCssClass(lines, `.${parsedOptions.prefix}theme--${themeName}`, [`color-scheme: ${theme.dark ? 'dark' : 'normal'}`, ...genCssVariables(theme, parsedOptions.prefix)], parsedOptions.scope);
2984
+ }
2985
+ if (parsedOptions.utilities) {
2986
+ const bgLines = [];
2987
+ const fgLines = [];
2988
+ const colors = new Set(Object.values(computedThemes.value).flatMap(theme => Object.keys(theme.colors)));
2989
+ for (const key of colors) {
2990
+ if (key.startsWith('on-')) {
2991
+ createCssClass(fgLines, `.${key}`, [`color: rgb(var(--${parsedOptions.prefix}theme-${key}))${important}`], parsedOptions.scope);
2992
+ } else {
2993
+ createCssClass(bgLines, `.${scoped}bg-${key}`, [`--${parsedOptions.prefix}theme-overlay-multiplier: var(--${parsedOptions.prefix}theme-${key}-overlay-multiplier)`, `background-color: rgb(var(--${parsedOptions.prefix}theme-${key}))${important}`, `color: rgb(var(--${parsedOptions.prefix}theme-on-${key}))${important}`], parsedOptions.scope);
2994
+ createCssClass(fgLines, `.${scoped}text-${key}`, [`color: rgb(var(--${parsedOptions.prefix}theme-${key}))${important}`], parsedOptions.scope);
2995
+ createCssClass(fgLines, `.${scoped}border-${key}`, [`--${parsedOptions.prefix}border-color: var(--${parsedOptions.prefix}theme-${key})`], parsedOptions.scope);
2996
+ }
2978
2997
  }
2998
+ lines.push(...bgLines, ...fgLines);
2979
2999
  }
2980
- lines.push(...bgLines, ...fgLines);
2981
3000
  return lines.map((str, i) => i === 0 ? str : ` ${str}`).join('');
2982
3001
  });
3002
+ const themeClasses = computed(() => parsedOptions.isDisabled ? undefined : `${parsedOptions.prefix}theme--${name.value}`);
3003
+ const themeNames = computed(() => Object.keys(computedThemes.value));
3004
+ if (SUPPORTS_MATCH_MEDIA) {
3005
+ const media = window.matchMedia('(prefers-color-scheme: dark)');
3006
+ function updateSystemName() {
3007
+ systemName.value = media.matches ? 'dark' : 'light';
3008
+ }
3009
+ updateSystemName();
3010
+ media.addEventListener('change', updateSystemName, {
3011
+ passive: true
3012
+ });
3013
+ if (getCurrentScope()) {
3014
+ onScopeDispose(() => {
3015
+ media.removeEventListener('change', updateSystemName);
3016
+ });
3017
+ }
3018
+ }
2983
3019
  function install(app) {
2984
3020
  if (parsedOptions.isDisabled) return;
2985
3021
  const head = app._context.provides.usehead;
@@ -3017,22 +3053,55 @@ function createTheme(options) {
3017
3053
  updateStyles();
3018
3054
  }
3019
3055
  function updateStyles() {
3020
- upsertStyles(getOrCreateStyleElement(parsedOptions.stylesheetId, parsedOptions.cspNonce), styles.value);
3056
+ upsertStyles(parsedOptions.stylesheetId, parsedOptions.cspNonce, styles.value);
3021
3057
  }
3022
3058
  }
3023
3059
  }
3024
- const themeClasses = computed(() => parsedOptions.isDisabled ? undefined : `v-theme--${name.value}`);
3060
+ function change(themeName) {
3061
+ if (!themeNames.value.includes(themeName)) {
3062
+ consoleWarn(`Theme "${themeName}" not found on the Vuetify theme instance`);
3063
+ return;
3064
+ }
3065
+ name.value = themeName;
3066
+ }
3067
+ function cycle() {
3068
+ let themeArray = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : themeNames.value;
3069
+ const currentIndex = themeArray.indexOf(name.value);
3070
+ const nextIndex = currentIndex === -1 ? 0 : (currentIndex + 1) % themeArray.length;
3071
+ change(themeArray[nextIndex]);
3072
+ }
3073
+ function toggle() {
3074
+ let themeArray = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : ['light', 'dark'];
3075
+ cycle(themeArray);
3076
+ }
3077
+ const globalName = new Proxy(name, {
3078
+ get(target, prop) {
3079
+ return target[prop];
3080
+ },
3081
+ set(target, prop, val) {
3082
+ if (prop === 'value') {
3083
+ deprecate(`theme.global.name.value = ${val}`, `theme.change('${val}')`);
3084
+ }
3085
+ // @ts-expect-error
3086
+ target[prop] = val;
3087
+ return true;
3088
+ }
3089
+ });
3025
3090
  return {
3026
3091
  install,
3092
+ change,
3093
+ cycle,
3094
+ toggle,
3027
3095
  isDisabled: parsedOptions.isDisabled,
3028
3096
  name,
3029
3097
  themes,
3030
3098
  current,
3031
3099
  computedThemes,
3100
+ prefix: parsedOptions.prefix,
3032
3101
  themeClasses,
3033
3102
  styles,
3034
3103
  global: {
3035
- name,
3104
+ name: globalName,
3036
3105
  current
3037
3106
  }
3038
3107
  };
@@ -3043,7 +3112,7 @@ function provideTheme(props) {
3043
3112
  if (!theme) throw new Error('Could not find Vuetify theme injection');
3044
3113
  const name = computed(() => props.theme ?? theme.name.value);
3045
3114
  const current = computed(() => theme.themes.value[name.value]);
3046
- const themeClasses = computed(() => theme.isDisabled ? undefined : `v-theme--${name.value}`);
3115
+ const themeClasses = computed(() => theme.isDisabled ? undefined : `${theme.prefix}theme--${name.value}`);
3047
3116
  const newTheme = {
3048
3117
  ...theme,
3049
3118
  name,
@@ -29241,7 +29310,7 @@ function createVuetify$1() {
29241
29310
  };
29242
29311
  });
29243
29312
  }
29244
- const version$1 = "3.8.1-dev.2025-04-07";
29313
+ const version$1 = "3.8.1-dev.2025-04-12";
29245
29314
  createVuetify$1.version = version$1;
29246
29315
 
29247
29316
  // Vue's inject() can only be used in setup
@@ -29266,7 +29335,7 @@ const createVuetify = function () {
29266
29335
  ...options
29267
29336
  });
29268
29337
  };
29269
- const version = "3.8.1-dev.2025-04-07";
29338
+ const version = "3.8.1-dev.2025-04-12";
29270
29339
  createVuetify.version = version;
29271
29340
 
29272
29341
  export { index as blueprints, components, createVuetify, directives, useDate, useDefaults, useDisplay, useGoTo, useLayout, useLocale, useRtl, useTheme, version };