@privyid/persona 1.2.0 → 1.2.1

package/dist/components/pdf-viewer/index.md

@@ -1,214 +0,0 @@
----
-title: PDF Viewer · Components
-description: Open and View PDF Document
----
-<script setup>
-  import pPdfViewer from './PdfViewer.vue'
-  import pNavbar from '../navbar/Navbar.vue'
-  import pNavbarBrand from '../navbar/NavbarBrand.vue'
-  import pNavbarNav from '../navbar/NavbarNav.vue'
-  import pNavItem from '../nav/NavItem.vue'
-  import pButton from '../button/Button.vue'
-  import pFormGroup from '../form-group/FormGroup.vue'
-  import pInputPassword from '../input-password/InputPassword.vue'
-  import pBanner from '../banner/Banner.vue'
-  import pToggle from '../toggle/Toggle.vue'
-  import { ref } from 'vue-demi'
-  import { withBase } from 'vitepress'
-
-  const FILE          = withBase('/assets/pdf/Calibrator-v3.pdf')
-  const FILE_PROTECT  = withBase('/assets/pdf/Calibrator-v3_protected.pdf')
-  const IMG_FIXED_FIT = withBase('/assets/images/fixed-vs-fit.svg')
-
-  const password = ref('')
-  const layout   = ref('fixed')
-</script>
-
-<style lang="postcss">
-  .preview > .pdf {
-    @apply z-[2];
-  }
-</style>
-
-# PDF Viewer
-> Open and View PDF Document
-
-## Usage
-
-### Simple Usage
-
-<preview>
-  <p-pdf-viewer :src="FILE" />
-</preview>
-
-```vue
-<template>
-  <p-pdf-viewer :src="FILE" />
-</template>
-
-<script setup>
-  import FILE from '~/assets/Calibrator-v3.pdf'
-</script>
-```
-
-### With Header And Footer
-
-<preview>
-  <p-pdf-viewer :src="FILE">
-    <template #header>
-      <p-navbar>
-        <p-navbar-brand>
-          <img :src="withBase('/assets/images/icon-privy.svg')" />
-        </p-navbar-brand>
-        <p-navbar-nav>
-          <p-nav-item active>Label</p-nav-item>
-          <p-nav-item>Label</p-nav-item>
-          <p-nav-item>Label</p-nav-item>
-        </p-navbar-nav>
-      </p-navbar>
-    </template>
-    <template #footer>
-      <div class="p-4 text-center">
-        <p-button color="primary">
-          Action Button
-        </p-button>
-      </div>
-    </template>
-  </p-pdf-viewer>
-</preview>
-
-```vue
-<template>
-  <p-pdf-viewer :src="FILE">
-    <template #header>
-      <p-navbar>
-        <p-navbar-brand>
-          <img src="../../public/assets/images/icon-privy.svg" />
-        </p-navbar-brand>
-        <p-navbar-nav>
-          <p-nav-item active>Label</p-nav-item>
-          <p-nav-item>Label</p-nav-item>
-          <p-nav-item>Label</p-nav-item>
-        </p-navbar-nav>
-      </p-navbar>
-    </template>
-    <template #footer>
-      <div class="p-4 text-center">
-        <p-button color="primary">
-          Action Button
-        </p-button>
-      </div>
-    </template>
-  </p-pdf-viewer>
-</template>
-```
-
-## Handle Document with Password
-
-If your document is require a password to open, you can pass the password to prop `password`.
-
-<p-banner :dismissable="false">
-  This component doesn't provide any UI for handling input password. You have to do it yourself.
-</p-banner>
-
-<preview class="flex-col">
-  <p-form-group
-    label="Password"
-    description="The password is: 123456">
-    <p-input-password
-      v-model="password" />
-  </p-form-group>
-  <p-pdf-viewer
-    :src="FILE_PROTECT"
-    :password="password" />
-</preview>
-
-```vue
-<template>
-  <p-form-group
-    label="Password"
-    description="The password is: 123456">
-    <p-input-password
-      v-model="password" />
-  </p-form-group>
-  <p-pdf-viewer
-    :src="FILE_PROTECT"
-    :password="password" />
-</template>
-
-<script setup>
-  import FILE_PROTECT from '~/assets/Calibrator-v3_protected.pdf?url'
-
-  const password = ref('')
-</script>
-```
-
-## Layout Fit Mode
-
-Set `layout` prop to `fit` to enable layout fit mode. It will adapt the viewer height with viewport, best for combining with [PDFObject](/components/pdf-object/).
-
-<a :href="IMG_FIXED_FIT" target="_blank">
-  <img class="w-full" :src="IMG_FIXED_FIT" alt="fixed-vs-fit-ilustration" />
-</a>
-
-**Try it**
-
-<div class="mb-4">
-  <p-toggle value="fit" unchecked-value="fixed" v-model="layout">
-    Enable Layout fit
-  </p-toggle>
-</div>
-
-<preview>
-  <p-pdf-viewer
-    :src="FILE"
-    :layout="layout"
-    offset-top="72" />
-</preview>
-
-```vue
-<template>
-  <p-pdf-viewer
-    :src="FILE"
-    layout="fit"
-    offset-top="72" />
-</template>
-```
-
-## API
-
-### Props
-
-| Props                    |   Type   | Default | Description                                                                |
-|--------------------------|:--------:|:-------:|----------------------------------------------------------------------------|
-| `src`                    | `String` |   `-`   | Document source URL                                                        |
-| `password`               | `String` |   `-`   | Document password                                                          |
-| `layout`                 | `String` | `fixed` | Viewer layout sizing, valid value: `fixed`, `fit`                          |
-| `offsetTop`              | `Number` |   `0`   | Margin top when using layout `fit`                                         |
-| `page`                   | `Number` |   `1`   | `v-model:page` value                                                       |
-| `scale`                  | `Number` |   `1`   | `v-model:scale` value                                                      |
-| `first-nav-label`        | `String` | `First` | Label to place in the first navigation button                              |
-| `last-nav-label`         | `String` | `Last`  | Label to place in the last navigation button                               |  
-| `num-of-pages-nav-label` | `String` | `of`    | Label to place on the preposition number of pages navigation button        |
-
-### Slots
-
-| Name      | Description                                            |
-|-----------|--------------------------------------------------------|
-| `default` | Content to place [PDF Object](/components/pdf-object/) |
-| `header`  | Content to place as header                             |
-| `footer`  | Content to place as footer                             |
-
-### Events
-
-| Name             | Arguments     | Description                                                |
-|------------------|---------------|------------------------------------------------------------|
-| `loading`        | ProgressEvent | Event when loading document                                |
-| `loaded`         | -             | Event when document loaded                                 |
-| `error`          | Error         | Event when got error when loading the document             |
-| `error-password` | Error         | Event when document require a password or password invalid |
-
-## See Also
-
-- [PDF Object](/components/pdf-object/)
-- <a :href="FILE" target="_blank" download>Download Calibrator v3.0.0</a>

