@privyid/persona 1.1.1 → 1.2.0

package/dist/components/nav/Nav.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/nav/Nav.spec.mjs

@@ -0,0 +1,115 @@
+import { render } from "@testing-library/vue";
+import Nav from "./Nav.vue";
+it("should rendered properly without any props", () => {
+  const screen = render({
+    components: { Nav },
+    template: `
+      <Nav>
+      </Nav>
+    `
+  });
+  const nav = screen.queryByTestId("nav");
+  expect(nav).toBeInTheDocument();
+  expect(nav).toHaveClass("nav", "nav--pills", "nav--align-left");
+});
+it("should have style `fill` by setting the `fill` prop", () => {
+  const screen = render({
+    components: { Nav },
+    template: `
+      <Nav fill>
+      </Nav>
+    `
+  });
+  const nav = screen.queryByTestId("nav");
+  expect(nav).toBeInTheDocument();
+  expect(nav).toHaveClass("nav", "nav--fill");
+});
+it("should have style `justified` by setting the `justified` prop", () => {
+  const screen = render({
+    components: { Nav },
+    template: `
+      <Nav justified>
+      </Nav>
+    `
+  });
+  const nav = screen.queryByTestId("nav");
+  expect(nav).toBeInTheDocument();
+  expect(nav).toHaveClass("nav", "nav--justified");
+});
+it("should have style `vertical` by setting the `vertical` prop", () => {
+  const screen = render({
+    components: { Nav },
+    template: `
+      <Nav vertical>
+      </Nav>
+    `
+  });
+  const nav = screen.queryByTestId("nav");
+  expect(nav).toBeInTheDocument();
+  expect(nav).toHaveClass("nav", "nav--vertical");
+});
+it("should have style `lines` if variant props set to `lines`", () => {
+  const screen = render({
+    components: { Nav },
+    template: `
+      <Nav variant="lines">
+      </Nav>
+    `
+  });
+  const nav = screen.queryByTestId("nav");
+  expect(nav).toBeInTheDocument();
+  expect(nav).toHaveClass("nav--lines");
+  expect(nav).not.toHaveClass("nav--pills");
+});
+it("should be able to change alignment via props `align`", () => {
+  const screen = render({
+    components: { Nav },
+    template: `
+      <Nav align="center">
+      </Nav>
+    `
+  });
+  const nav = screen.queryByTestId("nav");
+  expect(nav).toBeInTheDocument();
+  expect(nav).toHaveClass("nav", "nav--pills", "nav--align-center");
+});
+it("should be able to add navigation title via props `title`", () => {
+  const screen = render({
+    components: { Nav },
+    template: `
+      <Nav title="Document">
+      </Nav>
+    `
+  });
+  const nav = screen.queryByTestId("nav");
+  const title = screen.queryByText("Document");
+  expect(nav).toBeInTheDocument();
+  expect(nav).toHaveClass("nav", "nav--has-title");
+  expect(title).toBeInTheDocument();
+});
+it("should be able to make condensed navigation via props `condensed`", () => {
+  const screen = render({
+    components: { Nav },
+    template: `
+      <Nav condensed>
+      </Nav>
+    `
+  });
+  const nav = screen.queryByTestId("nav");
+  expect(nav).toBeInTheDocument();
+  expect(nav).toHaveClass("nav", "nav--condensed");
+});
+it("should be able to add navigation title-action via props `title-action-label` and `title-action-url`", () => {
+  const screen = render({
+    components: { Nav },
+    template: `
+      <Nav title="Title" title-action-url="/home" title-action-label="Action" />
+    `
+  });
+  const nav = screen.queryByTestId("nav");
+  const navTitle = screen.queryByTestId("nav-action");
+  expect(nav).toBeInTheDocument();
+  expect(navTitle).toBeInTheDocument();
+  expect(navTitle).toHaveTextContent("Action");
+  expect(navTitle).toHaveAttribute("href", "/home");
+});

package/dist/components/nav/Nav.vue

@@ -6,7 +6,7 @@
       class="nav__title">
       <span
         class="nav__title__item"
-        :class="[ (!title && titleActionLabel) ? 'justify-end' : 'justify-between' ]">
+        :class="[!title && titleActionLabel ? 'justify-end' : 'justify-between']">
         <Caption
           v-if="title"
           weight="bold"
@@ -26,79 +26,66 @@
   </ul>
 </template>
 
