@nl-rvo/css-page-number-navigation 1.5.2 → 1.6.0

package/dist/{index.min.css → page-number-navigation.css}

@@ -1 +1 @@
-.rvo-pagination{align-items:center;display:flex;flex-wrap:wrap;gap:var(--rvo-pagination-gap);justify-content:center}@media (min-width:780px){.rvo-pagination{justify-content:flex-start}}.rvo-pagination__next .rvo-link,.rvo-pagination__prev .rvo-link{text-decoration:none}.rvo-pagination__next .rvo-link:hover,.rvo-pagination__prev .rvo-link:hover{text-decoration:underline}.rvo-pagination__list{display:flex;gap:var(--rvo-pagination-gap);margin-block-end:var(--rvo-pagination-list-margin-block-end);margin-block-start:var(--rvo-pagination-list-margin-block-start);padding-inline-end:var(--rvo-pagination-list-padding-inline-end);padding-inline-start:var(--rvo-pagination-list-padding-inline-start)}.rvo-pagination__item{font-weight:var(--rvo-font-weight-bold);list-style:none;min-inline-size:var(--rvo-size-xl);padding-block-end:var(--rvo-space-sm);padding-block-start:var(--rvo-space-sm);padding-inline-end:var(--rvo-space-sm);padding-inline-start:var(--rvo-space-sm);text-align:center}.rvo-pagination__item .rvo-link{font-weight:var(--rvo-font-weight-regular);text-decoration:none}.rvo-pagination__item .rvo-link:hover{text-decoration:underline}.rvo-pagination__item.rvo-pagination__item--active{background-color:var(--rvo-color-grijs-100);font-weight:var(--rvo-font-weight-normal)}
+.rvo-pagination{align-items:center;display:flex;flex-wrap:wrap;gap:var(--rvo-pagination-gap);justify-content:center}@media(min-width: 780px){.rvo-pagination{justify-content:flex-start}}.rvo-pagination__prev .rvo-link,.rvo-pagination__next .rvo-link{text-decoration:none}.rvo-pagination__prev .rvo-link:hover,.rvo-pagination__next .rvo-link:hover{text-decoration:underline}.rvo-pagination__list{display:flex;gap:var(--rvo-pagination-gap);margin-block-end:var(--rvo-pagination-list-margin-block-end);margin-block-start:var(--rvo-pagination-list-margin-block-start);padding-inline-end:var(--rvo-pagination-list-padding-inline-end);padding-inline-start:var(--rvo-pagination-list-padding-inline-start)}.rvo-pagination__item{font-weight:var(--rvo-font-weight-bold);list-style:none;min-inline-size:var(--rvo-size-xl);padding-block-end:var(--rvo-space-sm);padding-block-start:var(--rvo-space-sm);padding-inline-end:var(--rvo-space-sm);padding-inline-start:var(--rvo-space-sm);text-align:center}.rvo-pagination__item .rvo-link{font-weight:var(--rvo-font-weight-regular);text-decoration:none}.rvo-pagination__item .rvo-link:hover{text-decoration:underline}.rvo-pagination__item.rvo-pagination__item--active{background-color:var(--rvo-color-grijs-100);font-weight:var(--rvo-font-weight-normal)}/*# sourceMappingURL=page-number-navigation.css.map */

package/dist/page-number-navigation.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../src/page-number-navigation.scss"],"names":[],"mappings":"AAIA,gBACE,mBACA,aACA,eACA,8BACA,uBAEA,yBAPF,gBAQI,4BAKA,gEACE,qBAEA,4EACE,0BAMR,sBACE,aACA,8BACA,6DACA,iEACA,iEACA,qEAGF,sBACE,wCACA,gBACA,mCACA,sCACA,wCACA,uCACA,yCACA,kBAEA,gCACE,2CACA,qBAEA,sCACE,0BAIJ,mDACE,4CACA","file":"page-number-navigation.css"}

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.5.2",
+  "version": "1.6.0",
   "author": "Community for NL Design System",
   "license": "CC0-1.0",
   "name": "@nl-rvo/css-page-number-navigation",
@@ -9,26 +9,26 @@
     "css",
     "pagination"
   ],
-  "files": [
-    "src/index.scss",
-    "dist/",
-    "design-tokens.json",
-    "*.md"
-  ],
-  "main": "dist/index.css",
-  "publishConfig": {
-    "access": "public"
-  },
   "repository": {
     "type": "git+ssh",
     "url": "git@github.com:nl-design-system/rvo.git",
-    "directory": "components/page-number-navigation"
+    "directory": "components/page-number-navigation/style"
   },