package/dist/components/pdf-viewer/index.mjs

@@ -1,24 +0,0 @@
-import {
-  inject,
-  ref
-} from "vue-demi";
-import { noop } from "lodash-es";
-export const PDF_VIEWER_CONTEXT = Symbol("PdfViewer");
-export function usePdfContext() {
-  return inject(PDF_VIEWER_CONTEXT, () => {
-    const page = ref(1);
-    const scale = ref(1);
-    const totalPage = ref(0);
-    return {
-      page,
-      scale,
-      totalPage,
-      zoomIn: noop,
-      zoomOut: noop,
-      next: noop,
-      prev: noop,
-      first: noop,
-      last: noop
-    };
-  }, true);
-}

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

@@ -1,68 +0,0 @@
-import type * as PDFJS from 'pdfjs-dist';
-import type * as PDFJSViewer from 'pdfjs-dist/legacy/web/pdf_viewer.mjs';
-export declare function getDocument(...params: Parameters<typeof PDFJS['getDocument']>): Promise<import("pdfjs-dist/types/src/display/api").PDFDocumentLoadingTask>;
-export declare function getCMAPUri(): Promise<string>;
-export declare function getVersion(): Promise<string>;
-export declare function createEventBus(): Promise<PDFJSViewer.EventBus>;
-export declare function createViewer(...params: ConstructorParameters<typeof PDFJSViewer['PDFViewer']>): Promise<PDFJSViewer.PDFViewer>;
-export declare function createLinkService(...params: ConstructorParameters<typeof PDFJSViewer['PDFLinkService']>): Promise<PDFJSViewer.PDFLinkService>;
-export type * as PDFJSViewer from 'pdfjs-dist/web/pdf_viewer.mjs';
-export type * as PDFJS from 'pdfjs-dist';
-export declare function normalizeRect(rect: number[]): number[];
-export interface PDFJSAnnotation {
-    id: string;
-    annotationFlags: number;
-    borderStyle?: {
-        width: number;
-        rawWidth: number;
-        style: number;
-        dashArray: number[];
-        horizontalCornerRadius: number;
-        verticalCornerRadius: number;
-    };
-    color?: Uint8ClampedArray;
-    backgroundColor?: Uint8ClampedArray;
-    borderColor?: Uint8ClampedArray;
-    rotation: 0 | 90 | 180 | 270;
-    contentsObj: {
-        str: string;
-        dir: 'ltr' | 'rtl';
-    };
-    hasAppearance: boolean;
-    modificationDate?: Date;
-    rect: [
-        number,
-        number,
-        number,
-        number
-    ];
-    subtype: string;
-    hasOwnCanvas: boolean;
-    noRotate: boolean;
-    noHTML: boolean;
-    isEditable: boolean;
-    structParent: number;
-    annotationType: number;
-    fieldName: string;
-    actions?: string;
-    fieldValue?: string;
-    defaultFieldValue?: string;
-    alternativeText: string;
-    defaultAppearanceData?: {
-        fontSize: number;
-        fontName: string;
-        fontColor: Uint8ClampedArray;
-    };
-    fieldType: string;
-    fieldFlags: number;
-    password: boolean;
-    readOnly: boolean;
-    required: boolean;
-    hidden: boolean;
-}
-export interface PDFJSRawDimension {
-    pageWidth: number;
-    pageHeight: number;
-    pageX: number;
-    pageY: number;
-}

