feat(dees-pagination): Add new pagination component to the library along with its demo and integration in the main export.

This commit is contained in:
2025-04-25 14:27:51 +00:00
parent 12861b2230
commit af3dc5c466
5 changed files with 170 additions and 1 deletions

View File

@@ -0,0 +1,28 @@
import { html } from '@design.estate/dees-element';
/**
* Demo for dees-pagination component
*/
export const demoFunc = () => html`
<div style="display: flex; align-items: center; gap: 16px;">
<!-- Small set of pages -->
<div style="display: flex; flex-direction: column; gap: 4px;">
<span>5 pages, starting at 1:</span>
<dees-pagination
.total=${5}
.page=${1}
@page-change=${(e: CustomEvent) => console.log('Page changed to', e.detail.page)}
></dees-pagination>
</div>
<!-- Larger set of pages -->
<div style="display: flex; flex-direction: column; gap: 4px;">
<span>15 pages, starting at 8:</span>
<dees-pagination
.total=${15}
.page=${8}
@page-change=${(e: CustomEvent) => console.log('Page changed to', e.detail.page)}
></dees-pagination>
</div>
</div>
`;