-  "devDependencies": {
-    "@nl-rvo/build-utils-css": "0.1.0"
+  "files": [
+    "src/",
+    "dist/"
+  ],
+  "exports": {
+    ".": "./dist/page-number-navigation.css",
+    "./dist/*": "./dist/*"
+  },
+  "publishConfig": {
+    "access": "public",
+    "provenance": true
   },
   "scripts": {
-    "build": "build-css-package",
-    "clean": "rimraf dist"
+    "build": "sass --pkg-importer=node --style=compressed ./src/:./dist/",
+    "watch": "sass --pkg-importer=node --style=compressed --watch ./src/:./dist/",
+    "clean": "rimraf ./dist/"
   }
 }

package/CHANGELOG.md

@@ -1,73 +0,0 @@
-# `@nl-rvo/css-pagination`
-
-## 1.5.2
-
-### Patch Changes
-
-- 93fdefc: Use CSS Logical properties, to support both `dir=ltr` and `dir=rtl`.
-
-## 1.5.1
-
-### Patch Changes
-
-- f64662b: ROOS-330: prevents conditional render of react hooks
-- fae5a62: ROOS-330: added overridable labels for i18n purposes
-
-## 1.5.0
-
-### Minor Changes
-
-- fa36e07: Project structure updates
-
-  - Moved all Storybook stories to the /stories directory.
-  - Moved all documentation files to the /docs directory.
-  - Removed React components from library-component-react and moved them into this package.
-  - Update all .stories imports to the right react package "component-library-react"
-  - Fix all Redundant / PascalCase lint warnings for .stories files.
-
-## 1.4.0
-
-### Minor Changes
-
-- 8b8710c: Update page number navigation: always show 5 items from page 1 and 5 items before the last page (with ellipses between ranges when needed).
-
-## 1.3.1
-
-### Patch Changes
-
-- 11eb258: Update imports to support storybook v10
-
-## 1.3.0
-
-### Minor Changes
-
-- a255197: Pagination renamed to Page Number Navigation and updated CSS
-
-## 1.2.1
-
-### Patch Changes
-
-- 9f3ff4d: pagination now has className prop and html atrributes props forwarded to the root element
-
-## 1.2.0
-
-### Minor Changes
-
-- 0cdf4eb: Remove utrecht-components-css reference and include utrecht css per component when needed
-
-## 1.0.1
-
-### Patch Changes
-
-- fc69881: Added aria-current attribute to active page link
-
-## 1.0.0
-
-### Major Changes
-
-- daa0537: Create npm package for each component.
-
-## Pre-releases
-
-_@nl-rvo/component-library-css@1.0.0-alpha.381_:
-Added component

package/README.md

@@ -1,79 +0,0 @@
-## Richtlijnen
-
-- Lijn de pagination altijd links uit met de bovenstaande content waarvoor de pagination actief is. Dit zorgt ervoor dat mensen met kokervisie de pagination makkelijk kunnen ontdekken.
-- Gebruik ellipsen (…) om eventuele overgeslagen pagina's te vervangen. Bijvoorbeeld:
-
-[1] 2 … 10
-
-1 [2] 3 … 100
-
-1 2 [3] 4 … 100
-
-1 2 3 [4] 5 … 100
-
-1 … 4 [5] 6 … 100
-
-1 … 97 [98] 99 100
-
-1 … 98 [99] 100
-
-1 … 99 [100]
-
-## Voor ontwikkelaars
-
-De logica voor het genereren van paginanummers met ellipsen kan als volgt worden geïmplementeerd.
-
-```js
-const generatePageNumberMarkup = (page, activePage) => {
-  return page === activePage ? `[${page}]` : `${page}`;
-};
-
-const generateEllipsisMarkup = () => "…";
-
-const generatePageNumbers = (totalPages, activePage) => {
-  const pages = [];
-  const windowSize = 5;
-
-  const addRange = (from, to) => {
-    for (let i = from; i <= to; i++) {
-      pages.push(generatePageNumberMarkup(i, activePage));
-    }
-  };
-
-  // Toon alle pagina's als het totaal klein is
-  if (totalPages <= windowSize) {
-    addRange(1, totalPages);
-    return pages;
-  }
-
-  // Begin van de paginering
-  // Voorbeeld: [1] 2 3 4 5 … 100
-  if (activePage <= 4) {
-    addRange(1, 5);
-    pages.push(generateEllipsisMarkup());
-    pages.push(generatePageNumberMarkup(totalPages, activePage));
-    return pages;
-  }
-
-  // Einde van de paginering
-  // Voorbeeld: 1 … 96 97 98 [99] 100
-  if (activePage >= totalPages - 3) {
-    pages.push(generatePageNumberMarkup(1, activePage));
-    pages.push(generateEllipsisMarkup());
-    addRange(totalPages - 4, totalPages);
-    return pages;
-  }
-
-  // Midden van de paginering
-  // Voorbeeld: 1 … 4 [5] 6 … 100
-  pages.push(generatePageNumberMarkup(1, activePage));
-  pages.push(generateEllipsisMarkup());
-  addRange(activePage - 1, activePage + 1);
-  pages.push(generateEllipsisMarkup());
-  pages.push(generatePageNumberMarkup(totalPages, activePage));
-
-  return pages;
-};
-
-generatePageNumbers(100, 1);
-```

