@privyid/persona 1.2.0 → 1.2.1-rc.0

package/dist/components/tour/utils/wait-element.spec.mjs

@@ -1,37 +0,0 @@
-import { vi } from "vitest";
-import { isVisible, focus } from "./__mocks__/is-visible.mjs";
-import MutationObserver, { triggerMutation } from "./__mocks__/mutation-observer.mjs";
-import { waitElement } from "./wait-element.mjs";
-vi.mock("./is-visible.ts", () => ({ isVisible }));
-vi.mock("./focus.ts", () => ({ focus }));
-vi.stubGlobal("MutationObserver", MutationObserver);
-it("should able to get element match by querySelector", async () => {
-  const sample = document.createElement("div");
-  sample.id = "sample";
-  document.body.append(sample);
-  const target = await waitElement("#sample");
-  expect(target).toBe(sample);
-});
-it("should throw error if target not visible", () => {
-  isVisible.mockReturnValueOnce(false);
-  const sample = document.createElement("div");
-  sample.id = "sample";
-  document.body.append(sample);
-  const promise = waitElement("#sample");
-  expect(promise).toReject();
-});
-it("should throw error if target not visible", async () => {
-  vi.useFakeTimers();
-  const promise = waitElement("#sample", 100);
-  vi.advanceTimersByTime(200);
-  await expect(promise).toReject();
-  vi.useRealTimers();
-});
-it("should throw error if target not visible", async () => {
-  const promise = waitElement("#sample");
-  const sample = document.createElement("div");
-  sample.id = "sample";
-  document.body.append(sample);
-  triggerMutation();
-  await expect(promise).toResolve();
-});

package/dist/components/truncate/Truncate.spec.d.ts

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

package/dist/components/truncate/Truncate.spec.mjs

@@ -1,133 +0,0 @@
-import { render, fireEvent } from "@testing-library/vue";
-import Truncate from "./Truncate.vue";
-it("should be able to truncate long text", () => {
-  const screen = render({
-    components: { Truncate },
-    template: `
-      <Truncate
-        text="1234567890"
-        length="8" />
-    `
-  });
-  const span = screen.queryByTestId("truncate");
-  expect(span).toHaveTextContent("12345...");
-});
-it("should not truncate the text if text's length less than max length", () => {
-  const screen = render({
-    components: { Truncate },
-    template: `
-      <Truncate
-        text="1234567890"
-        length="15" />
-    `
-  });
-  const span = screen.queryByTestId("truncate");
-  expect(span).toHaveTextContent("1234567890");
-});
-it("should be able to change the omission text via prop `omission`", () => {
-  const screen = render({
-    components: { Truncate },
-    template: `
-      <Truncate
-        text="1234567890"
-        length="8"
-        omission="[...]" />
-    `
-  });
-  const span = screen.queryByTestId("truncate");
-  expect(span).toHaveTextContent("123[...]");
-});
-it('should show button "Show More" if prop `expandable` is provided', () => {
-  const screen = render({
-    components: { Truncate },
-    template: `
-      <Truncate
-        text="1234567890"
-        length="8"
-        expandable />
-    `
-  });
-  const span = screen.queryByTestId("truncate");
-  const expand = screen.queryByText("Show More");
-  expect(span).toHaveTextContent("12345...");
-  expect(expand).toBeInTheDocument();
-});
-it(`should not show button "Show More" if text's length less than max length`, () => {
-  const screen = render({
-    components: { Truncate },
-    template: `
-      <Truncate
-        text="1234567890"
-        length="15"
-        expandable />
-    `
-  });
-  const span = screen.queryByTestId("truncate");
-  const expand = screen.queryByText("Show More");
-  expect(span).toHaveTextContent("1234567890");
-  expect(expand).not.toBeInTheDocument();
-});
-it('should toggle the text if "Show More" clicked', async () => {
-  const screen = render({
-    components: { Truncate },
-    template: `
-      <Truncate
-        text="1234567890"
-        length="8"
-        expandable />
-    `
-  });
-  let expand = screen.queryByTestId("truncate-expand");
-  let span = screen.queryByTestId("truncate");
-  expect(span).toHaveTextContent("12345...");
-  expect(expand).toBeInTheDocument();
-  await fireEvent.click(expand);
-  span = screen.queryByTestId("truncate");
-  expand = screen.queryByTestId("truncate-expand");
-  expect(span).toHaveTextContent("1234567890");
-  expect(expand).toHaveTextContent("Show Less");
-  await fireEvent.click(expand);
-  span = screen.queryByTestId("truncate");
-  expand = screen.queryByTestId("truncate-expand");
-  expect(span).toHaveTextContent("12345...");
-  expect(expand).toHaveTextContent("Show More");
-});
-it("should be able to change the text using props `show-more-text` and `show-less-text`", async () => {
-  const screen = render({
-    components: { Truncate },
-    template: `
-      <Truncate
-        text="1234567890"
-        length="8"
-        expandable
-        show-more-text="Lihat Selengkapnya"
-        show-less-text="Sembunyikan" />
-    `
-  });
-  let expand = screen.queryByTestId("truncate-expand");
-  let span = screen.queryByTestId("truncate");
-  expect(span).toHaveTextContent("12345...");
-  expect(expand).toBeInTheDocument();
-  await fireEvent.click(expand);
-  span = screen.queryByTestId("truncate");
-  expand = screen.queryByTestId("truncate-expand");
-  expect(span).toHaveTextContent("1234567890");
-  expect(expand).toHaveTextContent("Sembunyikan");
-  await fireEvent.click(expand);
-  span = screen.queryByTestId("truncate");
-  expand = screen.queryByTestId("truncate-expand");
-  expect(span).toHaveTextContent("12345...");
-  expect(expand).toHaveTextContent("Lihat Selengkapnya");
-});
-it("should not truncate anything if length is invalid value", () => {
-  const screen = render({
-    components: { Truncate },
-    template: `
-      <Truncate
-        text="123456789123456789123456789"
-        length="invalid" />
-    `
-  });
-  const span = screen.queryByTestId("truncate");
-  expect(span).toHaveTextContent("123456789123456789123456789");
-});

