@privyid/persona 0.10.0 → 0.11.0

package/dist/components/pdf-viewer/PdfViewer.vue.d.ts

@@ -15,7 +15,7 @@ declare const _default: import("vue-demi").DefineComponent<{
     };
     password: {
         type: StringConstructor;
-        default: any;
+        default: undefined;
     };
     layout: {
         type: PropType<LayoutVariant>;
@@ -34,13 +34,13 @@ declare const _default: import("vue-demi").DefineComponent<{
     pdfScale: import("vue-demi").Ref<number>;
     classNames: import("vue-demi").ComputedRef<string[]>;
     totalPage: import("vue-demi").ComputedRef<number>;
-    openDoc: (url: string, password?: string) => Promise<void>;
+    openDoc: (url: string, password?: string | undefined) => Promise<void>;
     closeDoc: () => Promise<void>;
-    pdfDoc: import("vue-demi").ShallowRef<import("pdfjs-dist/types/src/display/api").PDFDocumentProxy>;
-    pdfJS: import("vue-demi").ShallowRef<typeof import("pdfjs-dist")>;
+    pdfDoc: import("vue-demi").ShallowRef<import("pdfjs-dist/types/src/display/api").PDFDocumentProxy | undefined>;
+    pdfJS: import("vue-demi").ShallowRef<typeof import("pdfjs-dist") | undefined>;
     idle: import("vue-demi").Ref<boolean>;
     loading: import("vue-demi").WritableComputedRef<boolean>;
-    error: import("vue-demi").ShallowRef<Error>;
+    error: import("vue-demi").ShallowRef<Error | undefined>;
 }, unknown, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, ("error" | "update:page" | "ready" | "loaded" | "error-password" | "update:scale")[], "error" | "update:page" | "ready" | "loaded" | "error-password" | "update:scale", import("vue-demi").VNodeProps & import("vue-demi").AllowedComponentProps & import("vue-demi").ComponentCustomProps, Readonly<import("vue-demi").ExtractPropTypes<{
     src: {
         type: StringConstructor;
@@ -56,7 +56,7 @@ declare const _default: import("vue-demi").DefineComponent<{
     };
     password: {
         type: StringConstructor;
-        default: any;
+        default: undefined;
     };
     layout: {
         type: PropType<LayoutVariant>;
@@ -71,12 +71,12 @@ declare const _default: import("vue-demi").DefineComponent<{
         default: number;
     };
 }>> & {
-    onError?: (...args: any[]) => any;
-    "onUpdate:page"?: (...args: any[]) => any;
-    onReady?: (...args: any[]) => any;
-    onLoaded?: (...args: any[]) => any;
-    "onError-password"?: (...args: any[]) => any;
-    "onUpdate:scale"?: (...args: any[]) => any;
+    onError?: ((...args: any[]) => any) | undefined;
+    "onUpdate:page"?: ((...args: any[]) => any) | undefined;
+    onReady?: ((...args: any[]) => any) | undefined;
+    onLoaded?: ((...args: any[]) => any) | undefined;
+    "onError-password"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:scale"?: ((...args: any[]) => any) | undefined;
 }, {
     src: string;
     layout: LayoutVariant;

package/dist/components/pdf-viewer/index.d.ts

@@ -1,5 +1,5 @@
 import { InjectionKey, Ref } from 'vue-demi';
-export declare type LayoutVariant = 'fixed' | 'fit';
+export type LayoutVariant = 'fixed' | 'fit';
 export interface PdfViewerContext {
     page: Ref<number>;
     scale: Ref<number>;

package/dist/components/pdf-viewer/utils/use-viewer.d.ts

@@ -7,16 +7,16 @@ export declare function useViewer(container: Ref<HTMLDivElement>, viewer: Ref<HT
     scale: Ref<number>;
     totalPage: import("vue-demi").ComputedRef<number>;
     loading: import("vue-demi").WritableComputedRef<boolean>;
-    error: import("vue-demi").ShallowRef<Error>;
+    error: import("vue-demi").ShallowRef<Error | undefined>;
     ready: import("vue-demi").ShallowRef<boolean>;
     openDoc: (url: string, password?: string) => Promise<void>;
     closeDoc: () => Promise<void>;
-    pdfDoc: import("vue-demi").ShallowRef<import("pdfjs-dist/types/src/display/api").PDFDocumentProxy>;
-    pdfEventBus: import("vue-demi").ShallowRef<EventBus>;
-    pdfViewer: import("vue-demi").ShallowRef<PDFViewer>;
-    pdfLoadingTask: import("vue-demi").ShallowRef<import("pdfjs-dist/types/src/display/api").PDFDocumentLoadingTask>;
-    pdfLinkService: import("vue-demi").ShallowRef<PDFLinkService>;
-    pdfJS: import("vue-demi").ShallowRef<typeof PDFJS>;
+    pdfDoc: import("vue-demi").ShallowRef<import("pdfjs-dist/types/src/display/api").PDFDocumentProxy | undefined>;
+    pdfEventBus: import("vue-demi").ShallowRef<EventBus | undefined>;
+    pdfViewer: import("vue-demi").ShallowRef<PDFViewer | undefined>;
+    pdfLoadingTask: import("vue-demi").ShallowRef<import("pdfjs-dist/types/src/display/api").PDFDocumentLoadingTask | undefined>;
+    pdfLinkService: import("vue-demi").ShallowRef<PDFLinkService | undefined>;
+    pdfJS: import("vue-demi").ShallowRef<typeof PDFJS | undefined>;
     onLoaded: import("@vueuse/shared").EventHookOn<import("pdfjs-dist/types/src/display/api").PDFDocumentProxy>;
     onError: import("@vueuse/shared").EventHookOn<Error>;
     onReady: import("@vueuse/shared").EventHookOn<PDFViewer>;

package/dist/components/progress/Progress.vue

@@ -76,6 +76,11 @@ export default defineComponent({
 
 <style lang="postcss">
 .progress {
+  --p-bg-bar-active-state: theme(backgroundColor.info.emphasis);
+  --p-bg-bar-normal-state: theme(backgroundColor.subtle.DEFAULT);
+  --p-bg-dark-bar-active-state: theme(backgroundColor.dark.info.emphasis);
+  --p-bg-dark-bar-normal-state: theme(backgroundColor.dark.subtle.DEFAULT);
+
   &__items {
     @apply flex overflow-hidden;
   }
@@ -93,16 +98,19 @@ export default defineComponent({
   }
 
   &__point {
-    @apply w-7 h-7 rounded-full bg-muted flex items-center justify-center text-default;
+    @apply w-7 h-7 rounded-full bg-subtle flex items-center justify-center text-default;
+    @apply dark:bg-dark-subtle dark:text-dark-default;
   }
 
   &__bar {
     @apply absolute rounded-full transition-[background-position] ease-linear duration-150;
-    @apply from-[theme(backgroundColor.accent.emphasis)_50%] to-[theme(backgroundColor.muted)_50%];
+    @apply from-[var(--p-bg-bar-active-state)_50%] to-[var(--p-bg-bar-normal-state)_50%];
+    @apply dark:from-[var(--p-bg-dark-bar-active-state)_50%] dark:to-[var(--p-bg-dark-bar-normal-state)_50%];
   }
 
   &__title {
     @apply truncate text-sm text-center w-full text-default;
+    @apply dark:text-dark-default;
   }
 
   & > .progress__title {
@@ -111,7 +119,8 @@ export default defineComponent({
 
   &--active {
     .progress__point {
-      @apply bg-accent-emphasis text-on-emphasis;
+      @apply bg-info-emphasis text-state-emphasis;
+      @apply dark:bg-dark-info-emphasis dark:text-dark-state-emphasis;
     }
   }
 
@@ -127,8 +136,7 @@ export default defineComponent({
     }
 
     .progress__bar {
-      @apply w-[calc(100%_-_3rem)] h-1 top-5 right-[calc(50%_+_1.5rem)];
-      @apply bg-gradient-to-r bg-[length:210%_100%] bg-right;
+      @apply w-[calc(100%_-_3rem)] h-1 top-5 right-[calc(50%_+_1.5rem)] bg-gradient-to-r bg-[length:210%_100%] bg-right;
     }
 
     .progress--active + .progress--active {
@@ -154,8 +162,7 @@ export default defineComponent({
     }
 
     .progress__bar {
-      @apply h-[calc(100%_-_4.25rem)] w-1 bottom-[calc(50%_+_2.25rem)] left-1/2 -translate-x-1/2;
-      @apply bg-gradient-to-b bg-bottom bg-[length:100%_210%];
+      @apply h-[calc(100%_-_4.25rem)] w-1 bottom-[calc(50%_+_2.25rem)] left-1/2 -translate-x-1/2 bg-gradient-to-b bg-bottom bg-[length:100%_210%];
     }
 
     .progress--active + .progress--active {
@@ -168,6 +175,7 @@ export default defineComponent({
   &--dot {
     .progress__point-item {
       @apply w-3 h-3 rounded-full bg-default;
+      @apply dark:bg-dark-default;
     }
   }
 

package/dist/components/progress/Progress.vue.d.ts

@@ -1,6 +1,6 @@
 import { PropType, Slots } from 'vue-demi';
-export declare type IconVariant = 'dot' | 'counter';
-export declare type TitleVariant = 'specific' | 'general';
+export type IconVariant = 'dot' | 'counter';
+export type TitleVariant = 'specific' | 'general';
 interface ProgressLabel {
     title: string;
     slots: Slots;

package/dist/components/radio/Radio.vue

@@ -146,9 +146,11 @@ export default defineComponent({
   */
   &__icon {
     @apply w-5 h-5 border rounded-full border-subtle inline-flex items-center justify-center bg-default;
+    @apply dark:border-dark-subtle dark:bg-dark-default;
 
     > svg {
       @apply w-3 fill-default;
+      @apply dark:fill-dark-default;
     }
   }
 
@@ -157,6 +159,7 @@ export default defineComponent({
   */
   &__label {
     @apply text-default;
+    @apply dark:text-dark-default;
   }
 
   /**
@@ -167,28 +170,32 @@ export default defineComponent({
 
     &:not(.radio--checked) {
       .radio__icon {
-        @apply bg-inactive border-subtle;
+        @apply bg-subtle border-subtle;
+        @apply dark:bg-dark-subtle dark:border-dark-subtle;
 
         > svg {
-          @apply fill-inactive;
+          @apply fill-subtle;
+          @apply dark:fill-dark-subtle;
         }
       }
     }
   }
 
   /**
-  * give accent background and
+  * give info background and
   * white checked icon
   */
   &&--checked {
     .radio__icon {
-      @apply bg-accent-emphasis border-accent-emphasis;
+      @apply bg-info-emphasis border-info-emphasis;
+      @apply dark:bg-dark-info-emphasis dark:border-dark-info-emphasis;
     }
 
     &.radio--checkbox {
       .radio__icon {
         > svg {
           @apply fill-default;
+          @apply dark:fill-dark-inverse;
         }
       }
     }
@@ -227,10 +234,12 @@ export default defineComponent({
 
     &.radio--checked {
       .radio__icon {
-        @apply text-accent visible;
+        @apply text-info visible;
+        @apply dark:text-dark-info;
 
         > svg {
-          @apply fill-accent-emphasis;
+          @apply fill-info-emphasis;
+          @apply dark:fill-dark-info-emphasis;
         }
       }
     }
@@ -251,6 +260,7 @@ export default defineComponent({
     &.radio--disabled {
       .card {
         @apply bg-subtle hover:shadow-none hover:cursor-default;
+        @apply dark:bg-dark-subtle;
       }
     }
   }
@@ -279,6 +289,7 @@ export default defineComponent({
     &:hover,
     &:focus-visible {
       @apply bg-subtle;
+      @apply dark:bg-dark-subtle;
     }
   }
 }

package/dist/components/radio/Radio.vue.d.ts

@@ -3,18 +3,18 @@ export interface ChangedInteface {
     value: any;
     state: boolean;
 }
-declare type AppearanceType = 'radio' | 'checkbox' | 'option' | 'none';
+type AppearanceType = 'radio' | 'checkbox' | 'option' | 'none';
 declare const _default: import("vue-demi").DefineComponent<{
     name: {
         type: StringConstructor;
         default: string;
     };
     modelValue: {
-        type: (NumberConstructor | ObjectConstructor | StringConstructor | ArrayConstructor | BooleanConstructor | DateConstructor)[];
+        type: (NumberConstructor | StringConstructor | ArrayConstructor | ObjectConstructor | BooleanConstructor | DateConstructor)[];
         default: boolean;
     };
     value: {
-        type: (NumberConstructor | ObjectConstructor | StringConstructor | ArrayConstructor | BooleanConstructor | DateConstructor)[];
+        type: (NumberConstructor | StringConstructor | ArrayConstructor | ObjectConstructor | BooleanConstructor | DateConstructor)[];
         default: boolean;
     };
     checked: {
@@ -43,11 +43,11 @@ declare const _default: import("vue-demi").DefineComponent<{
         default: string;
     };
     modelValue: {
-        type: (NumberConstructor | ObjectConstructor | StringConstructor | ArrayConstructor | BooleanConstructor | DateConstructor)[];
+        type: (NumberConstructor | StringConstructor | ArrayConstructor | ObjectConstructor | BooleanConstructor | DateConstructor)[];
         default: boolean;
     };
     value: {
-        type: (NumberConstructor | ObjectConstructor | StringConstructor | ArrayConstructor | BooleanConstructor | DateConstructor)[];
+        type: (NumberConstructor | StringConstructor | ArrayConstructor | ObjectConstructor | BooleanConstructor | DateConstructor)[];
         default: boolean;
     };
     checked: {
@@ -67,13 +67,13 @@ declare const _default: import("vue-demi").DefineComponent<{
         default: string;
     };
 }>> & {
-    onChange?: (...args: any[]) => any;
-    "onUpdate:modelValue"?: (...args: any[]) => any;
+    onChange?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    value: string | number | boolean | unknown[] | Record<string, any> | Date;
+    value: string | number | boolean | unknown[] | Date | Record<string, any>;
     name: string;
+    modelValue: string | number | boolean | unknown[] | Date | Record<string, any>;
     disabled: boolean;
-    modelValue: string | number | boolean | unknown[] | Record<string, any> | Date;
     readonly: boolean;
     checked: boolean;
     appearance: AppearanceType;

package/dist/components/radio/index.d.ts

@@ -1,3 +1,3 @@
 import type { CheckboxProps } from '../checkbox';
-export declare type RadioProps = Omit<CheckboxProps, 'uncheckedValue'>;
+export type RadioProps = Omit<CheckboxProps, 'uncheckedValue'>;
 export declare function useVModel(props: RadioProps): import("vue-demi").WritableComputedRef<boolean>;

package/dist/components/select/Select.vue

@@ -253,10 +253,17 @@ export default defineComponent({
 .select {
   &__search {
     @apply pr-8 truncate hover:cursor-default focus:cursor-text;
+
+    .state--error &,
+    .select--error & {
+        @apply border-danger-emphasis hover:border-danger-emphasis focus:ring-danger focus:border-danger-emphasis;
+        @apply dark:border-dark-danger-emphasis hover:dark:border-dark-danger-emphasis focus:dark:ring-dark-danger focus:dark:border-dark-danger-emphasis;
+    }
   }
 
   &__caret {
     @apply absolute right-3 top-0 bottom-0 my-auto transition-transform duration-150 text-subtle pointer-events-none;
+    @apply dark:text-dark-subtle;
   }
 
   &__option {
@@ -267,7 +274,8 @@ export default defineComponent({
     }
 
     &-checked {
-      @apply flex-shrink-0 text-accent invisible;
+      @apply flex-shrink-0 text-info invisible;
+      @apply dark:text-dark-info;
 
       .selected & {
         @apply visible;
@@ -278,6 +286,7 @@ export default defineComponent({
   &__empty,
   &__loading {
     @apply px-3 py-2 text-default text-center;
+    @apply dark:text-dark-default;
   }
 
   &__loading {

package/dist/components/select/Select.vue.d.ts

@@ -4,19 +4,19 @@ import { Adapter } from './adapter/adapter';
 import { SizeVariant } from '../button';
 declare const _default: import("vue-demi").DefineComponent<{
     modelValue: {
-        type: (NumberConstructor | ObjectConstructor | StringConstructor | ArrayConstructor | BooleanConstructor | DateConstructor)[];
+        type: (NumberConstructor | StringConstructor | ArrayConstructor | ObjectConstructor | BooleanConstructor | DateConstructor)[];
         default: string;
     };
     selected: {
         type: PropType<SelectItem>;
         default: () => {
             text: string;
-            value: any;
+            value: undefined;
         };
     };
     options: {
         type: PropType<string[] | SelectItem[]>;
-        default: () => any[];
+        default: () => never[];
     };
     placeholder: {
         type: StringConstructor;
@@ -62,19 +62,19 @@ declare const _default: import("vue-demi").DefineComponent<{
     isSelected: (item: SelectItem) => boolean;
 }, unknown, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, ("change" | "update:modelValue" | "update:selected" | "userInput")[], "change" | "update:modelValue" | "update:selected" | "userInput", import("vue-demi").VNodeProps & import("vue-demi").AllowedComponentProps & import("vue-demi").ComponentCustomProps, Readonly<import("vue-demi").ExtractPropTypes<{
     modelValue: {
-        type: (NumberConstructor | ObjectConstructor | StringConstructor | ArrayConstructor | BooleanConstructor | DateConstructor)[];
+        type: (NumberConstructor | StringConstructor | ArrayConstructor | ObjectConstructor | BooleanConstructor | DateConstructor)[];
         default: string;
     };
     selected: {
         type: PropType<SelectItem>;
         default: () => {
             text: string;
-            value: any;
+            value: undefined;
         };
     };
     options: {
         type: PropType<string[] | SelectItem[]>;
-        default: () => any[];
+        default: () => never[];
     };
     placeholder: {
         type: StringConstructor;
@@ -109,15 +109,15 @@ declare const _default: import("vue-demi").DefineComponent<{
         default: string;
     };
 }>> & {
-    onChange?: (...args: any[]) => any;
-    "onUpdate:modelValue"?: (...args: any[]) => any;
-    "onUpdate:selected"?: (...args: any[]) => any;
-    onUserInput?: (...args: any[]) => any;
+    onChange?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:selected"?: ((...args: any[]) => any) | undefined;
+    onUserInput?: ((...args: any[]) => any) | undefined;
 }, {
     error: boolean;
     size: SizeVariant;
+    modelValue: string | number | boolean | unknown[] | Date | Record<string, any>;
     disabled: boolean;
-    modelValue: string | number | boolean | unknown[] | Record<string, any> | Date;
     readonly: boolean;
     adapter: Adapter;
     options: string[] | SelectItem[];

package/dist/components/select/adapter/async-adapter.d.ts

@@ -1,5 +1,5 @@
 import { SelectItem } from '..';
 import { watch } from 'vue-demi';
-export declare type LoadFn = (keyword: string, page: number, perPage: number) => Promise<SelectItem[]>;
-export declare type WatchDeps = Parameters<typeof watch>[0];
+export type LoadFn = (keyword: string, page: number, perPage: number) => Promise<SelectItem[]>;
+export type WatchDeps = Parameters<typeof watch>[0];
 export default function defineAsyncAdapter(loadFn: LoadFn, deps?: WatchDeps): import("./adapter").Adapter;

package/dist/components/sidebar/Sidebar.vue

@@ -1,6 +1,7 @@
 <template>
   <aside
     data-testid="sidebar"
+    class="sidebar"
     :class="classNames">
     <slot />
   </aside>
@@ -54,7 +55,7 @@ export default defineComponent({
     });
     const model = useVModel(props);
     const classNames = computed(() => {
-      const result = ["sidebar"];
+      const result = [""];
       if (props.type)
         result.push(`sidebar--${props.type}`);
       if (props.align)
@@ -76,14 +77,18 @@ export default defineComponent({
 
 <style lang="postcss">
 .sidebar {
+  --p-sidebar-size-narrow: 60px;
+  --p-sidebar-size-wide: 230px;
+
   @apply bg-default px-2 py-4;
+  @apply dark:bg-dark-default;
 
   /**
   * Default sidebar has
   * 230px width
   */
   &:not(.sidebar--narrow) {
-    @apply w-[230px];
+    @apply w-[var(--p-sidebar-size-wide)];
   }
 
   /**
@@ -99,7 +104,7 @@ export default defineComponent({
   * Fixed sidebar
   */
   &&--fixed {
-    @apply fixed top-0 h-full shadow-lg;
+    @apply fixed top-0 h-full shadow-lg overflow-y-auto;
 
     &:not(.sidebar--right) {
       @apply left-0;
@@ -145,7 +150,7 @@ export default defineComponent({
   * is 60px width
   */
   &&--narrow {
-    @apply w-[60px];
+    @apply w-[var(--p-sidebar-size-narrow)];
   }
 
   /**
@@ -155,6 +160,7 @@ export default defineComponent({
   &&--tabs,
   &&--lines {
     @apply pr-0 py-2 border-r border-r-default;
+    @apply dark:border-r-dark-default;
   }
 
   &&--lines {

package/dist/components/sidebar/Sidebar.vue.d.ts

@@ -21,7 +21,7 @@ declare const _default: import("vue-demi").DefineComponent<{
     };
     toggleable: {
         type: PropType<ToggleableVariant>;
-        default: any;
+        default: undefined;
     };
     modelValue: {
         type: BooleanConstructor;
@@ -48,14 +48,14 @@ declare const _default: import("vue-demi").DefineComponent<{
     };
     toggleable: {
         type: PropType<ToggleableVariant>;
-        default: any;
+        default: undefined;
     };
     modelValue: {
         type: BooleanConstructor;
         default: boolean;
     };
 }>> & {
-    "onUpdate:modelValue"?: (...args: any[]) => any;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
     fixed: boolean;
     variant: StyleVariant;

package/dist/components/sidebar/SidebarBrand.vue

@@ -22,7 +22,8 @@ export default defineComponent({
 <style lang="postcss">
 .sidebar {
   &__brand {
-    @apply block text-center mx-auto font-semibold hover:no-underline pb-4;
+    @apply block text-center mx-auto font-semibold no-underline pb-4 text-default;
+    @apply dark:text-dark-default;
 
     img {
       @apply max-w-full h-auto;

package/dist/components/sidebar/SidebarBrand.vue.d.ts

@@ -1,12 +1,12 @@
 declare const _default: import("vue-demi").DefineComponent<{
     href: {
         type: StringConstructor;
-        default: any;
+        default: undefined;
     };
 }, unknown, unknown, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {}, string, import("vue-demi").VNodeProps & import("vue-demi").AllowedComponentProps & import("vue-demi").ComponentCustomProps, Readonly<import("vue-demi").ExtractPropTypes<{
     href: {
         type: StringConstructor;
-        default: any;
+        default: undefined;
     };
 }>>, {
     href: string;

package/dist/components/sidebar/SidebarNav.vue

@@ -1,5 +1,6 @@
 <template>
   <Nav
+    class="sidebar__nav"
     data-testid="sidebar-nav"
     :title="title"
     vertical
@@ -40,7 +41,7 @@ export default defineComponent({
     const variant = settings?.variant;
     const align = settings?.align;
     const classNames = computed(() => {
-      const result = ["sidebar__nav"];
+      const result = [""];
       if (props.bottom)
         result.push("sidebar__nav--bottom");
       return result;
@@ -94,9 +95,11 @@ export default defineComponent({
 
           &.nav__link--active {
             @apply bg-transparent text-default;
+            @apply dark:bg-transparent dark:text-dark-default;
 
             .nav__link__icon {
               @apply bg-subtle;
+              @apply dark:bg-dark-subtle;
             }
           }
         }
@@ -110,22 +113,6 @@ export default defineComponent({
             @apply mt-0;
           }
         }
-
-        /* &__icon {
-          @apply rounded p-3 inline-block;
-        }
-
-        &--active {
-          @apply bg-transparent text-default;
-
-          .nav__link__icon {
-            @apply bg-subtle;
-          }
-        }
-
-        &__label {
-          @apply mt-0 px-1 pb-3;
-        } */
       }
     }
 
@@ -135,6 +122,7 @@ export default defineComponent({
 
         &--active {
           @apply bg-default;
+          @apply dark:bg-dark-default;
         }
 
         &__label {

package/dist/components/sidebar/SidebarNav.vue.d.ts

@@ -1,7 +1,7 @@
 declare const _default: import("vue-demi").DefineComponent<{
     title: {
         type: StringConstructor;
-        default: any;
+        default: undefined;
     };
     bottom: {
         type: BooleanConstructor;
@@ -12,13 +12,13 @@ declare const _default: import("vue-demi").DefineComponent<{
         default: boolean;
     };
 }, {
-    variant: import("../nav").StyleVariant;
-    align: import("../nav").AlignVariant;
+    variant: import("../nav").StyleVariant | undefined;
+    align: import("../nav").AlignVariant | undefined;
     classNames: import("vue-demi").ComputedRef<string[]>;
 }, unknown, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {}, string, import("vue-demi").VNodeProps & import("vue-demi").AllowedComponentProps & import("vue-demi").ComponentCustomProps, Readonly<import("vue-demi").ExtractPropTypes<{
     title: {
         type: StringConstructor;
-        default: any;
+        default: undefined;
     };
     bottom: {
         type: BooleanConstructor;

package/dist/components/sidebar/index.d.ts

@@ -1,6 +1,6 @@
 import { InjectionKey } from 'vue-demi';
 import { StyleVariant, AlignVariant } from '../nav';
-export declare type TypeVariant = 'wide' | 'narrow';
+export type TypeVariant = 'wide' | 'narrow';
 export interface SidebarSettings {
     variant: StyleVariant;
     align: AlignVariant;

package/dist/components/sidebar-menu/SidebarMenu.vue

@@ -41,7 +41,7 @@
         <NavItem
           v-else
           :href="item.url"
-          :class="{ 'nav__item--no-label' : !item.label }">
+          :class="{ 'nav__item--no-label' : !item.label, 'nav__item--no-icon' : !item.icon }">
           <template
             #icon>
             <template v-if="item.icon && typeof item.icon === 'string'">