@privyid/persona 1.1.2 → 1.2.0

package/dist/components/pagination/Pagination.vue

@@ -124,202 +124,160 @@
   </div>
 </template>
 
-<script lang="ts" setup>
-import type { PropType, VNode } from 'vue-demi'
-import { computed, watch } from 'vue-demi'
-import Button from '../button/Button.vue'
-import Select from '../select/Select.vue'
-import IconPrev from '@privyid/persona-icon/vue/chevron-left/20.vue'
-import IconNext from '@privyid/persona-icon/vue/chevron-right/20.vue'
-import type { SelectItem } from '../select'
-import { useVModel } from '../input'
-import { usePagination } from '.'
-import { getPageRange } from './utils/calculate-page'
-import type { SizeVariant } from '../button'
-
-type NavigationVariant = 'none' | 'short' | 'far'
-
+<script setup>
+import { computed, watch } from "vue-demi";
+import Button from "../button/Button.vue";
+import Select from "../select/Select.vue";
+import IconPrev from "@privyid/persona-icon/vue/chevron-left/20.vue";
+import IconNext from "@privyid/persona-icon/vue/chevron-right/20.vue";
+import { useVModel } from "../input";
+import { usePagination } from ".";
+import { getPageRange } from "./utils/calculate-page";
 const props = defineProps({
   modelValue: {
-    type   : Number,
-    default: 1,
+    type: Number,
+    default: 1
   },
   quickJump: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   showCounter: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   showPerPage: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   showDetail: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   navigationText: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   navigationOnly: {
-    type   : Boolean,
-    default: false,
+    type: Boolean,
+    default: false
   },
   variant: {
-    type   : String as PropType<NavigationVariant>,
-    default: 'short',
+    type: String,
+    default: "short"
   },
   perPage: {
-    type   : Number,
-    default: 10,
+    type: Number,
+    default: 10
   },
   perPageOptions: {
-    type   : Array<Number>,
+    type: Array,
     default: () => [
       10,
       20,
-      30,
-    ],
+      30
+    ]
   },
   total: {
-    type   : Number,
-    default: 0,
+    type: Number,
+    default: 0
   },
   displayLimit: {
-    type   : Number,
-    default: 10,
+    type: Number,
+    default: 10
   },
   pageLabel: {
-    type   : String,
-    default: 'Page',
+    type: String,
+    default: "Page"
   },
   prevNavLabel: {
-    type   : String,
-    default: 'Previous',
+    type: String,
+    default: "Previous"
   },
   nextNavLabel: {
-    type   : String,
-    default: 'Next',
+    type: String,
+    default: "Next"
   },
   firstNavLabel: {
-    type   : String,
-    default: 'First',
+    type: String,
+    default: "First"
   },
   lastNavLabel: {
-    type   : String,
-    default: 'Last',
+    type: String,
+    default: "Last"
   },
   showRowsLabel: {
-    type   : String,
-    default: 'Show rows',
+    type: String,
+    default: "Show rows"
   },
   selectSize: {
-    type   : String as PropType<SizeVariant>,
-    default: 'md',
-  },
-})
-
-const emit = defineEmits<{
-  'update:modelValue': [number],
-  'update:perPage': [number],
-  'change': [number],
-}>()
-
+    type: String,
+    default: "md"
+  }
+});
+const emit = defineEmits(["update:modelValue", "update:perPage", "change"]);
 const classNames = computed(() => {
-  const results: string [] = ['pagination']
-
+  const results = ["pagination"];
   if (props.navigationOnly)
-    results.push('pagination--navonly')
-
-  return results
-})
-
-const model = useVModel(props)
-
+    results.push("pagination--navonly");
+  return results;
+});
+const model = useVModel(props);
 const {
   pageItems,
   rowRange,
   totalPageCount,
   canNext,
-  canPrev,
-} = usePagination(props)
-
-const pageOptions = computed<SelectItem[]>(() => {
+  canPrev
+} = usePagination(props);
+const pageOptions = computed(() => {
   return getPageRange(1, totalPageCount.value).map((page) => {
     return {
-      text : String(page),
-      value: page,
-    }
-  })
-})
-
-const rowPerPageOptions = computed<SelectItem[]>(() => {
+      text: String(page),
+      value: page
+    };
+  });
+});
+const rowPerPageOptions = computed(() => {
   return props.perPageOptions.map((option) => {
     return {
-      text : String(option),
-      value: option,
-    }
-  })
-})
-
+      text: String(option),
+      value: option
+    };
+  });
+});
 const rowPerPage = computed({
-  get () {
-    return props.perPage
-  },
-  set (value) {
-    emit('update:perPage', value)
+  get() {
+    return props.perPage;
   },
-})
-
+  set(value) {
+    emit("update:perPage", value);
+  }
+});
 watch(totalPageCount, (value) => {
   if (model.value > value)
-    model.value = value || 1
-})
-
-function next () {
-  model.value = Math.min(model.value + 1, totalPageCount.value)
-
-  emit('change', model.value)
+    model.value = value || 1;
+});
+function next() {
+  model.value = Math.min(model.value + 1, totalPageCount.value);
+  emit("change", model.value);
 }