package/dist/components/truncate/Truncate.vue

@@ -1,69 +0,0 @@
-<template>
-  <transition
-    name="fade"
-    mode="out-in">
-    <span
-      :key="`${expand}`"
-      v-p-tooltip.long="tooltip && !expandable && text.length > maxLength"
-      class="truncated"
-      data-testid="truncate"
-      :title="text">
-      {{ viewText }}
-      <template v-if="expandable && text.length > maxLength">
-        <a
-          data-testid="truncate-expand"
-          href="javascript:void"
-          @click.stop.prevent="toggle">
-          {{ expand ? showLessText : showMoreText }}
-        </a>
-      </template>
-    </span>
-  </transition>
-</template>
-
-<script setup>
-import { ref, computed } from "vue-demi";
-import { vPTooltip } from "../tooltip";
-const props = defineProps({
-  text: {
-    type: String,
-    default: ""
-  },
-  length: {
-    type: [Number, String],
-    default: 100
-  },
-  omission: {
-    type: String,
-    default: "..."
-  },
-  expandable: {
-    type: Boolean,
-    default: false
-  },
-  showMoreText: {
-    type: String,
-    default: "Show More"
-  },
-  showLessText: {
-    type: String,
-    default: "Show Less"
-  },
-  tooltip: {
-    type: Boolean,
-    default: true
-  }
-});
-const expand = ref(false);
-const maxLength = computed(() => {
-  return Number.parseInt(`${props.length}`);
-});
-const viewText = computed(() => {
-  if (expand.value || Number.isNaN(maxLength.value) || props.text.length <= maxLength.value)
-    return props.text;
-  return `${props.text.slice(0, maxLength.value - props.omission.length)}${props.omission}`;
-});
-function toggle() {
-  expand.value = !expand.value;
-}
-</script>

package/dist/components/truncate/Truncate.vue.d.ts