-<script lang="ts" setup>
-import type { PropType } from 'vue-demi'
-import { computed } from 'vue-demi'
-import type { AlignVariant, StyleVariant } from '.'
-import Caption from '../caption/Caption.vue'
-import Text from '../text/Text.vue'
-import type { RouteLocationRaw } from 'vue-router'
-
+<script setup>
+import { computed } from "vue-demi";
+import Caption from "../caption/Caption.vue";
+import Text from "../text/Text.vue";
 const props = defineProps({
   fill: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   justified: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   variant: {
-    type   : String as PropType<StyleVariant>,
-    default: 'pills',
+    type: String,
+    default: "pills"
   },
   align: {
-    type   : String as PropType<AlignVariant>,
-    default: 'left',
+    type: String,
+    default: "left"
   },
   vertical: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   title: {
-    type   : String,
-    default: undefined,
+    type: String,
+    default: void 0
   },
   titleActionLabel: {
-    type   : [String, Object] as PropType<RouteLocationRaw>,
-    default: undefined,
+    type: [String, Object],
+    default: void 0
   },
   titleActionUrl: {
-    type   : [String, Object] as PropType<RouteLocationRaw>,
-    default: undefined,
+    type: [String, Object],
+    default: void 0
   },
   condensed: {
-    type   : Boolean,
-    default: false,
-  },
-})
-
+    type: Boolean,
+    default: false
+  }
+});
 const classNames = computed(() => {
-  const result: string[] = ['nav']
-
+  const result = ["nav"];
   if (props.fill)
-    result.push('nav--fill')
-
+    result.push("nav--fill");
   if (props.justified)
-    result.push('nav--justified')
-
+    result.push("nav--justified");
   if (props.variant)
-    result.push(`nav--${props.variant}`)
-
+    result.push(`nav--${props.variant}`);
   if (props.align)
-    result.push(`nav--align-${props.align}`)
-
+    result.push(`nav--align-${props.align}`);
   if (props.vertical)
-    result.push('nav--vertical')
-
+    result.push("nav--vertical");
   if (props.title || props.titleActionLabel)
-    result.push('nav--has-title')
-
+    result.push("nav--has-title");
   if (props.condensed)
-    result.push('nav--condensed')
-
-  return result
-})
+    result.push("nav--condensed");
+  return result;
+});
 </script>
 
 <style lang="postcss">

package/dist/components/nav/Nav.vue.d.ts

@@ -0,0 +1,104 @@
+import type { PropType } from 'vue-demi';
+import type { AlignVariant, StyleVariant } from '.';
+import type { RouteLocationRaw } from 'vue-router';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLUListElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import("vue-demi").DefineComponent<import("vue-demi").ExtractPropTypes<{
+    fill: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    justified: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    variant: {
+        type: PropType<StyleVariant>;
+        default: string;
+    };
+    align: {
+        type: PropType<AlignVariant>;
+        default: string;
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    title: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    titleActionLabel: {
+        type: PropType<RouteLocationRaw>;
+        default: undefined;
+    };
+    titleActionUrl: {
+        type: PropType<RouteLocationRaw>;
+        default: undefined;
+    };
+    condensed: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {}, {}, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {}, string, import("vue-demi").PublicProps, Readonly<import("vue-demi").ExtractPropTypes<{
+    fill: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    justified: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    variant: {
+        type: PropType<StyleVariant>;
+        default: string;
+    };
+    align: {
+        type: PropType<AlignVariant>;
+        default: string;
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    title: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    titleActionLabel: {
+        type: PropType<RouteLocationRaw>;
+        default: undefined;
+    };
+    titleActionUrl: {
+        type: PropType<RouteLocationRaw>;
+        default: undefined;
+    };
+    condensed: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{}>, {
+    fill: boolean;
+    title: string;
+    variant: StyleVariant;
+    vertical: boolean;
+    align: AlignVariant;
+    justified: boolean;
+    titleActionLabel: string | import("vue-router").RouteLocationAsRelativeGeneric | import("vue-router").RouteLocationAsPathGeneric;
+    titleActionUrl: string | import("vue-router").RouteLocationAsRelativeGeneric | import("vue-router").RouteLocationAsPathGeneric;
+    condensed: boolean;
+}, {}, {}, {}, string, import("vue-demi").ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/nav/NavCollapse.vue

@@ -16,37 +16,31 @@
   </Collapse>
 </template>
 
-<script lang="ts" setup>
-import Collapse from '../collapse/Collapse.vue'
-import NavItem from '../nav/NavItem.vue'
-import IconMore from '@privyid/persona-icon/vue/chevron-down/20.vue'
-import { onMounted, ref } from 'vue-demi'
-
+<script setup>
+import Collapse from "../collapse/Collapse.vue";
+import NavItem from "../nav/NavItem.vue";
+import IconMore from "@privyid/persona-icon/vue/chevron-down/20.vue";
+import { onMounted, ref } from "vue-demi";
 defineProps({
   showMoreText: {
-    type   : String,
-    default: 'More',
+    type: String,
+    default: "More"
   },
   showLessText: {
-    type   : String,
-    default: 'Less',
-  },
-})
-
-const root     = ref<InstanceType<typeof NavItem>>()
-const isExpand = ref(false)
-
-function toggleExpand () {
-  isExpand.value = !isExpand.value
+    type: String,
+    default: "Less"
+  }
+});
+const root = ref();
+const isExpand = ref(false);
+function toggleExpand() {
+  isExpand.value = !isExpand.value;
 }
-
 onMounted(() => {
   if (root.value.$el) {
-    isExpand.value = root.value.$el
-      .querySelectorAll('.router-link-active:not(.nav__link--exact),.router-link-exact-active.nav__link--exact')
-      .length > 0
+    isExpand.value = root.value.$el.querySelectorAll(".router-link-active:not(.nav__link--exact),.router-link-exact-active.nav__link--exact").length > 0;
   }
-})
+});
 </script>
 
 <style lang="postcss">

