@privyid/persona 1.2.1 → 1.2.2-dev.1

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

@@ -0,0 +1,45 @@
+import type { SelectProps } from '../select';
+import type { Adapter } from '../select/adapter/adapter';
+import type { CalendarMode } from '../calendar/adapter/adapter';
+import type { MaybeRef } from '@vueuse/core';
+interface FilterType {
+    key: string;
+    label?: string;
+    placeholder?: string;
+    default?: unknown;
+    pinned?: boolean;
+    type: 'text' | 'select' | 'multiselect' | 'toggle' | 'date' | 'daterange';
+}
+interface FilterText extends FilterType {
+    type: 'text';
+}
+export interface FilterSelect extends FilterType {
+    type: 'select';
+    options: MaybeRef<SelectProps['options']>;
+    search?: boolean;
+    adapter?: Adapter;
+}
+export interface FilterSelectMultiple extends FilterType {
+    type: 'multiselect';
+    options: MaybeRef<SelectProps['options']>;
+    search?: boolean;
+    adapter?: Adapter;
+}
+export interface FilterToggle extends FilterType {
+    type: 'toggle';
+    value?: unknown;
+    uncheckedValue?: unknown;
+}
+export interface FilterDate extends FilterType {
+    type: 'date';
+    min?: Date;
+    max?: Date;
+    format?: string;
+    mode?: CalendarMode;
+}
+export interface FitlerDateRange extends FilterType {
+    type: 'daterange';
+}
+export type FilterItem = FilterText | FilterSelect | FilterSelectMultiple | FilterToggle | FilterDate | FitlerDateRange;
+export declare function defineFilter(scheme: FilterItem[]): FilterItem[];
+export {};

package/dist/components/filterbar/index.mjs

@@ -0,0 +1,7 @@
+import defu from "defu";
+import { startCase } from "lodash-es";
+export function defineFilter(scheme) {
+  return scheme.map((item) => {
+    return defu(item, { label: startCase(item.key), pinned: true });
+  });
+}

package/dist/components/filterbar/pinned/PinnedDate.vue

@@ -0,0 +1,100 @@
+<template>
+  <Dropdown
+    v-model="isOpen"
+    variant="input"
+    size="sm"
+    class="filterbar__date"
+    :class="{ 'filterbar--active': !!value }"
+    caret>
+    <template #button-content>
+      {{ value ? value : schema.label }}
+    </template>
+    <DropdownHeader>
+      {{ schema.label }}
+    </DropdownHeader>
+
+    <Calendar
+      v-model="model"
+      :min="min"
+      :max="max"
+      :mode="mode"
+      @change="close" />
+  </Dropdown>
+</template>
+
+<script>
+import {
+  computed,
+  defineComponent,
+  ref
+} from "vue";
+import Calendar from "../../calendar/Calendar.vue";
+import Dropdown from "../../dropdown/Dropdown.vue";
+import DropdownHeader from "../../dropdown/DropdownHeader.vue";
+import { useVModel } from "../../input";
+import { isDate, format as formatDate } from "date-fns";
+export default defineComponent({
+  components: {
+    Dropdown,
+    DropdownHeader,
+    Calendar
+  },
+  props: {
+    schema: {
+      type: Object,
+      required: true
+    },
+    modelValue: {
+      type: Date,
+      default: void 0
+    },
+    format: {
+      type: String,
+      default: "dd/MM/yyyy"
+    },
+    max: {
+      type: Date,
+      default: void 0
+    },
+    min: {
+      type: Date,
+      default: void 0
+    },
+    mode: {
+      type: String,
+      default: "date"
+    }
+  },
+  models: {
+    prop: "modelValue",
+    event: "update:modelValue"
+  },
+  emits: ["update:modelValue"],
+  setup(props) {
+    const isOpen = ref(false);
+    const model = useVModel(props);
+    const value = computed(() => {
+      return isDate(model.value) ? formatDate(model.value, props.format) : "";
+    });
+    function close() {
+      isOpen.value = false;
+    }
+    return {
+      model,
+      value,
+      isOpen,
+      close
+    };
+  }
+});
+</script>
+
+<style lang="postcss">
+.filterbar__date {
+  > .dropdown__menu {
+    --p-dropdown-max-height: 100%;
+
+    @apply min-w-max max-h-min;
+  }
+}
+</style>

package/dist/components/filterbar/pinned/PinnedDate.vue.d.ts