package/dist/components/pdf-viewer/utils/pdfjs.mjs

@@ -1,54 +0,0 @@
-import { withBase } from "ufo";
-import { getCDN } from "../../global/store.mjs";
-let pdfjsLib;
-let pdfjsViewer;
-async function importPdfJS() {
-  if (!pdfjsLib) {
-    const pdfjs = await import("pdfjs-dist");
-    if (typeof window !== "undefined" && "Worker" in window)
-      pdfjs.GlobalWorkerOptions.workerSrc = withBase(`pdfjs-dist@${pdfjs.version}/legacy/build/pdf.worker.min.mjs`, getCDN());
-    pdfjsLib = pdfjs;
-  }
-  return pdfjsLib;
-}
-async function importPdfJSViewer() {
-  await importPdfJS();
-  if (!pdfjsViewer)
-    pdfjsViewer = await import("pdfjs-dist/legacy/web/pdf_viewer.mjs");
-  return pdfjsViewer;
-}
-export async function getDocument(...params) {
-  await importPdfJS();
-  return pdfjsLib.getDocument(...params);
-}
-export async function getCMAPUri() {
-  return withBase(`pdfjs-dist@${await getVersion()}/cmaps/`, getCDN());
-}
-export async function getVersion() {
-  await importPdfJS();
-  return pdfjsLib.version;
-}
-export async function createEventBus() {
-  await importPdfJSViewer();
-  return new pdfjsViewer.EventBus();
-}
-export async function createViewer(...params) {
-  await importPdfJSViewer();
-  return new pdfjsViewer.PDFViewer(...params);
-}
-export async function createLinkService(...params) {
-  await importPdfJSViewer();
-  return new pdfjsViewer.PDFLinkService(...params);
-}
-export function normalizeRect(rect) {
-  const r = [...rect];
-  if (rect[0] > rect[2]) {
-    r[0] = rect[2];
-    r[2] = rect[0];
-  }
-  if (rect[1] > rect[3]) {
-    r[1] = rect[3];
-    r[3] = rect[1];
-  }
-  return r;
-}

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

@@ -1,2 +0,0 @@
-import type { MaybeRef } from '@vueuse/core';
-export declare function useIdle(target: MaybeRef<HTMLElement>, timeout?: number): import("vue-demi").Ref<boolean, boolean>;

package/dist/components/pdf-viewer/utils/use-idle.mjs

@@ -1,25 +0,0 @@
-import {
-  useEventListener
-} from "@vueuse/core";
-import { ref } from "vue-demi";
-const TRACK_EVENTS = [
-  "mousemove",
-  "mousedown",
-  "touchstart",
-  "keydown",
-  "scroll"
-];
-export function useIdle(target, timeout = 5e3) {
-  const idle = ref(false);
-  let timer;
-  function onActivities() {
-    idle.value = false;
-    if (timer)
-      clearTimeout(timer);
-    timer = setTimeout(() => {
-      idle.value = true;
-    }, timeout);
-  }
-  useEventListener(target, TRACK_EVENTS, onActivities, { passive: true });
-  return idle;
-}

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

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