package/dist/components/nav/NavCollapse.vue.d.ts

@@ -0,0 +1,164 @@
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {
+        root: ({
+            $: import("vue-demi").ComponentInternalInstance;
+            $data: {};
+            $props: Partial<{
+                target: string | undefined;
+                disabled: boolean;
+                href: string | import("vue-router").RouteLocationAsRelativeGeneric | import("vue-router").RouteLocationAsPathGeneric;
+                active: boolean;
+                linkClass: string | unknown[] | Record<string, any>;
+                exact: boolean;
+            }> & Omit<{
+                readonly target: string | undefined;
+                readonly disabled: boolean;
+                readonly active: boolean;
+                readonly exact: boolean;
+                readonly href?: string | import("vue-router").RouteLocationAsRelativeGeneric | import("vue-router").RouteLocationAsPathGeneric | undefined;
+                readonly linkClass?: string | unknown[] | Record<string, any> | undefined;
+            } & import("vue-demi").VNodeProps & import("vue-demi").AllowedComponentProps & import("vue-demi").ComponentCustomProps, "target" | "disabled" | "href" | "active" | "linkClass" | "exact">;
+            $attrs: {
+                [x: string]: unknown;
+            };
+            $refs: {
+                [x: string]: unknown;
+            };
+            $slots: Readonly<{
+                [name: string]: import("vue-demi").Slot<any> | undefined;
+            }>;
+            $root: import("vue-demi").ComponentPublicInstance | null;
+            $parent: import("vue-demi").ComponentPublicInstance | null;
+            $host: Element | null;
+            $emit: (event: string, ...args: any[]) => void;
+            $el: any;
+            $options: import("vue-demi").ComponentOptionsBase<Readonly<import("vue-demi").ExtractPropTypes<{
+                active: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
+                disabled: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
+                href: {
+                    type: import("vue-demi").PropType<import("vue-router").RouteLocationRaw>;
+                    default: undefined;
+                };
+                target: {
+                    type: import("vue-demi").PropType<import("vue-demi").AnchorHTMLAttributes["target"]>;
+                    default: string;
+                };
+                linkClass: {
+                    type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+                    default: undefined;
+                };
+                exact: {
+                    type: BooleanConstructor;
+                    default: boolean;
+                };
+            }>> & Readonly<{}>, {}, {}, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {}, string, {
+                target: string | undefined;
+                disabled: boolean;
+                href: string | import("vue-router").RouteLocationAsRelativeGeneric | import("vue-router").RouteLocationAsPathGeneric;
+                active: boolean;
+                linkClass: string | unknown[] | Record<string, any>;
+                exact: boolean;
+            }, {}, string, {}, import("vue").GlobalComponents, import("vue-demi").GlobalDirectives, string, import("vue-demi").ComponentProvideOptions> & {
+                beforeCreate?: (() => void) | (() => void)[];
+                created?: (() => void) | (() => void)[];
+                beforeMount?: (() => void) | (() => void)[];
+                mounted?: (() => void) | (() => void)[];
+                beforeUpdate?: (() => void) | (() => void)[];
+                updated?: (() => void) | (() => void)[];
+                activated?: (() => void) | (() => void)[];
+                deactivated?: (() => void) | (() => void)[];
+                beforeDestroy?: (() => void) | (() => void)[];
+                beforeUnmount?: (() => void) | (() => void)[];
+                destroyed?: (() => void) | (() => void)[];
+                unmounted?: (() => void) | (() => void)[];
+                renderTracked?: ((e: import("vue-demi").DebuggerEvent) => void) | ((e: import("vue-demi").DebuggerEvent) => void)[];
+                renderTriggered?: ((e: import("vue-demi").DebuggerEvent) => void) | ((e: import("vue-demi").DebuggerEvent) => void)[];
+                errorCaptured?: ((err: unknown, instance: import("vue-demi").ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue-demi").ComponentPublicInstance | null, info: string) => boolean | void)[];
+            };
+            $forceUpdate: () => void;
+            $nextTick: typeof import("vue-demi").nextTick;
+            $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import("@vue/reactivity").OnCleanup]) => any : (...args: [any, any, import("@vue/reactivity").OnCleanup]) => any, options?: import("vue-demi").WatchOptions): import("vue-demi").WatchStopHandle;
+        } & Readonly<{
+            target: string | undefined;
+            disabled: boolean;
+            href: string | import("vue-router").RouteLocationAsRelativeGeneric | import("vue-router").RouteLocationAsPathGeneric;
+            active: boolean;
+            linkClass: string | unknown[] | Record<string, any>;
+            exact: boolean;
+        }> & Omit<Readonly<import("vue-demi").ExtractPropTypes<{
+            active: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            href: {
+                type: import("vue-demi").PropType<import("vue-router").RouteLocationRaw>;
+                default: undefined;
+            };
+            target: {
+                type: import("vue-demi").PropType<import("vue-demi").AnchorHTMLAttributes["target"]>;
+                default: string;
+            };
+            linkClass: {
+                type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+                default: undefined;
+            };
+            exact: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & Readonly<{}>, "target" | "disabled" | "href" | "active" | "linkClass" | "exact"> & import("vue-demi").ShallowUnwrapRef<{}> & {} & import("vue-demi").ComponentCustomProperties & {} & {
+            $slots: Readonly<{
+                icon(): import("vue-demi").VNode[];
+                default(): import("vue-demi").VNode[];
+            }> & {
+                icon(): import("vue-demi").VNode[];
+                default(): import("vue-demi").VNode[];
+            };
+        }) | null;
+    };
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import("vue-demi").DefineComponent<import("vue-demi").ExtractPropTypes<{
+    showMoreText: {
+        type: StringConstructor;
+        default: string;
+    };
+    showLessText: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, {}, {}, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {}, string, import("vue-demi").PublicProps, Readonly<import("vue-demi").ExtractPropTypes<{
+    showMoreText: {
+        type: StringConstructor;
+        default: string;
+    };
+    showLessText: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    showMoreText: string;
+    showLessText: string;
+}, {}, {}, {}, string, import("vue-demi").ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/nav/NavForm.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/nav/NavForm.spec.mjs

@@ -0,0 +1,18 @@
+import { render } from "@testing-library/vue";
+import Nav from "./Nav.vue";
+import NavForm from "./NavForm.vue";
+it("should rendered properly without any props", () => {
+  const screen = render({
+    components: { Nav, NavForm },
+    template: `
+      <Nav>
+        <NavForm>form</NavForm>
+      </Nav>
+    `
+  });
+  const navForm = screen.queryByTestId("nav-form");
+  const text = screen.queryByText("form");
+  expect(navForm).toBeInTheDocument();
+  expect(navForm).toHaveClass("nav__form");
+  expect(text).toBeInTheDocument();
+});

package/dist/components/nav/NavForm.vue.d.ts

@@ -0,0 +1,17 @@
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLLIElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/nav/NavItem.spec.d.ts

@@ -0,0 +1 @@
+export {};