@@ -1,68 +0,0 @@
-declare const _default: import("vue-demi").DefineComponent<import("vue-demi").ExtractPropTypes<{
-    text: {
-        type: StringConstructor;
-        default: string;
-    };
-    length: {
-        type: (StringConstructor | NumberConstructor)[];
-        default: number;
-    };
-    omission: {
-        type: StringConstructor;
-        default: string;
-    };
-    expandable: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    showMoreText: {
-        type: StringConstructor;
-        default: string;
-    };
-    showLessText: {
-        type: StringConstructor;
-        default: string;
-    };
-    tooltip: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>, {}, {}, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {}, string, import("vue-demi").PublicProps, Readonly<import("vue-demi").ExtractPropTypes<{
-    text: {
-        type: StringConstructor;
-        default: string;
-    };
-    length: {
-        type: (StringConstructor | NumberConstructor)[];
-        default: number;
-    };
-    omission: {
-        type: StringConstructor;
-        default: string;
-    };
-    expandable: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    showMoreText: {
-        type: StringConstructor;
-        default: string;
-    };
-    showLessText: {
-        type: StringConstructor;
-        default: string;
-    };
-    tooltip: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>> & Readonly<{}>, {
-    text: string;
-    length: string | number;
-    tooltip: boolean;
-    showMoreText: string;
-    showLessText: string;
-    omission: string;
-    expandable: boolean;
-}, {}, {}, {}, string, import("vue-demi").ComponentProvideOptions, true, {}, any>;
-export default _default;

package/dist/components/truncate/index.md

@@ -1,136 +0,0 @@
----
-title: Truncate · Components
-description: Limiting long text.
----
-
-<script setup>
-  import pTruncate from './Truncate.vue'
-</script>
-
-# Truncate
-
-> Limiting long text.
-
-## Usage
-
-### Simple Usage
-
-<preview>
-  <p-truncate
-    text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam, iste."
-    length="30" />
-</preview>
-
-```vue
-<template>
-  <p-truncate
-    text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam, iste."
-    length="30" />
-</template>
-```
-
-## Custom Omission
-
-<preview>
-  <p-truncate
-    text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam, iste."
-    length="30"
-    omission=" [...]" />
-</preview>
-
-```vue
-<template>
-  <p-truncate
-    text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam, iste."
-    length="30"
-    omission=" [...]" />
-</template>
-```
-
-## Expandable
-
-<preview>
-  <p-truncate
-    text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam, iste."
-    length="30"
-    expandable />
-</preview>
-
-```vue
-<template>
-  <p-truncate
-    text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam, iste."
-    length="30"
-    expandable />
-</template>
-```
-
-### Custom Text
-
-You can change "show more" and "show less" text via prop `show-more-text` and `show-less-text`
-
-<preview>
-  <p-truncate
-    text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam, iste."
-    length="30"
-    expandable
-    show-more-text="Lihat Selengkapnya"
-    show-less-text="Sembunyikan" />
-</preview>
-
-```vue
-<template>
-  <p-truncate
-    text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam, iste."
-    length="30"
-    expandable
-    show-more-text="Lihat Selengkapnya"
-    show-less-text="Sembunyikan" />
-</template>
-```
-
-## API
-
-### Props
-
-| Props          |   Type    |   Default   | Description                      |
-|----------------|:---------:|:-----------:|----------------------------------|
-| `text`         | `String`  |     `-`     | Text to truncate                 |
-| `length`       | `Number`  |    `100`    | Max length before text truncated |
-| `tooltip`      | `Boolean` |   `true`    | Show tooltip of fulltext         |
-| `expandable`   | `Boolean` |   `false`   | Show expand button               |
-| `showMoreText` | `String`  | `Show More` | Text for show more's button      |
-| `showLessText` | `String`  | `Show Less` | Text for show less's button      |
-
-### Slots
-
-<table>
-  <thead>
-    <tr>
-      <th>Name</th>
-      <th>Description</th>
-    </tr>
-  </thead>
-  <tbody>
-    <tr>
-      <td colspan="2" class="text-center">There no slots here</td>
-    </tr>
-  </tbody>
-</table>
-
-### Events
-
-<table>
-  <thead>
-    <tr>
-      <th>Name</th>
-      <th>Arguments</th>
-      <th>Description</th>
-    </tr>
-  </thead>
-  <tbody>
-    <tr>
-      <td colspan="3" class="text-center">There no props here</td>
-    </tr>
-  </tbody>
-</table>

package/dist/components/utils/array.d.ts

@@ -1,2 +0,0 @@
-export declare function arrayFilter(list: unknown[], filterBy: Record<string, any>): unknown[];
-export declare function arraySort(list: unknown[], sortBy: Record<string, string>): unknown[];

package/dist/components/utils/array.mjs

@@ -1,19 +0,0 @@
-import { orderBy } from "lodash-es";
-import { isEqual } from "./value.mjs";
-export function arrayFilter(list, filterBy) {
-  const filters = Object.entries(filterBy);
-  return list.filter((item) => {
-    return filters.every(([key, value]) => isEqual(item[key], value));
-  });
-}
-export function arraySort(list, sortBy) {
-  const sortKey = [];
-  const sortOrder = [];
-  for (const [key, order] of Object.entries(sortBy)) {
-    if (order === "asc" || order === "desc") {
-      sortKey.push(key);
-      sortOrder.push(order);
-    }
-  }
-  return orderBy(list, sortKey, sortOrder);
-}

package/dist/components/utils/base64.d.ts

@@ -1,8 +0,0 @@
-export declare function toBase64(file: globalThis.File): Promise<string>;
-/**
- * Convert base64 data-uri to File, return undefine if failed to decode
- * @param dataurl data base64
- * @param filename output's filename
- * @param mimeType output's mimeType
- */
-export declare function fromBase64(dataurl: string, filename?: string, mimeType?: string): globalThis.File | undefined;

package/dist/components/utils/base64.mjs

@@ -1,35 +0,0 @@
-export function toBase64(file) {
-  return new Promise((resolve, reject) => {
-    const reader = new FileReader();
-    const onLoad = () => {
-      cleanup();
-      resolve(reader.result);
-    };
-    const onError = (error) => {
-      cleanup();
-      reject(error);
-    };
-    const cleanup = () => {
-      reader.removeEventListener("load", onLoad);
-      reader.removeEventListener("error", onError);
-    };
-    reader.addEventListener("load", onLoad);
-    reader.addEventListener("error", onError);
-    reader.readAsDataURL(file);
-  });
-}
-export function fromBase64(dataurl, filename, mimeType) {
-  if (!dataurl)
-    return;
-  try {
-    const name = filename ?? (/* @__PURE__ */ new Date()).toISOString();
-    const [meta, body] = dataurl.split(",");
-    const mime = mimeType ?? meta.match(/:(.*?);/)[1];
-    const buffer = window.atob(body);
-    const uint8 = Uint8Array.from(buffer, (c) => c.codePointAt(0));
-    return new globalThis.File([uint8], name, { type: mime });
-  } catch (error) {
-    if (import.meta.env.DEV)
-      console.warn(error);
-  }
-}

package/dist/components/utils/base64.spec.d.ts

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

package/dist/components/utils/base64.spec.mjs

@@ -1,30 +0,0 @@
-import { vi } from "vitest";
-import { fromBase64, toBase64 } from "./base64.mjs";
-const fr = vi.spyOn(FileReader.prototype, "readAsDataURL");
-describe("toBase64", () => {
-  it('should able to encode "File" object to base64-datauri', async () => {
-    const file = new File(["abcdefghijkl"], "notes.txt", { type: "text/plain" });
-    const result = await toBase64(file);
-    expect(result).toBe("data:text/plain;base64,YWJjZGVmZ2hpamts");
-  });
-  it("should throw error if File Reader got an error", async () => {
-    fr.mockImplementation(function() {
-      this.dispatchEvent(new Event("error"));
-    });
-    const file = new File(["abcdefghijkl"], "notes.txt", { type: "text/plain" });
-    const promise = toBase64(file);
-    expect(promise).toReject();
-  });
-});
-describe("fromBase64", () => {
-  it('should able to decode base64 to "File" object', async () => {
-    const file = fromBase64("data:text/plain;base64,YWJjZGVmZ2hpamts");
-    const result = await file.text();
-    expect(result).toBe("abcdefghijkl");
-  });
-  it("should able to change name and mimeType of output file", async () => {
-    const file = fromBase64("data:text/plain;base64,YWJjZGVmZ2hpamts", "index.html", "text/html");
-    expect(file.name).toBe("index.html");
-    expect(file.type).toBe("text/html");
-  });
-});

package/dist/components/utils/color.d.ts

@@ -1,17 +0,0 @@
-interface RGB {
-    R: number;
-    G: number;
-    B: number;
-}
-/**
- * Parse hex string to R,G,B Object
- * @param color hex string color
- * @example toRGB('#6E1E62') // {R: 110, G: 30, B: 98}
- */
-export declare function toRGB(color: string): RGB;
-/**
- * Get brightness of color
- * @param color hex string color
- */
-export declare function getBrightness(color: string): number;
-export {};

package/dist/components/utils/color.mjs

@@ -1,14 +0,0 @@
-export function toRGB(color) {
-  const r = color.slice(1, 3);
-  const g = color.slice(3, 5);
-  const b = color.slice(5, 7);
-  return {
-    R: Number.parseInt(r, 16),
-    G: Number.parseInt(g, 16),
-    B: Number.parseInt(b, 16)
-  };
-}
-export function getBrightness(color) {
-  const rgb = toRGB(color);
-  return rgb.R * 299 + rgb.G * 587 + rgb.B * 114 / 1e3;
-}

package/dist/components/utils/date.d.ts

@@ -1,22 +0,0 @@
-import type { Locale } from 'date-fns';
-import { format } from 'date-fns';
-/**
- * Format date using date-fns/format,
- * Automatically switch local following global lang setting.
- * @param date Date
- * @param formatStr date format
- */
-export declare function formatDate(...args: Parameters<typeof format>): string;
-/**
- * Install locale pack
- * @param name Language name, ex: `fr`
- * @param locale Language Pack Object
- */
-export declare function installLocale(name: string, locale: Locale): void;
-/**
- * Get locale pack
- * @param name language name, ex: 'fr'
- */
-export declare function getLocale(name?: (string & {
-    _?: never;
-}) | "id" | "en"): any;

package/dist/components/utils/date.mjs

@@ -1,14 +0,0 @@
-import { id, enUS as en } from "date-fns/locale";
-import { getLang } from "../global/store.mjs";
-import { format } from "date-fns";
-import defu from "defu";
-const localePacks = { en, id };
-export function formatDate(...args) {
-  return format(args[0], args[1], defu(args[2], { locale: getLocale() }));
-}
-export function installLocale(name, locale) {
-  localePacks[name] = locale;
-}
-export function getLocale(name = getLang()) {
-  return localePacks[name];
-}

package/dist/components/utils/date.spec.d.ts

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

package/dist/components/utils/date.spec.mjs

@@ -1,28 +0,0 @@
-import { describe } from "vitest";
-import { initStore, setLang } from "../global/store.mjs";
-import {
-  formatDate,
-  getLocale,
-  installLocale
-} from "./date.mjs";
-import { fr } from "date-fns/locale";
-beforeEach(() => {
-  initStore();
-});
-describe("formatDate", () => {
-  it("should able to format date using global lang setting", () => {
-    const date = new Date(2022, 4, 1);
-    expect(formatDate(date, "EEEE")).toBe("Sunday");
-    setLang("id");
-    expect(formatDate(date, "EEEE")).toBe("Minggu");
-  });
-});
-describe("installLocale", () => {
-  it("should able to install new lang pack", () => {
-    installLocale("fr", fr);
-    setLang("fr");
-    const date = new Date(2022, 4, 1);
-    expect(formatDate(date, "EEEE")).toBe("dimanche");
-    expect(getLocale("fr")).toBe(fr);
-  });
-});

package/dist/components/utils/value.d.ts

@@ -1,8 +0,0 @@
-export type JsonObject = {
-    [Key in string]?: JsonValue;
-};
-export type JsonArray = JsonValue[];
-export type JsonPrimitive = string | number | boolean | null;
-export type JsonValue = JsonPrimitive | JsonObject | JsonArray;
-export declare function isEqual(a: unknown, b: unknown): boolean;
-export declare function valueIn(array: unknown[], value: unknown): boolean;

package/dist/components/utils/value.mjs

@@ -1,7 +0,0 @@
-import { deepEqual } from "fast-equals";
-export function isEqual(a, b) {
-  return deepEqual(a, b);
-}
-export function valueIn(array, value) {
-  return array.some((item) => isEqual(item, value));
-}