@privyid/persona 1.1.2 → 1.2.1-rc.0

package/dist/components/pspdfkit/PspdfObject.vue

@@ -1,341 +0,0 @@
-<template>
-  <div
-    ref="content"
-    data-testid="pdf-object"
-    class="pdf-object pspdf-object"
-    tabindex="0"
-    :data-x="objectX"
-    :data-y="objectY"
-    :data-page="objectPage"
-    :data-width="objectWidth"
-    :data-height="objectHeight">
-    <div class="pdf-object__container">
-      <slot />
-      <PdfObjectDebugger v-if="debug && isSelected" />
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import {
-  ref,
-  provide,
-  watch,
-  onMounted,
-  onBeforeUnmount,
-  inject,
-} from 'vue-demi'
-import PdfObjectDebugger from '../pdf-object/PdfObjectDebugger.vue'
-import {
-  syncRef,
-  useVModel,
-  watchIgnorable,
-} from '@vueuse/core'
-import {
-  PDF_OBJECTS_CONTEXT,
-  PDF_OBJECT_CONTEXT,
-  useObjectModel,
-} from '../pdf-object'
-import type { List, AnnotationsUnion } from 'pspdfkit'
-import { usePspdf } from '.'
-import type { ObjectPosition } from '../pdf-object/utils/overlap'
-import { getEmptyPosition } from '../pdf-object/utils/overlap'
-import {
-  createRect,
-  generateInstantId,
-  createRectangleAnnotation,
-  createColor,
-  importList,
-} from './utils/pspdfkit'
-
-const props = defineProps({
-  x: {
-    type   : Number,
-    default: undefined,
-  },
-  y: {
-    type   : Number,
-    default: undefined,
-  },
-  page: {
-    type   : Number,
-    default: undefined,
-  },
-  width: {
-    type   : Number,
-    default: 198,
-  },
-  height: {
-    type   : Number,
-    default: 106,
-  },
-  minWidth: {
-    type   : Number,
-    default: undefined,
-  },
-  minHeight: {
-    type   : Number,
-    default: undefined,
-  },
-  maxWidth: {
-    type   : Number,
-    default: undefined,
-  },
-  maxHeight: {
-    type   : Number,
-    default: undefined,
-  },
-  moveable: {
-    type   : Boolean,
-    default: true,
-  },
-  resizable: {
-    type   : Boolean,
-    default: true,
-  },
-  autofocus: {
-    type   : Boolean,
-    default: false,
-  },
-  debug: {
-    type   : Boolean,
-    default: false,
-  },
-})
-
-defineEmits<{
-  'update:x': [number],
-  'update:y': [number],
-  'update:page': [number],
-  'update:width': [number],
-  'update:height': [number],
-}>()
-
-const content = ref<HTMLDivElement>()
-const vX      = useVModel(props, 'x')
-const vY      = useVModel(props, 'y')
-const vPage   = useVModel(props, 'page')
-const vWidth  = useVModel(props, 'width')
-const vHeight = useVModel(props, 'height')
-
-const { instance, contents } = usePspdf()
-const { objects }            = inject(PDF_OBJECTS_CONTEXT)
-const objectId               = ref<string>()
-const isSelected             = ref(false)
-
-const {
-  id,
-  x: objectX,
-  y: objectY,
-  page: objectPage,
-  width: objectWidth,
-  height: objectHeight,
-  minHeight,
-  minWidth,
-  maxHeight,
-  maxWidth,
-  ratio,
-} = useObjectModel(props)
-
-const { ignoreUpdates } = watchIgnorable([
-  objectX,
-  objectY,
-  objectWidth,
-  objectHeight,
-], async () => {
-  await updateAnnotation()
-})
-
-watch(objectPage, async (value, oldValue) => {
-  if (value !== oldValue) {
-    await removeAnnotation()
-    await createAnnotation()
-  }
-})
-
-watch(() => props.moveable, async (moveable) => {
-  if (objectId.value) {
-    const objects = await instance.value.getAnnotations(objectPage.value - 1)
-    const object  = objects.find((o) => o.id === objectId.value)
-
-    if (object)
-      await instance.value.update(object.set('readOnly', !moveable))
-  }
-})
-
-async function createAnnotation () {
-  if (objectPage.value > 0 && objectPage.value <= instance.value.totalPageCount) {
-    objectId.value = await generateInstantId()
-
-    contents.set(objectId.value, content.value)
-
-    await instance.value.create(
-      await createRectangleAnnotation({
-        id         : objectId.value,
-        pageIndex  : objectPage.value - 1,
-        boundingBox: await createRect({
-          left  : objectX.value * 0.75,
-          top   : objectY.value * 0.75,
-          width : objectWidth.value * 0.75,
-          height: objectHeight.value * 0.75,
-        }),
-        strokeColor: await createColor({ transparent: true }),
-        fillColor  : await createColor({ transparent: true }),
-        customData : {
-          minWidth : minWidth.value * 0.75,
-          minHeight: minHeight.value * 0.75,
-          maxWidth : maxWidth.value * 0.75,
-          maxHeight: maxHeight.value * 0.75,
-        },
-        readOnly: !props.moveable,
-      }),
-    )
-  }
-}
-
-async function updateAnnotation () {
-  const objects = await instance.value.getAnnotations(objectPage.value - 1)
-  const object  = objects.find((o) => o.id === objectId.value)
-
-  if (object) {
-    await instance.value.update(
-      object.set('boundingBox', object.boundingBox.merge({
-        left  : objectX.value * 0.75,
-        top   : objectY.value * 0.75,
-        width : objectWidth.value * 0.75,
-        height: objectHeight.value * 0.75,
-      })),
-    )
-  }
-}
-
-async function removeAnnotation () {
-  if (objectId.value) {
-    await instance.value.delete(objectId.value)
-
-    contents.delete(objectId.value)
-
-    objectId.value = undefined
-  }
-}
-
-function autoPosition () {
-  const otherObjects = [...objects.values()].filter((obj) => {
-    return obj.id !== id
-      && Number.isFinite(obj.x)
-      && Number.isFinite(obj.y)
-      && obj.page === objectPage.value
-  })
-
-  const size = {
-    width : objectWidth.value,
-    height: objectHeight.value,
-  }
-
-  const pageInfo = instance.value.pageInfoForIndex(objectPage.value - 1)
-  const offside  = {
-    width : pageInfo.width / 0.75,
-    height: pageInfo.height / 0.75,
-  }
-
-  const center = getEmptyPosition({
-    size   : size,
-    offside: offside,
-    objects: otherObjects as ObjectPosition[],
-  })
-
-  objectX.value = center.x
-  objectY.value = center.y
-}
-
-function onAnnotationChange (annotations: List<AnnotationsUnion>) {
-  const object = annotations.find((i) => i.id === objectId.value)
-
-  if (object) {
-    ignoreUpdates(() => {
-      objectX.value      = object.boundingBox.left / 0.75
-      objectY.value      = object.boundingBox.top / 0.75
-      objectWidth.value  = object.boundingBox.width / 0.75
-      objectHeight.value = object.boundingBox.height / 0.75
-    })
-  }
-}
-
-async function onAnnotationMounted (annotations: List<AnnotationsUnion>) {
-  if (props.autofocus && objectId.value) {
-    const object = annotations.find((i) => i.id === objectId.value)
-
-    if (object) {
-      const List = await importList()
-
-      instance.value.setSelectedAnnotations(List([objectId.value]))
-      instance.value.jumpToRect(objectPage.value - 1, object.boundingBox)
-    }
-  }
-}
-
-async function onAnnotationSelected (annotations: List<AnnotationsUnion>) {
-  const object = annotations.find((i) => i.id === objectId.value)
-
-  if (object) {
-    const root = instance.value.contentDocument.querySelector('.PSPDFKit-Root')
-
-    if (root) {
-      root.setAttribute('resizable', `${props.resizable}`)
-      root.setAttribute('moveable', `${props.moveable}`)
-    }
-  }
-
-  isSelected.value = !!object
-}
-
-onMounted(async () => {
-  if (instance.value && content.value) {
-    if (!Number.isFinite(objectX.value) || !Number.isFinite(objectY.value))
-      autoPosition()
-
-    instance.value.addEventListener('annotations.update', onAnnotationChange)
-    instance.value.addEventListener('annotations.create', onAnnotationMounted)
-    instance.value.addEventListener('annotationSelection.change', onAnnotationSelected as any)
-
-    await createAnnotation()
-  }
-})
-
-onBeforeUnmount(async () => {
-  if (instance.value) {
-    await removeAnnotation()
-
-    instance.value.removeEventListener('annotations.update', onAnnotationChange)
-    instance.value.removeEventListener('annotations.create', onAnnotationMounted)
-    instance.value.removeEventListener('annotationSelection.change', onAnnotationSelected as any)
-  }
-})
-
-syncRef(objectX, vX)
-syncRef(objectY, vY)
-syncRef(objectPage, vPage)
-syncRef(objectWidth, vWidth)
-syncRef(objectHeight, vHeight)
-
-// Provide some data for debug
-provide(PDF_OBJECT_CONTEXT, {
-  id,
-  x     : objectX,
-  y     : objectY,
-  page  : objectPage,
-  width : objectWidth,
-  height: objectHeight,
-  minHeight,
-  minWidth,
-  maxHeight,
-  maxWidth,
-  ratio,
-})
-</script>
-
-<style lang="postcss">
-.pspdf-object {
-  @apply hidden;
-}
-</style>