package/dist/components/pdf-viewer/utils/use-idle.spec.mjs

@@ -1,14 +0,0 @@
-import { fireEvent } from "@testing-library/dom";
-import { vi } from "vitest";
-import { useIdle } from "./use-idle.mjs";
-it("should true if no activities in spesific time", () => {
-  vi.useFakeTimers();
-  const idle = useIdle(document.body, 5e3);
-  fireEvent.mouseMove(document.body);
-  vi.advanceTimersByTime(2e3);
-  expect(idle.value).toBe(false);
-  fireEvent.mouseMove(document.body);
-  expect(idle.value).toBe(false);
-  vi.advanceTimersByTime(7e3);
-  expect(idle.value).toBe(true);
-});

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

@@ -1,6 +0,0 @@
-import type { MaybeRef } from '@vueuse/core';
-import type { Ref } from 'vue-demi';
-export interface StickyOptions {
-    offsetTop: MaybeRef<number>;
-}
-export declare function useSticky(target: Ref<HTMLElement>, options?: Partial<StickyOptions>): Ref<boolean, boolean>;

package/dist/components/pdf-viewer/utils/use-sticky.mjs

@@ -1,49 +0,0 @@
-import {
-  useElementBounding,
-  useWindowSize
-} from "@vueuse/core";
-import {
-  computed,
-  ref,
-  unref,
-  watchEffect
-} from "vue-demi";
-export function useSticky(target, options = {}) {
-  const enable = ref(false);
-  const offsetTop = computed(() => unref(options.offsetTop) ?? 0);
-  const parent = computed(() => unref(target)?.parentElement);
-  const {
-    top,
-    height
-  } = useElementBounding(parent);
-  const {
-    top: targetTop,
-    width,
-    left
-  } = useElementBounding(target);
-  const { height: windowHeight } = useWindowSize();
-  watchEffect((onCleanup) => {
-    if (enable.value && target.value) {
-      if (top.value - offsetTop.value >= 0) {
-        target.value.style.setProperty("height", `${windowHeight.value - targetTop.value}px`);
-        target.value.style.setProperty("width", "100%");
-      } else {
-        parent.value.style.setProperty("min-height", `${height.value}px`);
-        target.value.style.setProperty("position", "fixed");
-        target.value.style.setProperty("top", `${offsetTop.value}px`);
-        target.value.style.setProperty("left", `${left.value}px`);
-        target.value.style.setProperty("width", `${width.value}px`);
-        target.value.style.setProperty("height", `${windowHeight.value - offsetTop.value}px`);
-      }
-      onCleanup(() => {
-        parent.value.style.removeProperty("min-height");
-        target.value.style.removeProperty("position");
-        target.value.style.removeProperty("top");
-        target.value.style.removeProperty("left");
-        target.value.style.removeProperty("width");
-        target.value.style.removeProperty("height");
-      });
-    }
-  });
-  return enable;
-}

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

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

package/dist/components/pdf-viewer/utils/use-sticky.spec.mjs