@@ -0,0 +1,508 @@
+import type { PropType } from 'vue';
+import type { FilterDate } from '..';
+import type { CalendarMode } from '../../calendar/adapter/adapter';
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    schema: {
+        type: PropType<FilterDate>;
+        required: true;
+    };
+    modelValue: {
+        type: DateConstructor;
+        default: undefined;
+    };
+    format: {
+        type: StringConstructor;
+        default: string;
+    };
+    max: {
+        type: DateConstructor;
+        default: undefined;
+    };
+    min: {
+        type: DateConstructor;
+        default: undefined;
+    };
+    mode: {
+        type: PropType<CalendarMode>;
+        default: string;
+    };
+}>, {
+    model: import("vue").Ref<Date, Date>;
+    value: import("vue").ComputedRef<string>;
+    isOpen: import("vue").Ref<boolean, boolean>;
+    close: () => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    schema: {
+        type: PropType<FilterDate>;
+        required: true;
+    };
+    modelValue: {
+        type: DateConstructor;
+        default: undefined;
+    };
+    format: {
+        type: StringConstructor;
+        default: string;
+    };
+    max: {
+        type: DateConstructor;
+        default: undefined;
+    };
+    min: {
+        type: DateConstructor;
+        default: undefined;
+    };
+    mode: {
+        type: PropType<CalendarMode>;
+        default: string;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}>, {
+    modelValue: Date;
+    mode: "date" | "month" | "year";
+    max: Date;
+    min: Date;
+    format: string;
+}, {}, {
+    Dropdown: {
+        new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
+            modelValue: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            text: {
+                type: StringConstructor;
+                default: string;
+            };
+            placement: {
+                type: PropType<import("@floating-ui/utils").Placement>;
+                default: string;
+            };
+            variant: {
+                type: PropType<import("../../button").StyleVariant>;
+                default: string;
+            };
+            color: {
+                type: PropType<import("../../button").ColorVariant>;
+                default: string;
+            };
+            size: {
+                type: PropType<import("../../button").SizeVariant>;
+                default: string;
+            };
+            icon: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            pill: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            noCaret: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            divider: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            menuClass: {
+                type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+                default: undefined;
+            };
+            buttonClass: {
+                type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+                default: undefined;
+            };
+            menuSize: {
+                type: PropType<import("../../dropdown").MenuSizeVariant>;
+                default: string;
+            };
+            noAnimation: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & Readonly<{
+            "onUpdate:modelValue"?: ((args_0: boolean) => any) | undefined;
+            onShow?: (() => any) | undefined;
+            onHide?: (() => any) | undefined;
+        }>, {
+            menuBody: import("vue").Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+            menu: import("vue").Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+            root: import("vue").Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+            open: () => void;
+            close: () => void;
+        }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+            "update:modelValue": (args_0: boolean) => void;
+            show: () => void;
+            hide: () => void;
+        }, import("vue").PublicProps, {
+            text: string;
+            size: import("../../button").SizeVariant;
+            modelValue: boolean;
+            disabled: boolean;
+            noCaret: boolean;
+            icon: boolean;
+            pill: boolean;
+            variant: import("../../button").StyleVariant;
+            color: import("../../button").ColorVariant;
+            divider: boolean;
+            placement: import("@floating-ui/utils").Placement;
+            menuClass: string | unknown[] | Record<string, any>;
+            buttonClass: string | unknown[] | Record<string, any>;
+            menuSize: import("../../dropdown").MenuSizeVariant;
+            noAnimation: boolean;
+        }, true, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import("vue").ExtractPropTypes<{
+            modelValue: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            text: {
+                type: StringConstructor;
+                default: string;
+            };
+            placement: {
+                type: PropType<import("@floating-ui/utils").Placement>;
+                default: string;
+            };
+            variant: {
+                type: PropType<import("../../button").StyleVariant>;
+                default: string;
+            };
+            color: {
+                type: PropType<import("../../button").ColorVariant>;
+                default: string;
+            };
+            size: {
+                type: PropType<import("../../button").SizeVariant>;
+                default: string;
+            };
+            icon: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            pill: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            noCaret: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            divider: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            menuClass: {
+                type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+                default: undefined;
+            };
+            buttonClass: {
+                type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+                default: undefined;
+            };
+            menuSize: {
+                type: PropType<import("../../dropdown").MenuSizeVariant>;
+                default: string;
+            };
+            noAnimation: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & Readonly<{
+            "onUpdate:modelValue"?: ((args_0: boolean) => any) | undefined;
+            onShow?: (() => any) | undefined;
+            onHide?: (() => any) | undefined;
+        }>, {
+            menuBody: import("vue").Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+            menu: import("vue").Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+            root: import("vue").Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+            open: () => void;
+            close: () => void;
+        }, {}, {}, {}, {
+            text: string;
+            size: import("../../button").SizeVariant;
+            modelValue: boolean;
+            disabled: boolean;
+            noCaret: boolean;
+            icon: boolean;
+            pill: boolean;
+            variant: import("../../button").StyleVariant;
+            color: import("../../button").ColorVariant;
+            divider: boolean;
+            placement: import("@floating-ui/utils").Placement;
+            menuClass: string | unknown[] | Record<string, any>;
+            buttonClass: string | unknown[] | Record<string, any>;
+            menuSize: import("../../dropdown").MenuSizeVariant;
+            noAnimation: boolean;
+        }>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+        modelValue: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        text: {
+            type: StringConstructor;
+            default: string;
+        };
+        placement: {
+            type: PropType<import("@floating-ui/utils").Placement>;
+            default: string;
+        };
+        variant: {
+            type: PropType<import("../../button").StyleVariant>;
+            default: string;
+        };
+        color: {
+            type: PropType<import("../../button").ColorVariant>;
+            default: string;
+        };
+        size: {
+            type: PropType<import("../../button").SizeVariant>;
+            default: string;
+        };
+        icon: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        pill: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        noCaret: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        divider: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        menuClass: {
+            type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+            default: undefined;
+        };
+        buttonClass: {
+            type: (StringConstructor | ObjectConstructor | ArrayConstructor)[];
+            default: undefined;
+        };
+        menuSize: {
+            type: PropType<import("../../dropdown").MenuSizeVariant>;
+            default: string;
+        };
+        noAnimation: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>> & Readonly<{
+        "onUpdate:modelValue"?: ((args_0: boolean) => any) | undefined;
+        onShow?: (() => any) | undefined;
+        onHide?: (() => any) | undefined;
+    }>, {
+        menuBody: import("vue").Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+        menu: import("vue").Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+        root: import("vue").Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+        open: () => void;
+        close: () => void;
+    }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        "update:modelValue": (args_0: boolean) => void;
+        show: () => void;
+        hide: () => void;
+    }, string, {
+        text: string;
+        size: import("../../button").SizeVariant;
+        modelValue: boolean;
+        disabled: boolean;
+        noCaret: boolean;
+        icon: boolean;
+        pill: boolean;
+        variant: import("../../button").StyleVariant;
+        color: import("../../button").ColorVariant;
+        divider: boolean;
+        placement: import("@floating-ui/utils").Placement;
+        menuClass: string | unknown[] | Record<string, any>;
+        buttonClass: string | unknown[] | Record<string, any>;
+        menuSize: import("../../dropdown").MenuSizeVariant;
+        noAnimation: boolean;
+    }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+        $slots: Readonly<{
+            activator(props: {
+                isOpen: boolean;
+                open: () => void;
+                close: () => void;
+                toggle: () => void;
+            }): import("vue").VNode[];
+            'button-content': () => import("vue").VNode[];
+            prepend: () => import("vue").VNode[];
+            append: () => import("vue").VNode[];
+        }> & {
+            activator(props: {
+                isOpen: boolean;
+                open: () => void;
+                close: () => void;
+                toggle: () => void;
+            }): import("vue").VNode[];
+            'button-content': () => import("vue").VNode[];
+            prepend: () => import("vue").VNode[];
+            append: () => import("vue").VNode[];
+        };
+    });
+    DropdownHeader: {
+        new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {}, true, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, {}>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import("vue").ComponentOptionsBase<Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+        $slots: {
+            default?(_: {}): any;
+            action?(_: {}): any;
+        };
+    });
+    Calendar: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+        modelValue: {
+            type: PropType<Date | [Date, Date]>;
+            default: undefined;
+        };
+        start: {
+            type: DateConstructor;
+            default: undefined;
+        };
+        end: {
+            type: DateConstructor;
+            default: undefined;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
+        readonly: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
+        min: {
+            type: DateConstructor;
+            default: () => Date;
+        };
+        max: {
+            type: DateConstructor;
+            default: () => Date;
+        };
+        mode: {
+            type: PropType<CalendarMode>;
+            default: string;
+        };
+        range: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        minRange: {
+            type: StringConstructor;
+            default: undefined;
+            validator(value: string): boolean;
+        };
+        maxRange: {
+            type: StringConstructor;
+            default: undefined;
+            validator(value: string): boolean;
+        };
+    }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        "update:modelValue": (args_0: unknown) => void;
+        change: (args_0: unknown) => void;
+        "update:start": (args_0: Date) => void;
+        "update:end": (args_0: Date) => void;
+    }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+        modelValue: {
+            type: PropType<Date | [Date, Date]>;
+            default: undefined;
+        };
+        start: {
+            type: DateConstructor;
+            default: undefined;
+        };
+        end: {
+            type: DateConstructor;
+            default: undefined;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
+        readonly: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
+        min: {
+            type: DateConstructor;
+            default: () => Date;
+        };
+        max: {
+            type: DateConstructor;
+            default: () => Date;
+        };
+        mode: {
+            type: PropType<CalendarMode>;
+            default: string;
+        };
+        range: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        minRange: {
+            type: StringConstructor;
+            default: undefined;
+            validator(value: string): boolean;
+        };
+        maxRange: {
+            type: StringConstructor;
+            default: undefined;
+            validator(value: string): boolean;
+        };
+    }>> & Readonly<{
+        "onUpdate:modelValue"?: ((args_0: unknown) => any) | undefined;
+        onChange?: ((args_0: unknown) => any) | undefined;
+        "onUpdate:start"?: ((args_0: Date) => any) | undefined;
+        "onUpdate:end"?: ((args_0: Date) => any) | undefined;
+    }>, {
+        modelValue: Date | [Date, Date];
+        disabled: boolean;
+        mode: "date" | "month" | "year";
+        max: Date;
+        start: Date;
+        end: Date;
+        readonly: boolean;
+        min: Date;
+        range: boolean;
+        minRange: string;
+        maxRange: string;
+    }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;