@privyid/persona 1.1.2 → 1.2.1-rc.0

package/dist/components/camera/utils/motion.mjs

@@ -1,88 +0,0 @@
-export const MOTION_THRESHOLD = 40;
-export const MOTION_FPS = 15;
-export const MOTION_AREA_SIZE = 160;
-export function takeSample(canvas, video) {
-  const context = canvas.getContext("2d", { willReadFrequently: true });
-  context.drawImage(
-    video,
-    video.videoWidth / 2 - MOTION_AREA_SIZE,
-    video.videoHeight / 2 - MOTION_AREA_SIZE,
-    MOTION_AREA_SIZE,
-    MOTION_AREA_SIZE,
-    0,
-    0,
-    MOTION_AREA_SIZE,
-    MOTION_AREA_SIZE
-  );
-  return context.getImageData(0, 0, canvas.width, canvas.height);
-}
-export function createTemplate(imageData) {
-  const centerX = imageData.width / 2;
-  const centerY = imageData.height / 2;
-  const width = imageData.width / 4;
-  const height = imageData.height / 4;
-  const xPos = centerX - width / 2;
-  const yPos = centerY - height / 2;
-  const buffer = new Uint8ClampedArray(width * height);
-  const template = {
-    centerX,
-    centerY,
-    width,
-    height,
-    xPos,
-    yPos,
-    buffer
-  };
-  const p = imageData.data;
-  let counter = 0;
-  for (let y = template.yPos; y < template.yPos + template.height; y++) {
-    let bufferIndex = y * imageData.width * 4 + template.xPos * 4 + 1;
-    for (let x = template.xPos; x < template.xPos + template.width; x++) {
-      template.buffer[counter++] = p[bufferIndex];
-      bufferIndex += 4;
-    }
-  }
-  return template;
-}
-export function motionDetection(imageData, template) {
-  let bestHitX = 0;
-  let bestHitY = 0;
-  let maxCorr = 0;
-  const searchWidth = imageData.width / 4;
-  const searchHeight = imageData.height / 4;
-  const p = imageData.data;
-  for (let y = template.centerY - searchHeight; y <= template.centerY + searchHeight - template.height; y++) {
-    for (let x = template.centerX - searchWidth; x <= template.centerX + searchWidth - template.width; x++) {
-      let nominator = 0;
-      let denominator = 0;
-      let templateIndex = 0;
-      for (let ty = 0; ty < template.height; ty++) {
-        let bufferIndex = x * 4 + 1 + (y + ty) * imageData.width * 4;
-        for (let tx = 0; tx < template.width; tx++) {
-          const imagepixel = p[bufferIndex];
-          nominator += template.buffer[templateIndex++] * imagepixel;
-          denominator += imagepixel * imagepixel;
-          bufferIndex += 4;
-        }
-      }
-      let ncc = 0;
-      if (denominator > 0)
-        ncc = nominator * nominator / denominator;
-      if (ncc > maxCorr) {
-        maxCorr = ncc;
-        bestHitX = x;
-        bestHitY = y;
-      }
-    }
-  }
-  const distX = bestHitX - template.xPos;
-  const distY = bestHitY - template.yPos;
-  const movementDiff = Math.hypot(distX, distY);
-  const maxDistX = searchWidth - template.width / 2;
-  const maxDistY = searchHeight - template.height / 2;
-  const maximumMovement = Math.hypot(maxDistX, maxDistY);
-  let movementPercentage = movementDiff / maximumMovement * 100;
-  if (movementPercentage > 100)
-    movementPercentage = 100;
-  return movementPercentage;
-}

package/dist/components/camera/utils/take-picture.d.ts

@@ -1 +0,0 @@
-export declare function takePicture(video: HTMLVideoElement, mirror?: boolean): string;

package/dist/components/camera/utils/take-picture.mjs

@@ -1,14 +0,0 @@
-export function takePicture(video, mirror = false) {
-  const canvas = document.createElement("canvas");
-  const context = canvas.getContext("2d");
-  canvas.width = video.videoWidth;
-  canvas.height = video.videoHeight;
-  if (mirror) {
-    context.save();
-    context.scale(-1, 1);
-    context.drawImage(video, 0, 0, canvas.width * -1, canvas.height);
-    context.restore();
-  } else
-    context.drawImage(video, 0, 0, canvas.width, canvas.height);
-  return canvas.toDataURL("image/jpeg");
-}

package/dist/components/caption/Caption.vue