-
-function prev () {
-  model.value = Math.max(model.value - 1, 1)
-
-  emit('change', model.value)
+function prev() {
+  model.value = Math.max(model.value - 1, 1);
+  emit("change", model.value);
 }
-
-function selectPage (page: number | string) {
-  if (typeof page === 'string') return
-
+function selectPage(page) {
+  if (typeof page === "string") return;
   if (model.value !== page) {
-    model.value = page
-
-    emit('change', page)
+    model.value = page;
+    emit("change", page);
   }
 }
-
 defineExpose({
   next,
-  prev,
-})
-
-defineSlots<{
-  'quick-jump-count'(props: { total: number }): VNode[],
-  'pagination-count'(props: {
-    page: number,
-    perPage: number,
-    total: number,
-    totalPage: number,
-    range: number[],
-  }): VNode[],
-  'first-navigation'(): VNode[],
-  'prev-navigation'(): VNode[],
-  'next-navigation'(): VNode[],
-  'last-navigation'(): VNode[],
-}>()
+  prev
+});
+defineSlots();
 </script>
 
 <style lang="postcss">

package/dist/components/pagination/Pagination.vue.d.ts

@@ -0,0 +1,261 @@
+import type { PropType, VNode } from 'vue-demi';
+import type { SizeVariant } from '../button';
+type NavigationVariant = 'none' | 'short' | 'far';
+declare function next(): void;
+declare function prev(): void;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        'quick-jump-count'(props: {
+            total: number;
+        }): VNode[];
+        'pagination-count'(props: {
+            page: number;
+            perPage: number;
+            total: number;
+            totalPage: number;
+            range: number[];
+        }): VNode[];
+        'first-navigation'(): VNode[];
+        'prev-navigation'(): VNode[];
+        'next-navigation'(): VNode[];
+        'last-navigation'(): VNode[];
+    }> & {
+        'quick-jump-count'(props: {
+            total: number;
+        }): VNode[];
+        'pagination-count'(props: {
+            page: number;
+            perPage: number;
+            total: number;
+            totalPage: number;
+            range: number[];
+        }): VNode[];
+        'first-navigation'(): VNode[];
+        'prev-navigation'(): VNode[];
+        'next-navigation'(): VNode[];
+        'last-navigation'(): VNode[];
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import("vue-demi").DefineComponent<import("vue-demi").ExtractPropTypes<{
+    modelValue: {
+        type: NumberConstructor;
+        default: number;
+    };
+    quickJump: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showCounter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showPerPage: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showDetail: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    navigationText: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    navigationOnly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    variant: {
+        type: PropType<NavigationVariant>;
+        default: string;
+    };
+    perPage: {
+        type: NumberConstructor;
+        default: number;
+    };
+    perPageOptions: {
+        type: {
+            (arrayLength: number): Number[];
+            (...items: Number[]): Number[];
+            new (arrayLength: number): Number[];
+            new (...items: Number[]): Number[];
+            isArray(arg: any): arg is any[];
+            readonly prototype: any[];
+            from<T>(arrayLike: ArrayLike<T>): T[];
+            from<T, U>(arrayLike: ArrayLike<T>, mapfn: (v: T, k: number) => U, thisArg?: any): U[];
+            from<T>(iterable: Iterable<T> | ArrayLike<T>): T[];
+            from<T, U>(iterable: Iterable<T> | ArrayLike<T>, mapfn: (v: T, k: number) => U, thisArg?: any): U[];
+            of<T>(...items: T[]): T[];
+            readonly [Symbol.species]: ArrayConstructor;
+        };
+        default: () => number[];
+    };
+    total: {
+        type: NumberConstructor;
+        default: number;
+    };
+    displayLimit: {
+        type: NumberConstructor;
+        default: number;
+    };
+    pageLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    prevNavLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    nextNavLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    firstNavLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    lastNavLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    showRowsLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    selectSize: {
+        type: PropType<SizeVariant>;
+        default: string;
+    };
+}>, {
+    next: typeof next;
+    prev: typeof prev;
+}, {}, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, {
+    "update:modelValue": (args_0: number) => void;
+    change: (args_0: number) => void;
+    "update:perPage": (args_0: number) => void;
+}, string, import("vue-demi").PublicProps, Readonly<import("vue-demi").ExtractPropTypes<{
+    modelValue: {
+        type: NumberConstructor;
+        default: number;
+    };
+    quickJump: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showCounter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showPerPage: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showDetail: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    navigationText: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    navigationOnly: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    variant: {
+        type: PropType<NavigationVariant>;
+        default: string;
+    };
+    perPage: {
+        type: NumberConstructor;
+        default: number;
+    };
+    perPageOptions: {
+        type: {
+            (arrayLength: number): Number[];
+            (...items: Number[]): Number[];
+            new (arrayLength: number): Number[];
+            new (...items: Number[]): Number[];
+            isArray(arg: any): arg is any[];
+            readonly prototype: any[];
+            from<T>(arrayLike: ArrayLike<T>): T[];
+            from<T, U>(arrayLike: ArrayLike<T>, mapfn: (v: T, k: number) => U, thisArg?: any): U[];
+            from<T>(iterable: Iterable<T> | ArrayLike<T>): T[];
+            from<T, U>(iterable: Iterable<T> | ArrayLike<T>, mapfn: (v: T, k: number) => U, thisArg?: any): U[];
+            of<T>(...items: T[]): T[];
+            readonly [Symbol.species]: ArrayConstructor;
+        };
+        default: () => number[];
+    };
+    total: {
+        type: NumberConstructor;
+        default: number;
+    };
+    displayLimit: {
+        type: NumberConstructor;
+        default: number;
+    };
+    pageLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    prevNavLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    nextNavLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    firstNavLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    lastNavLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    showRowsLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    selectSize: {
+        type: PropType<SizeVariant>;
+        default: string;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((args_0: number) => any) | undefined;
+    onChange?: ((args_0: number) => any) | undefined;
+    "onUpdate:perPage"?: ((args_0: number) => any) | undefined;
+}>, {
+    modelValue: number;
+    variant: NavigationVariant;
+    total: number;
+    displayLimit: number;
+    perPage: number;
+    quickJump: boolean;
+    showCounter: boolean;
+    showPerPage: boolean;
+    showDetail: boolean;
+    navigationText: boolean;
+    navigationOnly: boolean;
+    perPageOptions: Number[];
+    pageLabel: string;
+    prevNavLabel: string;
+    nextNavLabel: string;
+    firstNavLabel: string;
+    lastNavLabel: string;
+    showRowsLabel: string;
+    selectSize: SizeVariant;
+}, {}, {}, {}, string, import("vue-demi").ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};