@code-coaching/vuetiful 0.25.0 → 0.27.0

package/dist/types/props/props.d.ts

@@ -1,14 +1 @@
-import { PropType } from 'vue';
-declare const sizeProp: {
-    type: PropType<"xs" | "sm" | "md" | "lg" | "xl">;
-    default: string;
-};
-declare const unstyledProp: {
-    type: BooleanConstructor;
-    default: boolean;
-};
-declare const variantProp: {
-    type: PropType<"" | "filled" | "filled-primary" | "filled-secondary" | "filled-tertiary" | "filled-success" | "filled-warning" | "filled-error" | "filled-surface" | "ringed" | "ringed-primary" | "ringed-secondary" | "ringed-tertiary" | "ringed-success" | "ringed-warning" | "ringed-error" | "ringed-surface" | "ghost" | "ghost-primary" | "ghost-secondary" | "ghost-tertiary" | "ghost-success" | "ghost-warning" | "ghost-error" | "ghost-surface" | "soft" | "soft-primary" | "soft-secondary" | "soft-tertiary" | "soft-success" | "soft-warning" | "soft-error" | "soft-surface" | "glass" | "glass-primary" | "glass-secondary" | "glass-tertiary" | "glass-success" | "glass-warning" | "glass-error" | "glass-surface">;
-    default: string;
-};
-export { sizeProp, unstyledProp, variantProp };
+export type SizeProp = 'xs' | 'sm' | 'md' | 'lg' | 'xl';

package/dist/types/services/dark-mode.service.d.ts

@@ -2,7 +2,7 @@ declare const MODE: {
     LIGHT: string;
     DARK: string;
 };
-export declare type Mode = (typeof MODE)[keyof typeof MODE];
+export type Mode = (typeof MODE)[keyof typeof MODE];
 declare const useDarkMode: () => {
     chosenMode: import("vue").Ref<string>;
     isDark: Readonly<import("vue").Ref<boolean>>;

package/dist/types/services/drawer.service.d.ts

@@ -12,12 +12,12 @@ declare const useDrawer: () => {
         readonly [x: string]: Readonly<unknown>;
         readonly id?: string | undefined;
         readonly open?: boolean | undefined;
-        readonly position?: "left" | "top" | "right" | "bottom" | undefined;
-        readonly duration?: 150 | 300 | undefined;
+        readonly position?: "bottom" | "left" | "right" | "top" | undefined;
+        readonly duration?: 300 | 150 | undefined;
         readonly regionBackdrop?: string | undefined;
         readonly regionDrawer?: string | undefined;
     };
-    open: (settings?: DrawerSettings | undefined) => void;
+    open: (settings?: DrawerSettings) => void;
     close: () => void;
 };
 export { useDrawer };

package/dist/types/services/index.d.ts

@@ -1,7 +1,7 @@
-import { useDarkMode, Mode } from './dark-mode.service';
+import { useDarkMode, type Mode } from './dark-mode.service';
 import { useDrawer } from './drawer.service';
 import { useHighlight } from './highlight.service';
 import { useRail } from './rail.service';
-import { useSettings, VuetifulSettings } from './settings.service';
+import { useSettings, type VuetifulSettings } from './settings.service';
 export { useDarkMode, useDrawer, useHighlight, useRail, useSettings };
 export type { VuetifulSettings, Mode };

package/dist/types/utils/id-generator.d.ts

@@ -0,0 +1 @@
+export declare const idGenerator: (prefix?: string) => string;

package/dist/types/utils/index.d.ts

@@ -1,7 +1,6 @@
-import type { ColorSettings, Palette, PassReport, Report, SemanticNames } from './colors/colors.service';
-import { useColors } from './colors/colors.service';
 import { usePlatform } from './platform/platform.service';
 import ThemeSwitcher from './theme/theme-switcher.vue';
 import { useTheme } from './theme/theme.service';
-export { ThemeSwitcher, useColors, usePlatform, useTheme };
-export type { ColorSettings, Palette, PassReport, Report, SemanticNames };
+import { idGenerator } from './id-generator';
+import { tm } from './tailwind-merge';
+export { ThemeSwitcher, usePlatform, useTheme, idGenerator, tm };

package/dist/types/utils/tailwind-merge.d.ts

@@ -0,0 +1 @@
+export declare const tm: (...classLists: import("tailwind-merge").ClassNameValue[]) => string;

