vue2-comp-lib 1.0.3 → 1.0.5

package/src/assets/styles/themes/theme-light.css

@@ -1,166 +0,0 @@
-:root[data-theme="light"] {
-    --bg-color: #f4f5f9;
-    --text-color: #382153;
-
-    --color-text-default: var(--main-void-base);
-    --color-text-link: var(--main-skyblue-base);
-    --color-text-warning: var(--main-vivid-raspberry-base);
-    --color-text-subtlest: var(--neutral-silvergray);
-    --color-text-subtle: var(--neutral-darkgray);
-    --color-text-inverse: var(--neutral-white);
-    --color-text-link-presed: var(--main-skyblue-dark);
-    --color-text-accent-skyblue: var(--main-skyblue-base);
-    --color-text-accent-slatepurple: var(--main-slatepurple-base);
-    --color-text-accent-slatepurple-medium: var(--main-slatepurple-medium);
-    --color-text-accent-vividraspberry: var(--main-vivid-raspberry-base);
-    --color-text-accent-tangerine: var(--main-tangerine-base);
-    --color-text-accent-lemon: var(--main-lemon-base);
-    --color-text-accent-limegreen: var(--main-limegreen-base);
-    --color-text-accent-limegreen-medium: var(--main-limegreen-medium);
-    --color-text-accent-andromeda: var(--main-andromeda-base);
-    --color-text-accent-andromeda-medium: var(--main-andromeda-medium);
-    --color-text-accent-begonia: var(--main-begonia-medium);
-    --color-text-accent-eris: var(--main-other-eris);
-    --color-text-accent-shire: var(--main-other-shire);
-    --color-text-accent-mar: var(--main-other-mar);
-    --color-text-accent-dos: var(--main-other-dos);
-    --color-text-accent-void-light: var(--main-void-light);
-
-    --color-background-default: var(--neutral-luna);
-    --color-background-secondary: var(--neutral-white);
-    --color-background-overlay: var(--overlay-overlay);
-    --color-drop-shadow-default: var(--main-void-base);
-
-    --color-border-field-active: var(--neutral-silvergray);
-    --color-border-field-input: var(--main-skyblue-base);
-    --color-border-field-error: var(--main-vivid-raspberry-base);
-    --color-border-field-hover: var(--neutral-darkgray);
-    --color-border-field-focused: var(--main-vivid-raspberry-base);
-
-    --color-border-divider-table: var(--neutral-brightgray);
-    --color-border-divider: var(--neutral-brightgray);
-
-    --color-border-bold: var(--main-void-base);
-
-    --color-border-container-hover: var(--main-skyblue-base);
-
-    --color-border-accent-white: var(--neutral-white);
-    --color-border-accent-ghost: var(--neutral-ghost);
-    --color-border-accent-silvergray: var(--neutral-silvergray);
-    --color-border-accent-skyblue-base: var(--main-skyblue-base);
-    --color-border-accent-vividraspberry: var(--main-vivid-raspberry-base);
-    --color-border-accent-brightgray: var(--neutral-brightgray);
-
-    --color-skeleton-base: var(--neutral-brightgray);
-    --color-skeleton-dark: var(--neutral-silvergray);
-
-    --color-fill-field-active: var(--neutral-phantom);
-    --color-fill-field-hover: var(--neutral-white);
-    --color-fill-field-input: var(--neutral-white);
-
-    --color-fill-cell: var(--neutral-white);
-    --color-fill-cell-hover: var(--main-skyblue-light);
-
-    --color-fill-options-default: var(--neutral-white);
-    --color-fill-options-hover: var(--neutral-brightgray);
-    --color-fill-options-selected: var(--main-skyblue-light);
-
-    --color-fill-accent-limegreen: var(--main-limegreen-base);
-    --color-fill-accent-brightgray: var(--neutral-brightgray);
-    --color-fill-accent-darkgray: var(--neutral-darkgray);
-    --color-fill-accent-vividraspberry: var(--main-vivid-raspberry-base);
-    --color-fill-accent-silvergray: var(--neutral-silvergray);
-    --color-fill-accent-white: var(--neutral-white);
-    --color-fill-accent-skyblue: var(--main-skyblue-base);
-    --color-fill-accent-skyblue-medium: var(--main-skyblue-medium);
-    --color-fill-accent-slatepurple: var(--main-slatepurple-base);
-    --color-fill-accent-slatepurple-light: var(--main-slatepurple-light);
-    --color-fill-accent-ghost: var(--neutral-ghost);
-    --color-fill-accent-slatepurple-medium: var(--main-slatepurple-medium);
-    --color-fill-accent-vividraspberry-medium: var(--main-vivid-raspberry-medium);
-    --color-fill-accent-begonia: var(--main-begonia-base);
-
-    --color-fill-bold: var(--main-void-base);
-
-    --color-fill-topnav: var(--neutral-luna);
-    --color-fill-mainnav: var(--main-void-base);
-
-    --color-icon-default: var(--main-void-base);
-    --color-icon-white: var(--neutral-white);
-    --color-icon-skyblue-base: var(--main-skyblue-base);
-    --color-icon-slatepurple-base: var(--main-slatepurple-base);
-    --color-icon-vividrasbpberry-base: var(--main-vivid-raspberry-base);
-    --color-icon-tangerine-base: var(--main-tangerine-base:);
-    --color-icon-lemon-base: var(--main-lemon-base);
-    --color-icon-limegreen-base: var(--main-limegreen-base);
-    --color-icon-andromeda-base: var(--main-andromeda-base);
-    --color-icon-begonia-base: var(--main-begonia-medium);
-    --color-icon-eris: var(--main-other-eris);
-    --color-icon-shire: var(--main-other-shire);
-    --color-icon-mar: var(--main-other-mar);
-    --color-icon-dos: var(--main-other-dos);
-    --color-icon-phantom: var(--neutral-phantom);
-    --color-icon-brightgray: var(--neutral-brightgray);
-    --color-icon-ghost: var(--neutral-ghost);
-    --color-icon-silvergray: var(--neutral-silvergray);
-    --color-icon-darkgray: var(--neutral-darkgray);
-    --color-icon-void: var(--main-void-base);
-
-
-    /* Created new semantic colors */
-    --color-background-scrollbar: var(--neutral-brightgray);
-    --color-background-button-primary: var(--main-skyblue-base);
-    --color-background-button-primary-hover: var(--main-skyblue-dark);
-    --color-box-shadow-dropdown: var(--main-slatepurple-light);
-    --color-border-button-secondary: var(--main-skyblue-base);
-    --color-text-button-secondary: var(--main-skyblue-base);
-    --color-background-button-secondary-hover: var(--main-skyblue-base);
-    --color-text-button-secondary-hover: var(--neutral-white);
-    --color-border-button-alternate: var(--neutral-silvergray);
-    --color-background-button-close: var(--neutral-sideral);
-    --color-background-button-close-hover: var(--neutral-white);
-    --color-border-button-close: var(--neutral-white);
-    --color-border-button-close-hover: var(--main-vivid-raspberry-base);
-    --color-background-button-alternate-hover: var(--neutral-brightgray);
-    --color-text-accent-tangerine-medium: var(--main-tangerine-medium);
-    --color-fill-accent-tangerine-light: var(--main-tangerine-light);
-    --color-fill-accent-tangerine: var(--main-tangerine-base);
-    --color-fill-accent-tangerine-medium: var(--main-tangerine-medium);
-    --color-icon-tangerine-medium: var(--main-tangerine-medium);
-    --color-fill-accent-lemon: var(--main-lemon-base);
-    --color-fill-accent-other-mar: var(--main-other-mar);
-    --color-text-button-alternate: var(--main-void-base);
-    --color-text-accent-vader: var(--neutral-vader);
-    --color-fill-accent-vividraspberry-light: var(--main-vivid-raspberry-light);
-    --color-background-scrollbar-default: var(--neutral-silvergray);
-    --color-drop-shadow-topnav: var(--main-andromeda-light);
-    --color-border-button-cancel: var(--neutral-darkgray);
-    --color-border-button-cancel-hover: var(--neutral-brightgray);
-    --color-fill-accent-skyblue-special-use: var(--main-skyblue-special-use);
-    --color-fill-accent-skyblue-light: var(--main-skyblue-light);
-    --color-fill-accent-limegreen-light: var(--main-limegreen-light);
-    --color-background-button-row-action: var(--main-void-base);
-    --color-fill-cell-delete-overlay: var(--main-vivid-raspberry-light);
-    --color-fill-cell-delete: var(--main-vivid-raspberry-base);
-    --color-fill-cell-selected: var(--main-lemon-light);
-    --color-text-accent-ghost: var(--neutral-ghost);
-    --color-text-button-remove: var(--main-vivid-raspberry-base);
-    --color-background-button-remove-hover: var(--main-vivid-raspberry-light);
-    --color-text-button-primary: var(--neutral-white);
-    --color-background-button-delete-hover: var(--main-vivid-raspberry-medium);
-    --color-background-button-delete: var(--main-vivid-raspberry-base);
-    --color-border-accent-slatepurple: var(--main-slatepurple-base);
-    --color-background-button-other: var(--neutral-phantom);
-    --color-border-button-other: var(--neutral-ghost);
-    --color-border-button-other-hover: var(--neutral-darkgray);
-    --color-text-button-other: var(--main-skyblue-base);
-    --color-text-accent-andromeda-light: var(--main-andromeda-light);
-    --color-fill-accent-phantom: var(--neutral-phantom);
-    --color-main-skyblue-light: var(--main-skyblue-light);
-    --color-icon-begonia-base: var(--main-begonia-medium);
-    --color-fill-cell-transparent: #f8f5ffed;
-    --color-border-accent-limegreen: var(--main-limegreen-base);
-    --color-fill-accent-lemon-light: var(--main-lemon-light);
-    --color-border-accent-darkgray: var(--neutral-darkgray);
-    --color-background-button-hover: var(--neutral-ghost);
-}