@@ -1,122 +0,0 @@
-<template>
-  <span
-    data-testid="caption"
-    :class="classNames">
-    <slot />
-  </span>
-</template>
-
-<script lang="ts" setup>
-import type { PropType } from 'vue-demi'
-import { computed } from 'vue-demi'
-import type { WeightVariant, TransformVariant } from '../heading'
-import type { SizeVariant } from '.'
-
-const props = defineProps({
-  weight: {
-    type   : String as PropType<WeightVariant>,
-    default: 'normal',
-  },
-  transform: {
-    type   : String as PropType<TransformVariant>,
-    default: 'normalcase',
-  },
-  size: {
-    type   : String as PropType<SizeVariant>,
-    default: 'xs',
-  },
-})
-
-const classNames = computed(() => {
-  const result: string[] = ['caption']
-
-  if (props.transform)
-    result.push(`caption--${props.transform}`)
-
-  if (props.weight)
-    result.push(`caption--${props.weight}`)
-
-  // eslint-disable-next-line unicorn/explicit-length-check
-  if (props.size)
-    result.push(`caption--${props.size}`)
-
-  return result
-})
-</script>
-
-<style lang="postcss">
-.caption {
-  @apply block text-xs tracking-wide;
-
-  &:not([class^='text-'], [class*='text-']) {
-    @apply text-muted;
-    @apply dark:text-dark-muted;
-  }
-
-  /**
-  * Caption in tiny size
-  */
-  &--tn {
-    @apply text-tn tracking-wider;
-  }
-
-  /**
-  * Weight of caption
-  */
-  &--thin {
-    @apply font-thin;
-  }
-
-  &--extralight {
-    @apply font-extralight;
-  }
-
-  &--light {
-    @apply font-light;
-  }
-
-  &--normal {
-    @apply font-normal;
-  }
-
-  &--semibold {
-    @apply font-semibold;
-  }
-
-  &--medium {
-    @apply font-medium;
-  }
-
-  &--bold {
-    @apply font-bold;
-  }
-
-  &--extrabold {
-    @apply font-extrabold;
-  }
-
-  &--black {
-    @apply font-black;
-  }
-
-  /**
-  * Text transform
-  * of caption
-  */
-  &--normalcase {
-    @apply normal-case;
-  }
-
-  &--lowercase {
-    @apply lowercase;
-  }
-
-  &--capitalize {
-    @apply capitalize;
-  }
-
-  &--uppercase {
-    @apply uppercase;
-  }
-}
-</style>

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

@@ -1 +0,0 @@
-export type SizeVariant = 'xs' | 'tn';

package/dist/components/card/Card.vue

