@privyid/persona 0.5.1 → 0.6.0

package/dist/components/caption/Caption.vue.d.ts

@@ -1,5 +1,6 @@
 import { PropType } from 'vue-demi';
-declare type SizeVariant = 'xs' | 'tn';
+import { WeightVariant, TransformVariant } from '../heading';
+import { SizeVariant } from '.';
 declare const _default: import("vue-demi").DefineComponent<{
     weight: {
         type: PropType<WeightVariant>;

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

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

package/dist/components/global/use-singleton.mjs

@@ -1,4 +1,4 @@
-import PQueue from "p-queue";
+import PQueue from "./utils/queue.mjs";
 import {
   createApp,
   h,
@@ -10,7 +10,7 @@ import {
 } from "vue-demi";
 let instances;
 let container;
-const queue = new PQueue({ concurrency: 1 });
+const queue = new PQueue();
 async function createInstance(id, component) {
   if (!instances)
     instances = shallowRef(/* @__PURE__ */ new Map());

package/dist/components/global/utils/queue.d.ts

@@ -0,0 +1,16 @@
+declare type Task<R> = () => Promise<R>;
+interface QueueJob<R> {
+    resolve: (value: R) => void;
+    reject: (reason: unknown) => void;
+    run: Task<R>;
+}
+export default class Queue {
+    protected queue: Array<QueueJob<unknown>>;
+    protected running: boolean;
+    constructor();
+    protected enqueue(job: QueueJob<unknown>): void;
+    protected dequeue(): QueueJob<unknown>;
+    add<R>(task: Task<R>): Promise<R>;
+    protected run(): Promise<void>;
+}
+export {};

package/dist/components/global/utils/queue.mjs

@@ -0,0 +1,33 @@
+export default class Queue {
+  constructor() {
+    this.queue = [];
+    this.running = false;
+  }
+  enqueue(job) {
+    this.queue.push(job);
+  }
+  dequeue() {
+    return this.queue.shift();
+  }
+  async add(task) {
+    return await new Promise((resolve, reject) => {
+      const queue = {
+        resolve,
+        reject,
+        run: task
+      };
+      this.enqueue(queue);
+      void this.run();
+    });
+  }
+  async run() {
+    if (this.queue.length > 0 && !this.running) {
+      this.running = true;
+      const job = this.dequeue();
+      job.run().then(job.resolve).catch(job.reject).finally(() => {
+        this.running = false;
+        void this.run();
+      });
+    }
+  }
+}

package/dist/components/navbar/Navbar.vue

@@ -12,9 +12,9 @@
 import {
   computed,
   defineComponent,
-  onMounted,
   provide,
-  toRef
+  toRef,
+  watchEffect
 } from "vue-demi";
 import {
   templateRef,
@@ -68,8 +68,13 @@ export default defineComponent({
         result.push(`navbar--expand-${props.toggleable}`);
       return result;
     });
-    onMounted(() => {
-      document.body?.style.setProperty("padding-top", `${height?.value}px`);
+    watchEffect((onCleanup) => {
+      if (typeof document !== "undefined" && document.body && props.fixed) {
+        document.body.style.setProperty("padding-top", `${height.value}px`);
+        onCleanup(() => {
+          document.body.style.removeProperty("padding-top");
+        });
+      }
     });
     return {
       classNames,

package/dist/components/tour/core/step/action.d.ts

@@ -1,6 +1,6 @@
-import userEvent from '@testing-library/user-event';
+import type UE from '@testing-library/user-event';
 import { AbstractStep } from '../step';
-declare type UserEvent = ReturnType<typeof userEvent['setup']>;
+declare type UserEvent = ReturnType<typeof UE['setup']>;
 declare type ExtractParams<F> = F extends (T: Element, ...args: infer P) => Promise<void> ? P : unknown[];
 export declare type EventType = 'click' | 'dblClick' | 'tripleClick' | 'type' | 'hover' | 'unhover' | 'clear';
 export declare type ParamsOf<E extends EventType> = ExtractParams<UserEvent[E]>;

package/dist/components/tour/core/step/action.mjs

@@ -1,9 +1,9 @@
-import userEvent from "@testing-library/user-event";
 import { AbstractStep } from "../step.mjs";
 import { waitElement } from "../../utils/wait-element.mjs";
 export default class StepAction extends AbstractStep {
   async run() {
     const options = this.getOptions();
+    const { default: userEvent } = await import("@testing-library/user-event");
     const target = await waitElement(options.target, options.waitTimeout);
     const user = userEvent.setup({ document });
     const action = options.action;

package/dist/components/tour/core/step/conditional.d.ts

@@ -16,7 +16,6 @@ interface Routine extends ConditionalOptions {
 export default class StepCondition extends AbstractStep<ConditionalOptions> {
     protected routines: Routine[];
     constructor(options: ConditionalOptions);
-    protected checkCondition(): Promise<boolean>;
     canChain(): boolean;
     chain(routine: Routine): this;
     getTotalChild(): number;

package/dist/components/tour/core/step/conditional.mjs

@@ -1,5 +1,4 @@
 import { unref } from "vue-demi";
-import { TourDirection } from "../base.mjs";
 import { AbstractStep } from "../step.mjs";
 export var ConditionalType = /* @__PURE__ */ ((ConditionalType2) => {
   ConditionalType2[ConditionalType2["IF"] = 1] = "IF";
@@ -18,17 +17,6 @@ export default class StepCondition extends AbstractStep {
       }
     ];
   }
-  async checkCondition() {
-    try {
-      const options = this.getOptions();
-      const condition = unref(options.condition);
-      return typeof condition === "function" ? await condition() : condition;
-    } catch (error) {
-      if (import.meta.env.DEV)
-        console.warn(error);
-      return false;
-    }
-  }
   canChain() {
     return this.routines.at(-1).type !== 3 /* ELSE */;
   }
@@ -55,8 +43,7 @@ export default class StepCondition extends AbstractStep {
       }
       if (result) {
         const tour = routine.tour;
-        const index = this.direction === TourDirection.BACKWARD ? tour.getSteps().length - 1 : 0;
-        await tour.setParent(this.parent).start(index, this.direction);
+        await tour.setParent(this.parent).setDirection(this.direction).start();
         this.onCleanup(async () => {
           await tour.stop();
         });

package/dist/components/tour/core/tour.d.ts

@@ -1,4 +1,4 @@
-import { BaseTourOptions, AbstractTour, TourDirection } from './base';
+import { BaseTourOptions, AbstractTour } from './base';
 /**
  * Basic Tour, it cover all basic tour functionality (prev, next, start, finish)
  */
@@ -48,6 +48,7 @@ export declare class Tour extends AbstractTour<TourOptions> {
     protected index: number;
     protected steps: AbstractTour[];
     protected onFinishedHooks: Array<() => void | Promise<void>>;
+    protected running: boolean;
     protected parent?: Tour;
     constructor(options?: Partial<TourOptions>);
     /**
@@ -62,6 +63,10 @@ export declare class Tour extends AbstractTour<TourOptions> {
      * Get list of steps
      */
     getSteps(): AbstractTour[];
+    /**
+     * Get running status
+     */
+    isRunning(): boolean;
     /**
      * Count total step, including Sub-Tour
      */
@@ -97,7 +102,7 @@ export declare class Tour extends AbstractTour<TourOptions> {
     /**
      * Show and start the tour
      */
-    start(index?: number, direction?: TourDirection): Promise<void>;
+    start(): Promise<void>;
     /**
      * Hide and stop the tour
      */

package/dist/components/tour/core/tour.mjs

@@ -7,6 +7,7 @@ import {
 export class Tour extends AbstractTour {
   constructor(options) {
     super(options);
+    this.running = false;
     this.index = -1;
     this.steps = [];
     this.onFinishedHooks = [];
@@ -32,6 +33,9 @@ export class Tour extends AbstractTour {
   getSteps() {
     return this.steps;
   }
+  isRunning() {
+    return this.running;
+  }
   getTotalChild() {
     let total = 0;
     for (const step of this.steps) {
@@ -100,9 +104,9 @@ export class Tour extends AbstractTour {
     await this.runOnFinishedHooks();
     await (this.parent ? this.parent.next() : this.stop());
   }
-  async start(index = 0, direction = TourDirection.FORWARD) {
-    this.index = index;
-    this.direction = direction;
+  async start() {
+    this.running = true;
+    this.index = this.direction === TourDirection.BACKWARD ? this.steps.length - 1 : 0;
     if (this.parent)
       this.attach(this.parent);
     await this.run();
@@ -111,6 +115,7 @@ export class Tour extends AbstractTour {
     await this.getCurrentStep().stop();
     if (this.parent)
       this.detach(this.parent);
+    this.running = false;
   }
   findIndex(id) {
     if (id instanceof AbstractTour)

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

@@ -1,3 +1,3 @@
 import { TourOptions } from './core/tour';
 import { TourStory } from './core/story';
-export declare function createTour(options?: TourOptions): TourStory;
+export declare function createTour(options?: Partial<TourOptions>): TourStory;

package/dist/components/utils/base64.mjs

@@ -1,5 +1,3 @@
-import { format } from "date-fns";
-import { Buffer } from "buffer";
 export function toBase64(file) {
   return new Promise((resolve, reject) => {
     const reader = new FileReader();
@@ -21,9 +19,9 @@ export function toBase64(file) {
   });
 }
 export function fromBase64(dataurl, filename, mimeType) {
-  const name = filename ?? format(new Date(), "yyyyMMddHHmmss");
+  const name = filename ?? new Date().toISOString();
   const [meta, body] = dataurl.split(",");
   const mime = mimeType ?? meta.match(/:(.*?);/)[1];
-  const buffer = Buffer.from(body, "base64");
+  const buffer = window.atob(body);
   return new globalThis.File([buffer], name, { type: mime });
 }

package/dist/core/index.d.ts

@@ -15,4 +15,5 @@ export { defineFilter, } from '../components/filterbar';
 export { markdown, } from '../components/markdown';
 export { initAppContext, useAppContext, } from '../components/global/context';
 export { useRouter, installRouter, } from '../components/global/router';
+export { createTour, } from '../components/tour';
 export { usePasswordStrength, } from '../components/input-password';

package/dist/core/index.mjs

@@ -51,6 +51,9 @@ export {
   useRouter,
   installRouter
 } from "../components/global/router";
+export {
+  createTour
+} from "../components/tour";
 export {
   usePasswordStrength
 } from "../components/input-password";

package/dist/module.d.ts

@@ -6,6 +6,11 @@ interface ModuleOptions {
      * @default true
      */
     font?: boolean;
+    /**
+     * Component prefix
+     * @default 'p'
+     */
+    prefix?: string;
 }
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions>;
 

package/dist/module.json

@@ -1,5 +1,8 @@
 {
   "name": "@privyid/persona",
   "configKey": "persona",
-  "version": "0.5.1"
+  "compatibility": {
+    "nuxt": ">=3.0.0"
+  },
+  "version": "0.6.0"
 }

package/dist/module.mjs

@@ -1,23 +1,14 @@
-import { fileURLToPath } from 'node:url';
-import { defineNuxtModule, installModule } from '@nuxt/kit';
-import preset from '@privyid/tailwind-preset';
+import { defineNuxtModule, createResolver, addComponentsDir, addPlugin, extendViteConfig } from '@nuxt/kit';
 
 const module = defineNuxtModule({
   meta: {
     name: "@privyid/persona",
-    configKey: "persona"
-  },
-  defaults: { font: true },
-  hooks: {
-    "components:dirs"(dirs) {
-      dirs.push({
-        path: fileURLToPath(new URL("components", import.meta.url)),
-        prefix: "p",
-        extensions: ["vue"]
-      });
-    }
+    configKey: "persona",
+    compatibility: { nuxt: ">=3.0.0" }
   },
+  defaults: { font: true, prefix: "p" },
   async setup(options, nuxt) {
+    const { resolve } = createResolver(import.meta.url);
     nuxt.options.alias["@carbon/icons-vue/lib"] = "@carbon/icons-vue/es";
     if (options.font) {
       nuxt.options.app.head.link?.push(
@@ -30,7 +21,23 @@ const module = defineNuxtModule({
         { rel: "stylesheet", href: "https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;1,400&display=swap" }
       );
     }
-    await installModule("@nuxtjs/tailwindcss", { config: { presets: [preset] } });
+    await addComponentsDir({
+      path: resolve("./components"),
+      prefix: options.prefix,
+      extensions: ["vue"]
+    });
+    addPlugin({ src: resolve("./runtime/plugin") });
+    extendViteConfig((config) => {
+      config.optimizeDeps?.exclude?.push("@privyid/persona");
+      config.optimizeDeps?.include?.push(
+        "@testing-library/user-event",
+        "interactjs",
+        "isomorphic-dompurify",
+        "scroll-into-view",
+        "webfontloader",
+        "zxcvbn"
+      );
+    });
   }
 });
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@privyid/persona",
-  "version": "0.5.1",
+  "version": "0.6.0",
   "license": "MIT",
   "type": "module",
   "exports": {
@@ -18,6 +18,16 @@
       "types": "./dist/directive/index.d.ts"
     }
   },
+  "typesVersions": {
+    "*": {
+      "core": [
+        "./dist/core/index.d.ts"
+      ],
+      "directive": [
+        "./dist/directive/index.d.ts"
+      ]
+    }
+  },
   "main": "./dist/module.cjs",
   "module": "./dist/module.mjs",
   "types": "./dist/types.d.ts",
@@ -27,7 +37,7 @@
   "scripts": {
     "prepack": "yarn build && yarn cleanup",
     "build": "nuxt-module-build",
-    "cleanup": "del-cli dist/**/*.spec.{d.ts,mjs} dist/**/__mocks__ dist/**/*.md",
+    "cleanup": "del-cli dist/**/*.spec.{d.ts,mjs} dist/**/__mocks__ dist/**/demo dist/**/*.md",
     "dev": "nuxi dev playground",
     "dev:build": "nuxi build playground",
     "dev:prepare": "nuxt-module-build --stub && nuxi prepare playground"
@@ -35,17 +45,14 @@
   "dependencies": {
     "@carbon/icons-vue": "10.49.1",
     "@floating-ui/dom": "^1.0.4",
-    "@fontsource/dm-sans": "4.5.9",
     "@juggle/resize-observer": "^3.4.0",
     "@nuxt/kit": "^3.0.0",
-    "@nuxtjs/tailwindcss": "^6.1.3",
-    "@privyid/tailwind-preset": "^0.5.0",
+    "@testing-library/dom": "^8.19.0",
     "@testing-library/user-event": "^14.4.3",
     "@vueuse/core": "9.6.0",
     "@vueuse/math": "^9.4.0",
     "@zxing/browser": "0.1.1",
     "@zxing/library": "0.19.1",
-    "buffer": "6.0.3",
     "chart.js": "3.9.1",
     "core-js": "3",
     "date-fns": "2.29.3",
@@ -57,23 +64,32 @@
     "lodash-es": "4.17.21",
     "marked": "^4.1.1",
     "nanodelay": "2.0.2",
-    "p-queue": "^7.3.0",
-    "postcss-custom-properties": "^12.1.11",
-    "postcss-hexrgba": "^2.1.0",
-    "postcss-lighten-darken": "^0.9.0",
     "scroll-into-view": "^1.16.2",
     "tabbable": "6.0.1",
     "vue-demi": "0.13.11",
-    "vue-router": "4.1.6",
     "vuedraggable": "next",
     "webfontloader": "1.6.28",
     "zxcvbn": "^4.4.2"
   },
+  "peerDependencies": {
+    "@privyid/tailwind-preset": "^0.6.0",
+    "postcss-custom-properties": "^12.1.11",
+    "postcss-hexrgba": "^2.1.0",
+    "postcss-lighten-darken": "^0.9.0",
+    "tailwind": ">= 3.0.0",
+    "vue-router": ">=4.0.0"
+  },
   "devDependencies": {
     "@nuxt/module-builder": "latest",
     "@nuxt/schema": "3.0.0",
+    "@nuxtjs/tailwindcss": "^6.2.0",
+    "@privyid/tailwind-preset": "^0.6.0",
     "del-cli": "5.0.0",
-    "nuxt": "3.0.0"
+    "nuxt": "3.0.0",
+    "postcss-custom-properties": "^12.1.11",
+    "postcss-hexrgba": "^2.1.0",
+    "postcss-lighten-darken": "^0.9.0",
+    "tailwind": "^4.0.0"
   },
   "installConfig": {
     "hoistingLimits": "workspaces"

package/dist/components/select/demo/api/province.d.ts

@@ -1,5 +0,0 @@
-declare const _default: {
-    id: string;
-    name: string;
-}[];
-export default _default;

package/dist/components/select/demo/api/province.mjs

@@ -1,138 +0,0 @@
-export default [
-  {
-    id: "11",
-    name: "ACEH"
-  },
-  {
-    id: "12",
-    name: "SUMATERA UTARA"
-  },
-  {
-    id: "13",
-    name: "SUMATERA BARAT"
-  },
-  {
-    id: "14",
-    name: "RIAU"
-  },
-  {
-    id: "15",
-    name: "JAMBI"
-  },
-  {
-    id: "16",
-    name: "SUMATERA SELATAN"
-  },
-  {
-    id: "17",
-    name: "BENGKULU"
-  },
-  {
-    id: "18",
-    name: "LAMPUNG"
-  },
-  {
-    id: "19",
-    name: "KEPULAUAN BANGKA BELITUNG"
-  },
-  {
-    id: "21",
-    name: "KEPULAUAN RIAU"
-  },
-  {
-    id: "31",
-    name: "DKI JAKARTA"
-  },
-  {
-    id: "32",
-    name: "JAWA BARAT"
-  },
-  {
-    id: "33",
-    name: "JAWA TENGAH"
-  },
-  {
-    id: "34",
-    name: "DI YOGYAKARTA"
-  },
-  {
-    id: "35",
-    name: "JAWA TIMUR"
-  },
-  {
-    id: "36",
-    name: "BANTEN"
-  },
-  {
-    id: "51",
-    name: "BALI"
-  },
-  {
-    id: "52",
-    name: "NUSA TENGGARA BARAT"
-  },
-  {
-    id: "53",
-    name: "NUSA TENGGARA TIMUR"
-  },
-  {
-    id: "61",
-    name: "KALIMANTAN BARAT"
-  },
-  {
-    id: "62",
-    name: "KALIMANTAN TENGAH"
-  },
-  {
-    id: "63",
-    name: "KALIMANTAN SELATAN"
-  },
-  {
-    id: "64",
-    name: "KALIMANTAN TIMUR"
-  },
-  {
-    id: "65",
-    name: "KALIMANTAN UTARA"
-  },
-  {
-    id: "71",
-    name: "SULAWESI UTARA"
-  },
-  {
-    id: "72",
-    name: "SULAWESI TENGAH"
-  },
-  {
-    id: "73",
-    name: "SULAWESI SELATAN"
-  },
-  {
-    id: "74",
-    name: "SULAWESI TENGGARA"
-  },
-  {
-    id: "75",
-    name: "GORONTALO"
-  },
-  {
-    id: "76",
-    name: "SULAWESI BARAT"
-  },
-  {
-    id: "81",
-    name: "MALUKU"
-  },
-  {
-    id: "82",
-    name: "MALUKU UTARA"
-  },
-  {
-    id: "91",
-    name: "PAPUA BARAT"
-  },
-  {
-    id: "94",
-    name: "PAPUA"
-  }
-];

package/dist/components/select/demo/api/regencies/11.d.ts

@@ -1,6 +0,0 @@
-declare const _default: {
-    id: string;
-    province_id: string;
-    name: string;
-}[];
-export default _default;