package/dist/components/pspdfkit/PspdfObjectAddon.vue

@@ -1,30 +0,0 @@
-<template>
-  <div
-    data-testid="pdf-object-addon"
-    class="pdf-object__addon"
-    :class="classNames">
-    <slot />
-  </div>
-</template>
-
-<script lang="ts" setup>
-import type { PropType } from 'vue-demi'
-import { computed } from 'vue-demi'
-import type { AddonPositionVariant } from '../pdf-object'
-
-const props = defineProps({
-  position: {
-    type   : String as PropType<AddonPositionVariant>,
-    default: 'right',
-  },
-})
-
-const classNames = computed(() => {
-  const result: string[] = []
-
-  if (props.position)
-    result.push(`pdf-object__addon--${props.position}`)
-
-  return result
-})
-</script>

package/dist/components/pspdfkit/PspdfObjects.vue

@@ -1,30 +0,0 @@
-<template>
-  <div
-    ref="root"
-    class="pdf-objects"
-    data-testid="pdf-objects">
-    <slot />
-  </div>
-</template>
-
-<script lang="ts" setup>
-import {
-  ref,
-  provide,
-} from 'vue-demi'
-import { PDF_OBJECTS_CONTEXT } from '../pdf-object/'
-import { usePdfContext } from '../pdf-viewer'
-import useDrop from './utils/use-drop'
-
-const objects    = new Map()
-const root       = ref<HTMLDivElement>()
-const pdfContext = usePdfContext()
-
-useDrop(root)
-
-provide(PDF_OBJECTS_CONTEXT, {
-  ...pdfContext,
-  objects,
-  root,
-})
-</script>