@@ -1,354 +0,0 @@
-<template>
-  <component
-    :is="elementNames"
-    v-if="show"
-    data-testid="card"
-    :class="classNames">
-    <header
-      v-if="$slots.header"
-      data-testid="card-header"
-      class="card__header">
-      <slot name="header" />
-    </header>
-
-    <header
-      v-else-if="title"
-      class="card__header card__header--default">
-      <Heading element="h6">
-        {{ title }}
-      </Heading>
-
-      <span
-        v-if="$slots.action && !callout"
-        data-testid="card-header-action"
-        class="card__header__action">
-        <slot name="action" />
-      </span>
-
-      <span
-        v-if="dismissable && callout"
-        data-testid="card-callout-dismiss"
-        class="card__header__dismiss"
-        @click="close()">
-        <IconClose />
-      </span>
-    </header>
-
-    <div
-      v-if="!sectioned"
-      data-testid="card-body"
-      class="card__body"
-      :class="bodyClass">
-      <slot />
-    </div>
-    <slot v-else />
-
-    <footer
-      v-if="$slots.footer"
-      data-testid="card-footer"
-      class="card__footer">
-      <slot name="footer" />
-    </footer>
-  </component>
-</template>
-
-<script lang="ts" setup>
-import type { PropType, VNode } from 'vue-demi'
-import { computed, ref } from 'vue-demi'
-import IconClose from '@privyid/persona-icon/vue/close/16.vue'
-import Heading from '../heading/Heading.vue'
-import type { ElementVariant, SpacingVariant } from '.'
-
-const props = defineProps({
-  element: {
-    type   : String as PropType<ElementVariant>,
-    default: 'section',
-  },
-  title: {
-    type   : String,
-    default: undefined,
-  },
-  sectioned: {
-    type   : Boolean,
-    default: false,
-  },
-  disabled: {
-    type   : Boolean,
-    default: false,
-  },
-  readonly: {
-    type   : Boolean,
-    default: false,
-  },
-  callout: {
-    type   : Boolean,
-    default: false,
-  },
-  dismissable: {
-    type   : Boolean,
-    default: true,
-  },
-  bodyClass: {
-    type   : [String, Array],
-    default: undefined,
-  },
-  spacing: {
-    type   : String as PropType<SpacingVariant>,
-    default: 'md',
-  },
-})
-
-const emit = defineEmits<{
-  'dismissed': [],
-}>()
-
-const show = ref(true)
-
-const classNames = computed(() => {
-  const result: string[] = ['card']
-
-  if (props.sectioned)
-    result.push('card--sectioned')
-
-  if (props.disabled)
-    result.push('card--disabled')
-
-  if (props.readonly)
-    result.push('card--readonly')
-
-  if (props.callout)
-    result.push('card--callout')
-
-  if (props.spacing)
-    result.push(`card--spacing-${props.spacing}`)
-
-  return result
-})
-
-const elementNames = computed(() => {
-  return props.element
-})
-
-function close (): void {
-  show.value = false
-
-  emit('dismissed')
-}
-
-defineExpose({ close })
-
-defineSlots<{
-  'header'(): VNode[],
-  'action'(): VNode[],
-  'footer'(): VNode[],
-  'default'(): VNode[],
-}>()
-</script>
-
-<style lang="postcss">
-/**
-* Component Name: Card
-* Component URI : https : //www.figma.com/file/JIYmbyRYZHc9bnVp6Npm9K/B-A-S-E-%2F-Components?node-id=294%3A5079
-* Date Created  : May 22, 2022
-* Last Update   : Nov 08, 2024
-*/
-.card {
-  --p-card-padding-x: theme(spacing.6);
-  --p-card-padding-y: theme(spacing.6);
-  --p-card-bg: theme(backgroundColor.default.DEFAULT);
-  --p-card-bg-dark: theme(backgroundColor.dark.default.DEFAULT);
-  --p-card-border: theme(borderColor.default.DEFAULT);
-  --p-card-border-dark: theme(borderColor.dark.default.DEFAULT);
-  --p-card-color: theme(textColor.default);
-  --p-card-color-dark: theme(textColor.dark.default);
-  --p-card-border-radius: theme(borderRadius.md);
-  --p-card-inside-border-radius: theme(borderRadius.DEFAULT);
-
-  @apply border bg-[color:var(--p-card-bg)] border-[color:var(--p-card-border)] text-[color:var(--p-card-color)] rounded-[var(--p-card-border-radius)];
-  @apply dark:bg-[color:var(--p-card-bg-dark)] dark:border-[color:var(--p-card-border-dark)] dark:text-[color:var(--p-card-color-dark)];
-
-  /**
-  * Card inside card
-  * has 8px rounded
-  */
-  .card {
-    @apply rounded-[var(--p-card-inside-border-radius)];
-  }
-
-  &&--spacing {
-    &-sm {
-      --p-card-padding-x: theme(spacing.4);
-      --p-card-padding-y: theme(spacing.4);
-    }
-
-    &-md {
-      --p-card-padding-x: theme(spacing.6);
-      --p-card-padding-y: theme(spacing.6);
-    }
-
-    &-lg {
-      --p-card-padding-x: theme(spacing.9);
-      --p-card-padding-y: theme(spacing.9);
-    }
-
-    &-xl {
-      --p-card-padding-x: theme(spacing.12);
-      --p-card-padding-y: theme(spacing.12);
-    }
-  }
-
-  /*
-  * Card Body & Card Header
-  * by default have 24px (1.5rem) padding
-  */
-  &__header,
-  &__body {
-    @apply pt-[var(--p-card-padding-y)] px-[var(--p-card-padding-x)];
-  }
-
-  &__body {
-    @apply pb-[var(--p-card-padding-y)];
-
-    > .card__section {
-      @apply pt-0;
-    }
-
-    .card__section {
-      @apply border-b border-subtle-alpha;
-      @apply dark:border-dark-subtle-alpha;
-
-      /**
-      * Adding border-top in the first element
-      * of Card Sub-Section and provide 24px (1.5rem)
-      * of margin-top
-      */
-      &:first-child {
-        @apply border-t mt-[var(--p-card-padding-y)];
-      }
-
-      &:last-child {
-        /**
-        * Remove padding-bottom of Card Body
-        * from the last element of Card Sub-Section
-        */
-        .card__body {
-          @apply pb-0;
-        }
-      }
-
-      /**
-      * Remove padding-left-right Card Body
-      * in Card Sub-Section
-      */
-      .card__body {
-        @apply px-0;
-      }
-    }
-  }
-
-  /**
-  * If Card have Section,
-  * padding of card-body-top-parent set to 0
-  */
-  &&--sectioned {
-    &:has(.card__section--readonly) {
-      .card__section:first-child:where(.card__section--readonly) {
-        @apply rounded-t-[var(--p-card-border-radius)];
-      }
-
-      .card__section:last-child:where(.card__section--readonly) {
-        @apply rounded-b-[var(--p-card-border-radius)];
-      }
-    }
-    > .card__body {
-      @apply p-0;
-    }
-  }
-
-  /**
-  * Give background muted
-  * If Card disabled
-  */
-  &&--disabled {
-    @apply opacity-50 cursor-not-allowed;
-  }
-
-  /**
-  * Give background base
-  * when Card are readonly
-  */
-  &&--readonly {
-    @apply bg-ground cursor-not-allowed;
-    @apply dark:bg-dark-ground;
-  }
-
-  /**
-  * Provide box-shadow when
-  * Card Callout is enable
-  */
-  &&--callout {
-    @apply shadow-sm;
-  }
-
-  &__header {
-    .heading {
-      @apply font-medium leading-none;
-    }
-
-    &&--default {
-      @apply flex justify-between items-center;
-    }
-
-    &,
-    &__action {
-      a {
-        &:not(.btn) {
-          @apply text-xs;
-        }
-
-        + a {
-          @apply pl-3;
-        }
-      }
-    }
-
-    &__dismiss {
-      @apply text-default/30 hover:text-default/50 hover:cursor-pointer;
-      @apply dark:text-dark-default/30 hover:dark:text-dark-default/50;
-    }
-
-    + .card__body,
-    + .card__section > .card__body {
-      @apply pt-4;
-    }
-  }
-
-  &__section {
-    @apply border-b border-subtle-alpha;
-    @apply dark:border-dark-subtle-alpha;
-
-    &:last-child {
-      @apply border-b-0;
-    }
-
-    &&--disabled,
-    &.card--disabled {
-      @apply opacity-50 cursor-not-allowed;
-    }
-
-    &&--readonly,
-    &.card--readonly {
-      @apply bg-ground cursor-not-allowed;
-      @apply dark:bg-dark-ground;
-    }
-
-    &.card--disabled {
-      @apply px-[var(--p-card-padding-x)] pb-[var(--p-card-padding-y)];
-    }
-  }
-
-  &__footer {
-    @apply pb-[var(--p-card-padding-y)] px-[var(--p-card-padding-x)] pt-8;
-  }
-}
-</style>

