@saurssaurav/pagination-js-vue - npm Package Compare versions

Comparing version 0.0.2-dev.0 to 1.0.0-dev.0

./lib/index.js

@@ -1,2 +0,2 @@
-import { defineComponent as P, computed as C, openBlock as u, createElementBlock as l, createElementVNode as c, Fragment as d, renderList as f, normalizeClass as _, toDisplayString as m } from "vue";
+import { defineComponent as P, computed as C, openBlock as u, createElementBlock as l, createElementVNode as p, Fragment as d, renderList as f, normalizeClass as _, toDisplayString as m } from "vue";
 const v = (o, e) => o - e, k = (o, e) => o + e + 1, h = (o) => {
@@ -33,12 +33,12 @@ const e = [], { currentPage: r, pageSidesToCurrentPage: a, totalPage: i } = o, g = v(r, a), t = k(r, a);
     return (t, n) => (u(), l("div", S, [
-      c("div", {
-        class: "pagination__page",
+      p("div", {
+        class: "pagination__page pagination__page--first",
         onClick: n[0] || (n[0] = (s) => a(t.currentPage - 1))
       }, "<"),
-      (u(!0), l(d, null, f(g.value, (s, p) => (u(), l("div", {
-        key: p,
+      (u(!0), l(d, null, f(g.value, (s, c) => (u(), l("div", {
+        key: c,
         class: _(["pagination__page", { "pagination__page--active": i(s) }]),
         onClick: (E) => a(s)
       }, m(s), 11, T))), 128)),
-      c("div", {
+      p("div", {
         class: "pagination__page",
@@ -45,0 +45,0 @@ onClick: n[1] || (n[1] = (s) => a(t.currentPage + 1))

lib/index.js

@@ -1,2 +0,2 @@
-import { defineComponent as P, computed as C, openBlock as u, createElementBlock as l, createElementVNode as c, Fragment as d, renderList as f, normalizeClass as _, toDisplayString as m } from "vue";
+import { defineComponent as P, computed as C, openBlock as u, createElementBlock as l, createElementVNode as p, Fragment as d, renderList as f, normalizeClass as _, toDisplayString as m } from "vue";
 const v = (o, e) => o - e, k = (o, e) => o + e + 1, h = (o) => {
@@ -33,12 +33,12 @@ const e = [], { currentPage: r, pageSidesToCurrentPage: a, totalPage: i } = o, g = v(r, a), t = k(r, a);
     return (t, n) => (u(), l("div", S, [
-      c("div", {
-        class: "pagination__page",
+      p("div", {
+        class: "pagination__page pagination__page--first",
         onClick: n[0] || (n[0] = (s) => a(t.currentPage - 1))
       }, "<"),
-      (u(!0), l(d, null, f(g.value, (s, p) => (u(), l("div", {
-        key: p,
+      (u(!0), l(d, null, f(g.value, (s, c) => (u(), l("div", {
+        key: c,
         class: _(["pagination__page", { "pagination__page--active": i(s) }]),
         onClick: (E) => a(s)
       }, m(s), 11, T))), 128)),
-      c("div", {
+      p("div", {
         class: "pagination__page",
@@ -45,0 +45,0 @@ onClick: n[1] || (n[1] = (s) => a(t.currentPage + 1))

package.json

 {
   "name": "@saurssaurav/pagination-js-vue",
-  "version": "0.0.2-dev.0",
+  "version": "1.0.0-dev.0",
   "description": "Simple pagination package for vue js",
@@ -26,3 +26,3 @@ "author": "isaurssaurav <[e-mail]>",
   "dependencies": {
-    "@saurssaurav/pagination-js-core": "^0.0.2-dev.0",
+    "@saurssaurav/pagination-js-core": "^1.0.0-dev.0",
     "vue": "^3.3.4"
@@ -36,3 +36,3 @@ },
   },
-  "gitHead": "53a524045f2c8099955bbc015742fc47763f93c9"
+  "gitHead": "cdfba03ec3da5d2385d6b064ebe1335234d637d7"
 }

README.md

@@ -1,11 +0,46 @@
-# `vue`
+# Pagination Vue
 
-> TODO: description
+Simple and light weight pagination for vue.
 
+![image](https://raw.githubusercontent.com/isaurssaurav/pagination-js/tree/main/packages/vue/image.png)
+
+## Installation
+
+```
+$ npm i @saurssaurav/pagination-js-vue
+```
+
 ## Usage
 
+```js
+<script setup lang="ts">
+import { ref } from 'vue';
+import PaginationTest from '@saurssaurav/pagination-js-vue';
+import '@saurssaurav/pagination-js-core/style.css'; // import default pagination css
+
+const currentPage = ref(1);
+
+const onChange = (page) => {
+  currentPage.value = page;
+};
+</script>
+
+<template>
+  <pagination-test
+    :totalPage=10
+    :pageSidesToCurrentPage=2
+    :currentPage="currentPage"
+    @onChangeCurrentPage="onChange"
+  ></pagination-test>
+</template>
+
 ```
-const vue = require('vue');
 
-// TODO: DEMONSTRATE API
-```
+## Props
+
+| Name                     | Type     | Default | Description                                                          |
+| ------------------------ | -------- | ------- | -------------------------------------------------------------------- |
+| `totalSize`              | Number   |         | **Required.** Total data size                                        |
+| `currentPage`            | Number   |         | **Required.** Active page number                                     |
+| `onChangeCurrentPage`    | Function |         | **Required.** Page change handler. Receive current pageNumber as arg |
+| `pageSidesToCurrentPage` | Number   |         | **Required.** Neighbouring pages to active page                      |

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

8678

increased by19.88%

Lines of code

143

increased by0.7%

Number of lines in readme file

47

increased by291.67%

Dependency changes

• + Added@saurssaurav/pagination-js-core@1.0.0-dev.0(transitive)

• - Removed@saurssaurav/pagination-js-core@0.0.2-dev.0(transitive)

• Updated@saurssaurav/pagination-js-core@^1.0.0-dev.0