package/dist/types/utils/theme/rocket.theme.d.ts

@@ -0,0 +1,223 @@
+declare const rocket: {
+    name: string;
+    properties: {
+        "--space-scale-factor": string;
+        "--type-scale-factor": string;
+        "--type-scale-1": string;
+        "--type-scale-2": string;
+        "--type-scale-3": string;
+        "--type-scale-4": string;
+        "--type-scale-5": string;
+        "--type-scale-6": string;
+        "--type-scale-7": string;
+        "--type-scale-8": string;
+        "--type-scale-9": string;
+        "--type-scale-10": string;
+        "--type-scale-11": string;
+        "--type-scale-12": string;
+        "--type-scale-13": string;
+        "--base-font-color": string;
+        "--base-font-color-dark": string;
+        "--base-font-family": string;
+        "--base-font-size": string;
+        "--base-line-height": string;
+        "--base-font-weight": string;
+        "--base-font-style": string;
+        "--base-letter-spacing": string;
+        "--heading-font-color": string;
+        "--heading-font-color-dark": string;
+        "--heading-font-family": string;
+        "--heading-font-weight": string;
+        "--heading-font-style": string;
+        "--heading-letter-spacing": string;
+        "--anchor-font-color": string;
+        "--anchor-font-color-dark": string;
+        "--anchor-font-family": string;
+        "--anchor-font-size": string;
+        "--anchor-line-height": string;
+        "--anchor-font-weight": string;
+        "--anchor-font-style": string;
+        "--anchor-letter-spacing": string;
+        "--anchor-text-decoration": string;
+        "--anchor-text-decoration-hover": string;
+        "--anchor-text-decoration-active": string;
+        "--anchor-text-decoration-focus": string;
+        "--body-background-color": string;
+        "--body-background-color-dark": string;
+        "--radii-default": string;
+        "--radii-container": string;
+        "--border-width-default": string;
+        "--ring-width-default": string;
+        "--outline-width-default": string;
+        "--divide-width-default": string;
+        "--color-primary-50": string;
+        "--color-primary-100": string;
+        "--color-primary-200": string;
+        "--color-primary-300": string;
+        "--color-primary-400": string;
+        "--color-primary-500": string;
+        "--color-primary-600": string;
+        "--color-primary-700": string;
+        "--color-primary-800": string;
+        "--color-primary-900": string;
+        "--color-primary-950": string;
+        "--color-primary-contrast-dark": string;
+        "--color-primary-contrast-light": string;
+        "--color-primary-contrast-50": string;
+        "--color-primary-contrast-100": string;
+        "--color-primary-contrast-200": string;
+        "--color-primary-contrast-300": string;
+        "--color-primary-contrast-400": string;
+        "--color-primary-contrast-500": string;
+        "--color-primary-contrast-600": string;
+        "--color-primary-contrast-700": string;
+        "--color-primary-contrast-800": string;
+        "--color-primary-contrast-900": string;
+        "--color-primary-contrast-950": string;
+        "--color-secondary-50": string;
+        "--color-secondary-100": string;
+        "--color-secondary-200": string;
+        "--color-secondary-300": string;
+        "--color-secondary-400": string;
+        "--color-secondary-500": string;
+        "--color-secondary-600": string;
+        "--color-secondary-700": string;
+        "--color-secondary-800": string;
+        "--color-secondary-900": string;
+        "--color-secondary-950": string;
+        "--color-secondary-contrast-dark": string;
+        "--color-secondary-contrast-light": string;
+        "--color-secondary-contrast-50": string;
+        "--color-secondary-contrast-100": string;
+        "--color-secondary-contrast-200": string;
+        "--color-secondary-contrast-300": string;
+        "--color-secondary-contrast-400": string;
+        "--color-secondary-contrast-500": string;
+        "--color-secondary-contrast-600": string;
+        "--color-secondary-contrast-700": string;
+        "--color-secondary-contrast-800": string;
+        "--color-secondary-contrast-900": string;
+        "--color-secondary-contrast-950": string;
+        "--color-tertiary-50": string;
+        "--color-tertiary-100": string;
+        "--color-tertiary-200": string;
+        "--color-tertiary-300": string;
+        "--color-tertiary-400": string;
+        "--color-tertiary-500": string;
+        "--color-tertiary-600": string;
+        "--color-tertiary-700": string;
+        "--color-tertiary-800": string;
+        "--color-tertiary-900": string;
+        "--color-tertiary-950": string;
+        "--color-tertiary-contrast-dark": string;
+        "--color-tertiary-contrast-light": string;
+        "--color-tertiary-contrast-50": string;
+        "--color-tertiary-contrast-100": string;
+        "--color-tertiary-contrast-200": string;
+        "--color-tertiary-contrast-300": string;
+        "--color-tertiary-contrast-400": string;
+        "--color-tertiary-contrast-500": string;
+        "--color-tertiary-contrast-600": string;
+        "--color-tertiary-contrast-700": string;
+        "--color-tertiary-contrast-800": string;
+        "--color-tertiary-contrast-900": string;
+        "--color-tertiary-contrast-950": string;
+        "--color-success-50": string;
+        "--color-success-100": string;
+        "--color-success-200": string;
+        "--color-success-300": string;
+        "--color-success-400": string;
+        "--color-success-500": string;
+        "--color-success-600": string;
+        "--color-success-700": string;
+        "--color-success-800": string;
+        "--color-success-900": string;
+        "--color-success-950": string;
+        "--color-success-contrast-dark": string;
+        "--color-success-contrast-light": string;
+        "--color-success-contrast-50": string;
+        "--color-success-contrast-100": string;
+        "--color-success-contrast-200": string;
+        "--color-success-contrast-300": string;
+        "--color-success-contrast-400": string;
+        "--color-success-contrast-500": string;
+        "--color-success-contrast-600": string;
+        "--color-success-contrast-700": string;
+        "--color-success-contrast-800": string;
+        "--color-success-contrast-900": string;
+        "--color-success-contrast-950": string;
+        "--color-warning-50": string;
+        "--color-warning-100": string;
+        "--color-warning-200": string;
+        "--color-warning-300": string;
+        "--color-warning-400": string;
+        "--color-warning-500": string;
+        "--color-warning-600": string;
+        "--color-warning-700": string;
+        "--color-warning-800": string;
+        "--color-warning-900": string;
+        "--color-warning-950": string;
+        "--color-warning-contrast-dark": string;
+        "--color-warning-contrast-light": string;
+        "--color-warning-contrast-50": string;
+        "--color-warning-contrast-100": string;
+        "--color-warning-contrast-200": string;
+        "--color-warning-contrast-300": string;
+        "--color-warning-contrast-400": string;
+        "--color-warning-contrast-500": string;
+        "--color-warning-contrast-600": string;
+        "--color-warning-contrast-700": string;
+        "--color-warning-contrast-800": string;
+        "--color-warning-contrast-900": string;
+        "--color-warning-contrast-950": string;
+        "--color-error-50": string;
+        "--color-error-100": string;
+        "--color-error-200": string;
+        "--color-error-300": string;
+        "--color-error-400": string;
+        "--color-error-500": string;
+        "--color-error-600": string;
+        "--color-error-700": string;
+        "--color-error-800": string;
+        "--color-error-900": string;
+        "--color-error-950": string;
+        "--color-error-contrast-dark": string;
+        "--color-error-contrast-light": string;
+        "--color-error-contrast-50": string;
+        "--color-error-contrast-100": string;
+        "--color-error-contrast-200": string;
+        "--color-error-contrast-300": string;
+        "--color-error-contrast-400": string;
+        "--color-error-contrast-500": string;
+        "--color-error-contrast-600": string;
+        "--color-error-contrast-700": string;
+        "--color-error-contrast-800": string;
+        "--color-error-contrast-900": string;
+        "--color-error-contrast-950": string;
+        "--color-surface-50": string;
+        "--color-surface-100": string;
+        "--color-surface-200": string;
+        "--color-surface-300": string;
+        "--color-surface-400": string;
+        "--color-surface-500": string;
+        "--color-surface-600": string;
+        "--color-surface-700": string;
+        "--color-surface-800": string;
+        "--color-surface-900": string;
+        "--color-surface-950": string;
+        "--color-surface-contrast-dark": string;
+        "--color-surface-contrast-light": string;
+        "--color-surface-contrast-50": string;
+        "--color-surface-contrast-100": string;
+        "--color-surface-contrast-200": string;
+        "--color-surface-contrast-300": string;
+        "--color-surface-contrast-400": string;
+        "--color-surface-contrast-500": string;
+        "--color-surface-contrast-600": string;
+        "--color-surface-contrast-700": string;
+        "--color-surface-contrast-800": string;
+        "--color-surface-contrast-900": string;
+        "--color-surface-contrast-950": string;
+    };
+};
+export default rocket;