package/dist/components/card/CardSection.vue

@@ -1,81 +0,0 @@
-<template>
-  <div
-    data-testid="card-section"
-    :class="classNames">
-    <div
-      v-if="$slots.header"
-      data-testid="card-header"
-      class="card__header">
-      <slot name="header" />
-    </div>
-
-    <div
-      v-else-if="title"
-      class="card__header card__header--default">
-      <Subheading
-        class="card__header__title"
-        weight="medium"
-        overline>
-        {{ title }}
-      </Subheading>
-
-      <span
-        v-if="$slots.action"
-        data-testid="card-header-action"
-        class="card__header__action">
-        <slot name="action" />
-      </span>
-    </div>
-
-    <div class="card__body">
-      <slot />
-    </div>
-
-    <footer
-      v-if="$slots.footer"
-      data-testid="card-footer"
-      class="card__footer">
-      <slot name="footer" />
-    </footer>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import Subheading from '../subheading/Subheading.vue'
-import type { VNode } from 'vue-demi'
-import { computed } from 'vue-demi'
-
-const props = defineProps({
-  title: {
-    type   : String,
-    default: undefined,
-  },
-  disabled: {
-    type   : Boolean,
-    default: false,
-  },
-  readonly: {
-    type   : Boolean,
-    default: false,
-  },
-})
-
-const classNames = computed(() => {
-  const result: String[] = ['card__section']
-
-  if (props.disabled)
-    result.push('card__section--disabled')
-
-  if (props.readonly)
-    result.push('card__section--readonly')
-
-  return result
-})
-
-defineSlots<{
-  'header':() => VNode[],
-  'action':() => VNode[],
-  'footer':() => VNode[],
-  'default':() => VNode[],
-}>()
-</script>

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

@@ -1,2 +0,0 @@
-export type ElementVariant = 'div' | 'section' | 'article';
-export type SpacingVariant = 'sm' | 'md' | 'lg' | 'xl';