package/design-tokens.json

@@ -1,38 +0,0 @@
-{
-  "rvo": {
-    "pagination": {
-      "gap": {
-        "css": {
-          "syntax": "<length>",
-          "inherits": true
-        }
-      },
-      "list": {
-        "margin-block-end": {
-          "css": {
-            "syntax": "<length>",
-            "inherits": true
-          }
-        },
-        "margin-block-start": {
-          "css": {
-            "syntax": "<length>",
-            "inherits": true
-          }
-        },
-        "padding-inline-start": {
-          "css": {
-            "syntax": "<length>",
-            "inherits": true
-          }
-        },
-        "padding-inline-end": {
-          "css": {
-            "syntax": "<length>",
-            "inherits": true
-          }
-        }
-      }
-    }
-  }
-}

package/dist/index.css

@@ -1,53 +0,0 @@
-/**
- * @license CC0-1.0
- * Copyright (c) 2021 Community for NL Design System
- */
-.rvo-pagination {
-  align-items: center;
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--rvo-pagination-gap);
-  justify-content: center;
-}
-@media (min-width: 780px) {
-  .rvo-pagination {
-    justify-content: flex-start;
-  }
-}
-.rvo-pagination__prev .rvo-link, .rvo-pagination__next .rvo-link {
-  text-decoration: none;
-}
-.rvo-pagination__prev .rvo-link:hover, .rvo-pagination__next .rvo-link:hover {
-  text-decoration: underline;
-}
-
-.rvo-pagination__list {
-  display: flex;
-  gap: var(--rvo-pagination-gap);
-  margin-block-end: var(--rvo-pagination-list-margin-block-end);
-  margin-block-start: var(--rvo-pagination-list-margin-block-start);
-  padding-inline-end: var(--rvo-pagination-list-padding-inline-end);
-  padding-inline-start: var(--rvo-pagination-list-padding-inline-start);
-}
-
-.rvo-pagination__item {
-  font-weight: var(--rvo-font-weight-bold);
-  list-style: none;
-  min-inline-size: var(--rvo-size-xl);
-  padding-block-end: var(--rvo-space-sm);
-  padding-block-start: var(--rvo-space-sm);
-  padding-inline-end: var(--rvo-space-sm);
-  padding-inline-start: var(--rvo-space-sm);
-  text-align: center;
-}
-.rvo-pagination__item .rvo-link {
-  font-weight: var(--rvo-font-weight-regular);
-  text-decoration: none;
-}
-.rvo-pagination__item .rvo-link:hover {
-  text-decoration: underline;
-}
-.rvo-pagination__item.rvo-pagination__item--active {
-  background-color: var(--rvo-color-grijs-100);
-  font-weight: var(--rvo-font-weight-normal);
-}

package/dist/index.mjs

@@ -1 +0,0 @@
-export default ".rvo-pagination{align-items:center;display:flex;flex-wrap:wrap;gap:var(--rvo-pagination-gap);justify-content:center}@media (min-width:780px){.rvo-pagination{justify-content:flex-start}}.rvo-pagination__next .rvo-link,.rvo-pagination__prev .rvo-link{text-decoration:none}.rvo-pagination__next .rvo-link:hover,.rvo-pagination__prev .rvo-link:hover{text-decoration:underline}.rvo-pagination__list{display:flex;gap:var(--rvo-pagination-gap);margin-block-end:var(--rvo-pagination-list-margin-block-end);margin-block-start:var(--rvo-pagination-list-margin-block-start);padding-inline-end:var(--rvo-pagination-list-padding-inline-end);padding-inline-start:var(--rvo-pagination-list-padding-inline-start)}.rvo-pagination__item{font-weight:var(--rvo-font-weight-bold);list-style:none;min-inline-size:var(--rvo-size-xl);padding-block-end:var(--rvo-space-sm);padding-block-start:var(--rvo-space-sm);padding-inline-end:var(--rvo-space-sm);padding-inline-start:var(--rvo-space-sm);text-align:center}.rvo-pagination__item .rvo-link{font-weight:var(--rvo-font-weight-regular);text-decoration:none}.rvo-pagination__item .rvo-link:hover{text-decoration:underline}.rvo-pagination__item.rvo-pagination__item--active{background-color:var(--rvo-color-grijs-100);font-weight:var(--rvo-font-weight-normal)}";

package/dist/index.mjs.d.ts

@@ -1,2 +0,0 @@
-declare const css: string;
-export default css;