package/dist/types/utils/theme/theme-switcher.vue.d.ts

@@ -1,4 +1,4 @@
-import { CssClasses } from '@/index';
+import { type CssClasses } from '@/lib';
 declare const _default: import("vue").DefineComponent<{
     background: {
         type: () => CssClasses;
@@ -28,7 +28,11 @@ declare const _default: import("vue").DefineComponent<{
         type: () => CssClasses;
         default: string;
     };
-}, () => void, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    classListItemActive: {
+        type: () => CssClasses;
+        default: string;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     background: {
         type: () => CssClasses;
         default: string;
@@ -57,13 +61,18 @@ declare const _default: import("vue").DefineComponent<{
         type: () => CssClasses;
         default: string;
     };
+    classListItemActive: {
+        type: () => CssClasses;
+        default: string;
+    };
 }>>, {
-    background: string;
     text: string;
-    classButton: string;
+    background: string;
     widthPopup: string;
     heightList: string;
+    classButton: string;
     classList: string;
     classListItem: string;
-}>;
+    classListItemActive: string;
+}, {}>;
 export default _default;

package/dist/types/utils/theme/theme.service.d.ts

@@ -1,16 +1,13 @@
-import { Ref } from 'vue';
-import { Theme } from './themes';
+import type { Theme } from '@skeletonlabs/skeleton/themes';
+import { type Ref } from 'vue';
 declare const useTheme: () => {
     chosenTheme: Ref<Theme>;
-    themes: Theme[];
-    THEME: {
-        VUETIFUL: Theme;
-        ROCKET: Theme;
-    };
+    themes: Record<"vuetiful" | "rocket" | "catppuccin" | "cerberus" | "pine" | "rose", Theme>;
+    themeArray: Theme[];
     applyThemeSSR: (html: string, theme: Theme) => string;
-    applyTheme: (theme: Theme, callback?: Function | undefined) => void;
+    applyTheme: (theme: Theme, callback?: Function) => void;
     getThemeFromCookie: (cookies: string) => Theme;
-    initializeTheme: (callback?: Function | undefined) => void;
+    initializeTheme: (callback?: Function) => void;
     changeDataTheme: (name: string) => void;
     registerTheme: (theme: Theme) => void;
 };

package/dist/types/utils/theme/themes.d.ts

@@ -1,39 +1,3 @@
-import { ColorSettings } from '../colors/colors.service';
-export declare const themes: Array<Theme>;
-export declare const THEME: {
-    VUETIFUL: Theme;
-    ROCKET: Theme;
-};
-export interface Theme {
-    name: string;
-    gradients: Gradients;
-    colors: {
-        primary: ColorSettings;
-        secondary: ColorSettings;
-        tertiary: ColorSettings;
-        success: ColorSettings;
-        warning: ColorSettings;
-        error: ColorSettings;
-        surface: ColorSettings;
-    };
-    fonts: Fonts;
-    textColorLight: string;
-    textColorDark: string;
-    roundedBase: string;
-    roundedContainer: string;
-    borderBase: string;
-    customCss: string;
-    [key: string]: any;
-}
-export interface Fonts {
-    base: string;
-    customBase: string;
-    baseImports: string;
-    headings: string;
-    customHeadings: string;
-    headingImports: string;
-}
-export interface Gradients {
-    light: string;
-    dark: string;
-}
+import { type Theme } from '@skeletonlabs/skeleton/themes';
+export declare const themes: Record<'vuetiful' | 'rocket' | 'catppuccin' | 'cerberus' | 'pine' | 'rose', Theme>;
+export declare const themeArray: Array<Theme>;

package/dist/types/utils/theme/vuetiful.theme.d.ts

@@ -0,0 +1,224 @@
+declare const vuetiful: {
+    name: string;
+    properties: {
+        '--space-scale-factor': string;
+        '--type-scale-factor': string;
+        '--type-scale-1': string;
+        '--type-scale-2': string;
+        '--type-scale-3': string;
+        '--type-scale-4': string;
+        '--type-scale-5': string;
+        '--type-scale-6': string;
+        '--type-scale-7': string;
+        '--type-scale-8': string;
+        '--type-scale-9': string;
+        '--type-scale-10': string;
+        '--type-scale-11': string;
+        '--type-scale-12': string;
+        '--type-scale-13': string;
+        '--base-font-color': string;
+        '--base-font-color-dark': string;
+        '--base-font-family': string;
+        '--base-font-size': string;
+        '--base-line-height': string;
+        '--base-font-weight': string;
+        '--base-font-style': string;
+        '--base-letter-spacing': string;
+        '--heading-font-color': string;
+        '--heading-font-color-dark': string;
+        '--heading-font-family': string;
+        '--heading-font-weight': string;
+        '--heading-font-style': string;
+        '--heading-letter-spacing': string;
+        '--anchor-font-color': string;
+        '--anchor-font-color-dark': string;
+        '--anchor-font-family': string;
+        '--anchor-font-size': string;
+        '--anchor-line-height': string;
+        '--anchor-font-weight': string;
+        '--anchor-font-style': string;
+        '--anchor-letter-spacing': string;
+        '--anchor-text-decoration': string;
+        '--anchor-text-decoration-hover': string;
+        '--anchor-text-decoration-active': string;
+        '--anchor-text-decoration-focus': string;
+        '--body-background-color': string;
+        '--body-background-color-dark': string;
+        '--radii-default': string;
+        '--radii-container': string;
+        '--border-width-default': string;
+        '--ring-width-default': string;
+        '--outline-width-default': string;
+        '--divide-width-default': string;
+        '--color-primary-50': string;
+        '--color-primary-100': string;
+        '--color-primary-200': string;
+        '--color-primary-300': string;
+        '--color-primary-400': string;
+        '--color-primary-500': string;
+        '--color-primary-600': string;
+        '--color-primary-700': string;
+        '--color-primary-800': string;
+        '--color-primary-900': string;
+        '--color-primary-950': string;
+        '--color-primary-contrast-dark': string;
+        '--color-primary-contrast-light': string;
+        '--color-primary-contrast-50': string;
+        '--color-primary-contrast-100': string;
+        '--color-primary-contrast-200': string;
+        '--color-primary-contrast-300': string;
+        '--color-primary-contrast-400': string;
+        '--color-primary-contrast-500': string;
+        '--color-primary-contrast-600': string;
+        '--color-primary-contrast-700': string;
+        '--color-primary-contrast-800': string;
+        '--color-primary-contrast-900': string;
+        '--color-primary-contrast-950': string;
+        '--color-secondary-50': string;
+        '--color-secondary-100': string;
+        '--color-secondary-200': string;
+        '--color-secondary-300': string;
+        '--color-secondary-400': string;
+        '--color-secondary-500': string;
+        '--color-secondary-600': string;
+        '--color-secondary-700': string;
+        '--color-secondary-800': string;
+        '--color-secondary-900': string;
+        '--color-secondary-950': string;
+        '--color-secondary-contrast-dark': string;
+        '--color-secondary-contrast-light': string;
+        '--color-secondary-contrast-50': string;
+        '--color-secondary-contrast-100': string;
+        '--color-secondary-contrast-200': string;
+        '--color-secondary-contrast-300': string;
+        '--color-secondary-contrast-400': string;
+        '--color-secondary-contrast-500': string;
+        '--color-secondary-contrast-600': string;
+        '--color-secondary-contrast-700': string;
+        '--color-secondary-contrast-800': string;
+        '--color-secondary-contrast-900': string;
+        '--color-secondary-contrast-950': string;
+        '--color-tertiary-50': string;
+        '--color-tertiary-100': string;
+        '--color-tertiary-200': string;
+        '--color-tertiary-300': string;
+        '--color-tertiary-400': string;
+        '--color-tertiary-500': string;
+        '--color-tertiary-600': string;
+        '--color-tertiary-700': string;
+        '--color-tertiary-800': string;
+        '--color-tertiary-900': string;
+        '--color-tertiary-950': string;
+        '--color-tertiary-contrast-dark': string;
+        '--color-tertiary-contrast-light': string;
+        '--color-tertiary-contrast-50': string;
+        '--color-tertiary-contrast-100': string;
+        '--color-tertiary-contrast-200': string;
+        '--color-tertiary-contrast-300': string;
+        '--color-tertiary-contrast-400': string;
+        '--color-tertiary-contrast-500': string;
+        '--color-tertiary-contrast-600': string;
+        '--color-tertiary-contrast-700': string;
+        '--color-tertiary-contrast-800': string;
+        '--color-tertiary-contrast-900': string;
+        '--color-tertiary-contrast-950': string;
+        '--color-success-50': string;
+        '--color-success-100': string;
+        '--color-success-200': string;
+        '--color-success-300': string;
+        '--color-success-400': string;
+        '--color-success-500': string;
+        '--color-success-600': string;
+        '--color-success-700': string;
+        '--color-success-800': string;
+        '--color-success-900': string;
+        '--color-success-950': string;
+        '--color-success-contrast-dark': string;
+        '--color-success-contrast-light': string;
+        '--color-success-contrast-50': string;
+        '--color-success-contrast-100': string;
+        '--color-success-contrast-200': string;
+        '--color-success-contrast-300': string;
+        '--color-success-contrast-400': string;
+        '--color-success-contrast-500': string;
+        '--color-success-contrast-600': string;
+        '--color-success-contrast-700': string;
+        '--color-success-contrast-800': string;
+        '--color-success-contrast-900': string;
+        '--color-success-contrast-950': string;
+        '--color-warning-50': string;
+        '--color-warning-100': string;
+        '--color-warning-200': string;
+        '--color-warning-300': string;
+        '--color-warning-400': string;
+        '--color-warning-500': string;
+        '--color-warning-600': string;
+        '--color-warning-700': string;
+        '--color-warning-800': string;
+        '--color-warning-900': string;
+        '--color-warning-950': string;
+        '--color-warning-contrast-dark': string;
+        '--color-warning-contrast-light': string;
+        '--color-warning-contrast-50': string;
+        '--color-warning-contrast-100': string;
+        '--color-warning-contrast-200': string;
+        '--color-warning-contrast-300': string;
+        '--color-warning-contrast-400': string;
+        '--color-warning-contrast-500': string;
+        '--color-warning-contrast-600': string;
+        '--color-warning-contrast-700': string;
+        '--color-warning-contrast-800': string;
+        '--color-warning-contrast-900': string;
+        '--color-warning-contrast-950': string;
+        '--color-error-50': string;
+        '--color-error-100': string;
+        '--color-error-200': string;
+        '--color-error-300': string;
+        '--color-error-400': string;
+        '--color-error-500': string;
+        '--color-error-600': string;
+        '--color-error-700': string;
+        '--color-error-800': string;
+        '--color-error-900': string;
+        '--color-error-950': string;
+        '--color-error-contrast-dark': string;
+        '--color-error-contrast-light': string;
+        '--color-error-contrast-50': string;
+        '--color-error-contrast-100': string;
+        '--color-error-contrast-200': string;
+        '--color-error-contrast-300': string;
+        '--color-error-contrast-400': string;
+        '--color-error-contrast-500': string;
+        '--color-error-contrast-600': string;
+        '--color-error-contrast-700': string;
+        '--color-error-contrast-800': string;
+        '--color-error-contrast-900': string;
+        '--color-error-contrast-950': string;
+        '--color-surface-50': string;
+        '--color-surface-100': string;
+        '--color-surface-200': string;
+        '--color-surface-300': string;
+        '--color-surface-400': string;
+        '--color-surface-500': string;
+        '--color-surface-600': string;
+        '--color-surface-700': string;
+        '--color-surface-800': string;
+        '--color-surface-900': string;
+        '--color-surface-950': string;
+        '--color-surface-contrast-dark': string;
+        '--color-surface-contrast-light': string;
+        '--color-surface-contrast-50': string;
+        '--color-surface-contrast-100': string;
+        '--color-surface-contrast-200': string;
+        '--color-surface-contrast-300': string;
+        '--color-surface-contrast-400': string;
+        '--color-surface-contrast-500': string;
+        '--color-surface-contrast-600': string;
+        '--color-surface-contrast-700': string;
+        '--color-surface-contrast-800': string;
+        '--color-surface-contrast-900': string;
+        '--color-surface-contrast-950': string;
+    };
+    custom: string;
+};
+export default vuetiful;