@@ -1,113 +0,0 @@
-import { fireEvent, render } from "@testing-library/vue";
-import { vi } from "vitest";
-import { useWindowSize, setWindowSize } from "../__mocks__/use-window-size.mjs";
-import { templateRef } from "@vueuse/core";
-import { useSticky } from "./use-sticky.mjs";
-vi.mock("@vueuse/core", async () => {
-  const vueuse = await vi.importActual("@vueuse/core");
-  return {
-    ...vueuse,
-    useWindowSize
-  };
-});
-afterEach(() => {
-  vi.resetAllMocks();
-});
-it("should set element height to fit window height", async () => {
-  const screen = render({
-    template: `
-      <div>
-        <div
-          data-testid="target"
-          ref="target">
-          Box
-        </div>
-      </div>
-    `,
-    setup() {
-      const target2 = templateRef("target");
-      const sticky = useSticky(target2);
-      sticky.value = true;
-      return {};
-    }
-  });
-  const target = screen.queryByTestId("target");
-  setWindowSize(1e3);
-  vi.spyOn(target.parentElement, "getBoundingClientRect").mockReturnValue({
-    top: 300,
-    y: 300,
-    x: 0,
-    left: 0,
-    width: 300,
-    height: 300,
-    bottom: 0,
-    right: 0,
-    toJSON: vi.fn()
-  });
-  vi.spyOn(target, "getBoundingClientRect").mockReturnValue({
-    top: 300,
-    y: 300,
-    x: 0,
-    left: 0,
-    width: 300,
-    height: 300,
-    bottom: 0,
-    right: 0,
-    toJSON: vi.fn()
-  });
-  await fireEvent.scroll(window);
-  expect(target).toBeInTheDocument();
-  expect(target).toHaveStyle({ height: "700px" });
-});
-it("should ", async () => {
-  const screen = render({
-    template: `
-      <div>
-        <div
-          data-testid="target"
-          ref="target">
-          Box
-        </div>
-      </div>
-    `,
-    setup() {
-      const target2 = templateRef("target");
-      const sticky = useSticky(target2);
-      sticky.value = true;
-      return {};
-    }
-  });
-  const target = screen.queryByTestId("target");
-  setWindowSize(1e3);
-  vi.spyOn(target.parentElement, "getBoundingClientRect").mockReturnValue({
-    top: -50,
-    y: -50,
-    x: 0,
-    left: 0,
-    width: 300,
-    height: 300,
-    bottom: 0,
-    right: 0,
-    toJSON: vi.fn()
-  });
-  vi.spyOn(target, "getBoundingClientRect").mockReturnValue({
-    top: 0,
-    y: 0,
-    x: 0,
-    left: 0,
-    width: 300,
-    height: 300,
-    bottom: 0,
-    right: 0,
-    toJSON: vi.fn()
-  });
-  await fireEvent.scroll(window);
-  expect(target).toBeInTheDocument();
-  expect(target).toHaveStyle({
-    position: "fixed",
-    top: "0px",
-    left: "0px",
-    width: "300px",
-    height: "1000px"
-  });
-});

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

@@ -1,27 +0,0 @@
-import 'pdfjs-dist/web/pdf_viewer.css';
-import type { Ref } from 'vue-demi';
-import type { PDFJSViewer } from './pdfjs';
-export interface OpenDocConfig {
-    disableStream?: boolean;
-    disableRange?: boolean;
-    httpHeaders?: Object;
-}
-export declare function useViewer(container: Ref<HTMLDivElement>, viewer: Ref<HTMLDivElement>): {
-    page: Ref<number, number>;
-    scale: Ref<number, number>;
-    totalPage: import("vue-demi").ComputedRef<number>;
-    loading: import("vue-demi").WritableComputedRef<boolean, boolean>;
-    error: import("vue-demi").ShallowRef<Error | undefined, Error | undefined>;
-    ready: import("vue-demi").ShallowRef<boolean, boolean>;
-    openDoc: (url: string, password?: string, config?: OpenDocConfig) => Promise<void>;
-    closeDoc: () => Promise<void>;
-    pdfDoc: import("vue-demi").ShallowRef<import("pdfjs-dist/types/src/display/api").PDFDocumentProxy | undefined, import("pdfjs-dist/types/src/display/api").PDFDocumentProxy | undefined>;
-    pdfEventBus: import("vue-demi").ShallowRef<PDFJSViewer.EventBus | undefined, PDFJSViewer.EventBus | undefined>;
-    pdfViewer: import("vue-demi").ShallowRef<PDFJSViewer.PDFViewer | undefined, PDFJSViewer.PDFViewer | undefined>;
-    pdfLoadingTask: import("vue-demi").ShallowRef<import("pdfjs-dist/types/src/display/api").PDFDocumentLoadingTask | undefined, import("pdfjs-dist/types/src/display/api").PDFDocumentLoadingTask | undefined>;
-    pdfLinkService: import("vue-demi").ShallowRef<PDFJSViewer.PDFLinkService | undefined, PDFJSViewer.PDFLinkService | undefined>;
-    onLoaded: import("@vueuse/core").EventHookOn<import("pdfjs-dist/types/src/display/api").PDFDocumentProxy>;
-    onError: import("@vueuse/core").EventHookOn<Error>;
-    onReady: import("@vueuse/core").EventHookOn<PDFJSViewer.PDFViewer>;
-    onLoading: import("@vueuse/core").EventHookOn<import("pdfjs-dist/types/src/display/api").OnProgressParameters>;
-};