package/dist/components/pspdfkit/PspdfViewer.vue

@@ -1,257 +0,0 @@
-<template>
-  <div
-    ref="root"
-    v-p-aspect-ratio="layout === 'fixed' ? Number(ratio) : 0"
-    data-testid="pdf-viewer"
-    class="pdf"
-    :class="classNames">
-    <div
-      class="pdf__header">
-      <slot
-        name="header"
-        :page="pdfPage"
-        :scale="pdfScale"
-        :total-page="totalPage"
-        :zoom-in="zoomIn"
-        :zoom-out="zoomOut"
-        :next="next"
-        :prev="prev"
-        :instance="instance" />
-    </div>
-
-    <PdfObjects
-      class="pdf__wrapper">
-      <!-- Minimum PDFJS Viewer -->
-      <div
-        ref="container"
-        class="pdf__container pdfContainer" />
-
-      <div v-if="instance">
-        <slot />
-      </div>
-
-      <!-- Minimum PDFJS Viewer end -->
-      <transition name="slide-up">
-        <PdfNavigation
-          v-show="!idle && !loading && !error" />
-      </transition>
-    </PdfObjects>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import type { Instance } from 'pspdfkit'
-import { vPAspectRatio } from '../aspect-ratio'
-import {
-  type PropType,
-  onMounted,
-  ref,
-  toRef,
-  watch,
-  provide,
-  computed,
-} from 'vue-demi'
-import PdfObjects from './PspdfObjects.vue'
-import PdfNavigation from '../pdf-viewer/PdfNavigation.vue'
-import { PDF_VIEWER_CONTEXT, type LayoutVariant } from '../pdf-viewer'
-import { useSticky } from '../pdf-viewer/utils/use-sticky'
-import {
-  syncRef,
-  useToNumber,
-  useVModel,
-  watchDebounced,
-} from '@vueuse/core'
-import { useViewer, type OpenDocConfig } from './utils/use-viewer'
-import { useIdle } from '../pdf-viewer/utils/use-idle'
-
-const props = defineProps({
-  src: {
-    type   : String,
-    default: '',
-  },
-  page: {
-    type   : Number,
-    default: 1,
-  },
-  scale: {
-    type   : Number,
-    default: 1,
-  },
-  password: {
-    type   : String,
-    default: undefined,
-  },
-  layout: {
-    type   : String as PropType<LayoutVariant>,
-    default: 'fixed',
-  },
-  ratio: {
-    type   : [Number, String],
-    default: 210 / 297,
-  },
-  offsetTop: {
-    type   : [Number, String],
-    default: 0,
-  },
-  config: {
-    type   : [Object] as PropType<OpenDocConfig>,
-    default: () => ({}),
-  },
-})
-
-const emit = defineEmits<{
-  'ready': [Instance],
-  'loaded': [Instance],
-  'error': [Error],
-  'error-password': [Error],
-  'update:page': [number],
-  'update:scale': [number],
-}>()
-
-const root      = ref<HTMLDivElement>()
-const container = ref<HTMLDivElement>()
-const viewer    = ref<HTMLDivElement>()
-const idle      = useIdle(container)
-
-const vPage  = useVModel(props, 'page')
-const vScale = useVModel(props, 'scale')
-
-const offsetTop    = useToNumber(toRef(props, 'offsetTop'), { nanToZero: true })
-const enableSticky = useSticky(root, { offsetTop: offsetTop })
-
-const classNames = computed(() => {
-  const result: string[] = []
-
-  if (props.layout)
-    result.push(`pdf-viewer--layout-${props.layout}`)
-
-  return result
-})
-
-const {
-  instance,
-  page: pdfPage,
-  scale: pdfScale,
-  totalPage,
-  openDoc,
-  closeDoc,
-  loading,
-  error,
-  onLoaded,
-  onError,
-  onReady,
-} = useViewer(container)
-
-watchDebounced(() => [props.src, props.password], ([src, password]) => {
-  openDoc(src, password, props.config)
-}, { debounce: 500 })
-
-watch(() => props.layout, (layout) => {
-  enableSticky.value = layout === 'fit'
-}, { immediate: true })
-
-onMounted(async () => {
-  if (props.src)
-    openDoc(props.src, props.password, props.config)
-})
-
-onLoaded((doc) => {
-  emit('loaded', doc)
-})
-
-onError((error_) => {
-  if (error_.message === 'INVALID_PASSWORD')
-    emit('error-password', error_)
-
-  emit('error', error_)
-})
-
-onReady((pdfViewer) => {
-  emit('ready', pdfViewer)
-})
-
-function zoomIn () {
-  pdfScale.value = (Math.round(pdfScale.value / 0.1) * 0.1) + 0.1
-}
-
-function zoomOut () {
-  pdfScale.value = (Math.round(pdfScale.value / 0.1) * 0.1) - 0.1
-}
-
-function next () {
-  pdfPage.value++
-}
-
-function prev () {
-  pdfPage.value--
-}
-
-function first () {
-  pdfPage.value = 1
-}
-
-function last () {
-  pdfPage.value = totalPage.value
-}
-
-provide(PDF_VIEWER_CONTEXT, {
-  page : pdfPage,
-  scale: pdfScale,
-  totalPage,
-  zoomIn,
-  zoomOut,
-  next,
-  prev,
-  first,
-  last,
-})
-
-syncRef(pdfPage, vPage)
-syncRef(pdfScale, vScale)
-
-defineExpose({
-  page : pdfPage,
-  scale: pdfScale,
-  root,
-  container,
-  viewer,
-  loading,
-  totalPage,
-  zoomIn,
-  zoomOut,
-  next,
-  prev,
-  openDoc,
-  closeDoc,
-  instance,
-})
-</script>
-
-<style lang="postcss">
-.pdf {
-  --p-pdf-container-width: 793px;
-
-  @apply relative overflow-hidden w-full flex flex-col bg-base z-1;
-  @apply dark:bg-dark-base;
-
-  &__wrapper {
-    @apply relative h-full w-full grow;
-  }
-
-  &__container {
-    -webkit-overflow-scrolling: touch;
-
-    @apply absolute inset-0 h-full w-full overflow-auto shadow-inner;
-  }
-
-  &__header {
-    @apply z-1 bg-default shadow-lg;
-    @apply dark:bg-dark-default;
-  }
-
-  &__footer {
-    @apply z-1 bg-default shadow-lg-top;
-    @apply dark:bg-dark-default;
-  }
-}
-</style>