package/src/assets/styles/themes/themes.css

@@ -1,2 +0,0 @@
-@import './primitives.css';
-@import './theme-light.css';

package/src/components/app-button-v2/app-button-v2.vue

@@ -1,512 +0,0 @@
-<template>
-    <button
-        :type="type"
-        :disabled="disabled || loading"
-        class="app-button-v2"
-        :class="[
-            !unstyled ? variantClass : null,
-            !unstyled ? colorClass : null,
-        ]"
-        :style="buttonStyle"
-        v-bind="$attrs"
-        v-on="$listeners"
-    >
-        <span class="app-button-v2-label">
-            <slot />
-            <app-loading-dots
-                v-if="loading"
-                :fill="loadingIconFill"
-                :size="loadingIconSize"
-                :dot-size="loadingIconDotSize"
-                class="app-button-v2-loading-icon"
-            />
-        </span>
-    </button>
-</template>
-
-<script setup lang="ts">
-import { computed } from 'vue';
-import AppLoadingDots from '@/components/app-loading-dots/app-loading-dots.vue';
-
-export type AppButtonV2Type = HTMLButtonElement['type'];
-
-export type AppButtonV2Variant = 'primary' | 'secondary';
-
-export type AppButtonV2Color =
-    | 'sky-blue'
-    | 'slate-purple'
-    | 'ghost'
-    | 'vivid-raspberry'
-    | 'neptune'
-    | 'supernova'
-    | 'sea-foam'
-    | 'white'
-    | 'show-more'
-    | 'phantom';
-
-interface Props {
-    type?: AppButtonV2Type;
-    variant?: AppButtonV2Variant;
-    color?: AppButtonV2Color;
-    disabled?: boolean;
-    loading?: boolean;
-    loadingIconFill?: string;
-    loadingIconSize?: string;
-    loadingIconDotSize?: string;
-    gap?: string;
-    unstyled?: boolean;
-}
-
-const props = withDefaults(defineProps<Props>(), {
-    type: 'button',
-    variant: 'primary',
-    color: 'sky-blue',
-    disabled: false,
-    loading: false,
-    loadingIconFill: 'currentColor',
-    loadingIconSize: '16px',
-    loadingIconDotSize: '8px',
-    gap: '8px',
-    unstyled: false,
-});
-
-const variantClass = computed(() => `app-button-${props.variant}`);
-
-const colorClass = computed(() => `app-button-${props.color}`);
-
-const buttonStyle = computed(
-    () =>
-        ({
-            '--app-button-v2-gap': props.gap,
-        }) as Record<string, string>,
-);
-</script>
-
-<style scoped>
-button.app-button-v2 {
-    color: var(--app-button-v2-text-color);
-}
-
-.app-button-v2 {
-    --app-button-v2-background-color: unset;
-    --app-button-v2-text-color: unset;
-    --app-button-v2-outline-color: unset;
-    --app-button-v2-outline-width: 0px;
-    --app-button-v2-border-width: 2px;
-    --app-button-v2-border-color: unset;
-    --app-button-v2-padding-x: 24px;
-    --app-button-v2-padding-y: 10px;
-    --app-button-v2-padding-offset: -2px;
-    --app-button-v2-border-radius: 60px;
-    --app-button-v2-transition: 300ms ease-out;
-
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: calc(
-            var(--app-button-v2-padding-y) + var(--app-button-v2-padding-offset)
-        )
-        calc(
-            var(--app-button-v2-padding-x) + var(--app-button-v2-padding-offset)
-        );
-    border-radius: var(--app-button-v2-border-radius);
-    font-size: 14px;
-    font-weight: 500;
-    border: var(--app-button-v2-border-width) solid
-        var(--app-button-v2-border-color);
-    background: var(--app-button-v2-background-color);
-    outline: var(--app-button-v2-outline-width) solid
-        var(--app-button-v2-outline-color);
-    outline-offset: 1px;
-    opacity: 1;
-    z-index: 0;
-
-    transition:
-        background var(--app-button-v2-transition),
-        color var(--app-button-v2-transition),
-        border var(--app-button-v2-transition),
-        opacity var(--app-button-v2-transition);
-
-    > * {
-        z-index: 1;
-    }
-}
-
-.app-button-v2 .app-button-v2-label {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    gap: var(--app-button-v2-gap);
-}
-
-.app-button-v2:disabled {
-    opacity: 0.4;
-}
-
-.app-button-v2:focus {
-    /* Currently disabled because no other standard components have focus styles */
-    --app-button-v2-outline-width: 0px;
-}
-
-/* Gradient Buttons Base Styles */
-.app-button-v2.app-button-primary.app-button-neptune,
-.app-button-v2.app-button-primary.app-button-supernova {
-    --app-button-v2-padding-offset: -2px;
-}
-
-.app-button-v2.app-button-primary.app-button-neptune,
-.app-button-v2.app-button-primary.app-button-supernova,
-.app-button-v2.app-button-primary.app-button-sea-foam {
-    &::after {
-        content: '';
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        border-radius: inherit;
-        opacity: 0;
-        z-index: 0;
-
-        transition: opacity var(--app-button-v2-transition);
-    }
-
-    &:not(:disabled):hover::after {
-        opacity: 1;
-    }
-}
-
-/* Primary */
-
-/* Sky Blue */
-
-.app-button-v2.app-button-primary.app-button-sky-blue {
-    --app-button-v2-background-color: var(
-        --color-background-button-primary-sky-blue
-    );
-    --app-button-v2-text-color: var(--color-text-button-primary-sky-blue);
-    --app-button-v2-border-color: var(--color-border-button-primary-sky-blue);
-
-    &:not(:disabled):hover {
-        --app-button-v2-background-color: var(
-            --color-background-button-hover-primary-sky-blue
-        );
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-primary-sky-blue
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-primary-sky-blue
-        );
-    }
-}
-
-/* Slate Purple */
-
-.app-button-v2.app-button-primary.app-button-slate-purple {
-    --app-button-v2-background-color: var(
-        --color-background-button-primary-slate-purple
-    );
-    --app-button-v2-text-color: var(--color-text-button-primary-slate-purple);
-    --app-button-v2-border-color: var(
-        --color-border-button-primary-slate-purple
-    );
-
-    &:not(:disabled):hover {
-        --app-button-v2-background-color: var(
-            --color-background-button-hover-primary-slate-purple
-        );
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-primary-slate-purple
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-primary-slate-purple
-        );
-    }
-}
-
-/* Ghost */
-
-.app-button-v2.app-button-primary.app-button-ghost {
-    --app-button-v2-background-color: var(
-        --color-background-button-primary-ghost
-    );
-    --app-button-v2-text-color: var(--color-text-button-primary-ghost);
-    --app-button-v2-border-color: var(--color-border-button-primary-ghost);
-
-    &:not(:disabled):hover {
-        --app-button-v2-background-color: var(
-            --color-background-button-hover-primary-ghost
-        );
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-primary-ghost
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-primary-ghost
-        );
-    }
-}
-
-/* Vivid Raspberry */
-
-.app-button-v2.app-button-primary.app-button-vivid-raspberry {
-    --app-button-v2-background-color: var(
-        --color-background-button-primary-vivid-raspberry
-    );
-    --app-button-v2-text-color: var(
-        --color-text-button-primary-vivid-raspberry
-    );
-    --app-button-v2-border-color: var(
-        --color-border-button-primary-vivid-raspberry
-    );
-
-    &:not(:disabled):hover {
-        --app-button-v2-background-color: var(
-            --color-background-button-hover-primary-vivid-raspberry
-        );
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-primary-vivid-raspberry
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-primary-vivid-raspberry
-        );
-    }
-}
-
-/* Neptune */
-
-.app-button-v2.app-button-primary.app-button-neptune {
-    --app-button-v2-background-color: var(
-        --color-background-button-primary-neptune
-    );
-    --app-button-v2-text-color: var(--color-text-button-primary-neptune);
-    --app-button-v2-border-color: var(--color-border-button-primary-neptune);
-
-    &:not(:disabled):hover {
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-primary-neptune
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-primary-neptune
-        );
-    }
-
-    &::after {
-        background: var(--color-background-button-hover-primary-neptune);
-    }
-}
-
-/* Supernova */
-
-.app-button-v2.app-button-primary.app-button-supernova {
-    --app-button-v2-background-color: var(
-        --color-background-button-primary-supernova
-    );
-    --app-button-v2-text-color: var(--color-text-button-primary-supernova);
-    --app-button-v2-border-color: var(--color-border-button-primary-supernova);
-
-    &:not(:disabled):hover {
-        --app-button-v2-background-color: var(
-            --color-background-button-hover-primary-supernova
-        );
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-primary-supernova
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-primary-supernova
-        );
-    }
-
-    &::after {
-        background: var(--color-background-button-hover-primary-supernova);
-    }
-}
-
-/* Sea Foam */
-
-.app-button-v2.app-button-primary.app-button-sea-foam {
-    --app-button-v2-background-color: var(
-        --color-background-button-primary-sea-foam
-    );
-    --app-button-v2-text-color: var(--color-text-button-primary-sea-foam);
-    --app-button-v2-border-color: var(--color-border-button-primary-sea-foam);
-
-    --app-button-v2-border-width: 0px;
-    --app-button-v2-padding-offset: 0px;
-
-    &:not(:disabled):hover {
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-primary-sea-foam
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-primary-sea-foam
-        );
-    }
-
-    &::after {
-        background: var(--color-background-button-hover-primary-sea-foam);
-    }
-}
-
-/* White */
-
-.app-button-v2.app-button-primary.app-button-white {
-    --app-button-v2-background-color: var(
-        --color-background-button-primary-white
-    );
-    --app-button-v2-text-color: var(--color-text-button-primary-white);
-    --app-button-v2-border-color: var(--color-border-button-primary-white);
-
-    &:not(:disabled):hover {
-        --app-button-v2-background-color: var(
-            --color-background-button-hover-primary-white
-        );
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-primary-white
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-primary-white
-        );
-    }
-}
-
-/* Secondary */
-
-/* Sky Blue */
-
-.app-button-v2.app-button-secondary.app-button-sky-blue {
-    --app-button-v2-background-color: var(
-        --color-background-button-secondary-sky-blue
-    );
-    --app-button-v2-text-color: var(--color-text-button-secondary-sky-blue);
-    --app-button-v2-border-color: var(--color-border-button-secondary-sky-blue);
-
-    &:not(:disabled):hover {
-        --app-button-v2-background-color: var(
-            --color-background-button-hover-secondary-sky-blue
-        );
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-secondary-sky-blue
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-secondary-sky-blue
-        );
-    }
-}
-
-/* White */
-
-.app-button-v2.app-button-secondary.app-button-white {
-    --app-button-v2-background-color: var(
-        --color-background-button-secondary-white
-    );
-    --app-button-v2-text-color: var(--color-text-button-secondary-white);
-    --app-button-v2-border-color: var(--color-border-button-secondary-white);
-
-    &:not(:disabled):hover {
-        --app-button-v2-background-color: var(
-            --color-background-button-hover-secondary-white
-        );
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-secondary-white
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-secondary-white
-        );
-    }
-}
-
-/* Ghost */
-
-.app-button-v2.app-button-secondary.app-button-ghost {
-    --app-button-v2-background-color: var(
-        --color-background-button-secondary-ghost
-    );
-    --app-button-v2-text-color: var(--color-text-button-secondary-ghost);
-    --app-button-v2-border-color: var(--color-border-button-secondary-ghost);
-
-    &:not(:disabled):hover {
-        --app-button-v2-background-color: var(
-            --color-background-button-hover-secondary-ghost
-        );
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-secondary-ghost
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-secondary-ghost
-        );
-    }
-}
-
-/* Show More */
-
-.app-button-v2.app-button-secondary.app-button-show-more {
-    --app-button-v2-background-color: var(
-        --color-background-button-secondary-show-more
-    );
-    --app-button-v2-text-color: var(--color-text-button-secondary-show-more);
-    --app-button-v2-border-color: var(
-        --color-border-button-secondary-show-more
-    );
-
-    &:not(:disabled):hover {
-        --app-button-v2-background-color: var(
-            --color-background-button-hover-secondary-show-more
-        );
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-secondary-show-more
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-secondary-show-more
-        );
-    }
-}
-
-/* Vivid Raspberry */
-
-.app-button-v2.app-button-secondary.app-button-vivid-raspberry {
-    --app-button-v2-background-color: var(
-        --color-background-button-secondary-vivid-raspberry
-    );
-    --app-button-v2-text-color: var(
-        --color-text-button-secondary-vivid-raspberry
-    );
-    --app-button-v2-border-color: var(
-        --color-border-button-secondary-vivid-raspberry
-    );
-
-    &:not(:disabled):hover {
-        --app-button-v2-background-color: var(
-            --color-background-button-hover-secondary-vivid-raspberry
-        );
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-secondary-vivid-raspberry
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-secondary-vivid-raspberry
-        );
-    }
-}
-
-/* Phantom */
-
-.app-button-v2.app-button-secondary.app-button-phantom {
-    --app-button-v2-background-color: var(
-        --color-background-button-secondary-phantom
-    );
-    --app-button-v2-text-color: var(--color-text-button-secondary-phantom);
-    --app-button-v2-border-color: var(--color-border-button-secondary-phantom);
-
-    &:not(:disabled):hover {
-        --app-button-v2-background-color: var(
-            --color-background-button-hover-secondary-phantom
-        );
-        --app-button-v2-text-color: var(
-            --color-text-button-hover-secondary-phantom
-        );
-        --app-button-v2-border-color: var(
-            --color-border-button-hover-secondary-phantom
-        );
-    }
-}
-</style>

package/src/components/app-button-v2/index.ts

@@ -1 +0,0 @@
-export { default as AppButtonV2 } from './app-button-v2.vue';