@spark-ui/components 16.0.3 → 16.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/pagination/PaginationFirstPageTrigger.d.ts +12 -6
- package/dist/pagination/PaginationItem.d.ts +25 -11
- package/dist/pagination/PaginationLastPageTrigger.d.ts +12 -6
- package/dist/pagination/PaginationNextTrigger.d.ts +12 -6
- package/dist/pagination/PaginationPrevTrigger.d.ts +12 -6
- package/dist/pagination/index.js +1 -1
- package/dist/pagination/index.js.map +1 -1
- package/dist/pagination/index.mjs +17 -17
- package/dist/pagination/index.mjs.map +1 -1
- package/package.json +5 -4
|
@@ -1,11 +1,17 @@
|
|
|
1
1
|
import { ComponentPropsWithoutRef, Ref } from 'react';
|
|
2
|
-
|
|
2
|
+
type AnchorProps = ComponentPropsWithoutRef<'a'> & {
|
|
3
3
|
href: string;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
4
|
+
asChild?: never;
|
|
5
|
+
};
|
|
6
|
+
type ButtonProps = ComponentPropsWithoutRef<'button'> & {
|
|
7
|
+
/**
|
|
8
|
+
* Change the component to the HTML tag or custom component of the only child.
|
|
9
|
+
* Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.
|
|
10
|
+
*/
|
|
11
|
+
asChild?: boolean;
|
|
12
|
+
href?: never;
|
|
13
|
+
};
|
|
14
|
+
export type FirstPageTriggerProps = (AnchorProps | ButtonProps) & {
|
|
9
15
|
'aria-label': string;
|
|
10
16
|
ref?: Ref<HTMLButtonElement>;
|
|
11
17
|
};
|
|
@@ -1,17 +1,31 @@
|
|
|
1
|
-
import { ComponentPropsWithoutRef, Ref } from 'react';
|
|
2
|
-
|
|
1
|
+
import { ComponentPropsWithoutRef, ReactElement, Ref } from 'react';
|
|
2
|
+
type AnchorProps = ComponentPropsWithoutRef<'a'> & {
|
|
3
3
|
href: string;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
4
|
+
asChild?: never;
|
|
5
|
+
};
|
|
6
|
+
type ButtonProps = ComponentPropsWithoutRef<'button'> & {
|
|
7
|
+
/**
|
|
8
|
+
* Change the component to the HTML tag or custom component of the only child.
|
|
9
|
+
* Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.
|
|
10
|
+
*/
|
|
11
|
+
asChild?: boolean;
|
|
12
|
+
href?: never;
|
|
13
|
+
};
|
|
14
|
+
export type ItemProps = (AnchorProps | ButtonProps) & {
|
|
9
15
|
'aria-label': string;
|
|
10
16
|
value: number;
|
|
11
17
|
ref?: Ref<HTMLButtonElement>;
|
|
12
18
|
};
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
19
|
+
/**
|
|
20
|
+
* A numbered page item.
|
|
21
|
+
* Should be used within `Pagination.Pages` to ensure proper functionality and accessibility.
|
|
22
|
+
*
|
|
23
|
+
* Can be rendered as an anchor or a button :
|
|
24
|
+
* - Set a `href` prop to render the item as an anchor element.
|
|
25
|
+
* - When using `href`, the `asChild` prop isn’t available since the component will already be rendered as an anchor element.
|
|
26
|
+
*/
|
|
27
|
+
export declare function Item({ children, value, className, href, ref, ...props }: ItemProps): ReactElement;
|
|
28
|
+
export declare namespace Item {
|
|
29
|
+
var displayName: string;
|
|
30
|
+
}
|
|
17
31
|
export {};
|
|
@@ -1,11 +1,17 @@
|
|
|
1
1
|
import { ComponentPropsWithoutRef, Ref } from 'react';
|
|
2
|
-
|
|
2
|
+
type AnchorProps = ComponentPropsWithoutRef<'a'> & {
|
|
3
3
|
href: string;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
4
|
+
asChild?: never;
|
|
5
|
+
};
|
|
6
|
+
type ButtonProps = ComponentPropsWithoutRef<'button'> & {
|
|
7
|
+
/**
|
|
8
|
+
* Change the component to the HTML tag or custom component of the only child.
|
|
9
|
+
* Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.
|
|
10
|
+
*/
|
|
11
|
+
asChild?: boolean;
|
|
12
|
+
href?: never;
|
|
13
|
+
};
|
|
14
|
+
export type LastPageTriggerProps = (AnchorProps | ButtonProps) & {
|
|
9
15
|
'aria-label': string;
|
|
10
16
|
ref?: Ref<HTMLButtonElement>;
|
|
11
17
|
};
|
|
@@ -1,11 +1,17 @@
|
|
|
1
1
|
import { ComponentPropsWithoutRef, Ref } from 'react';
|
|
2
|
-
|
|
2
|
+
type AnchorProps = ComponentPropsWithoutRef<'a'> & {
|
|
3
3
|
href: string;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
4
|
+
asChild?: never;
|
|
5
|
+
};
|
|
6
|
+
type ButtonProps = ComponentPropsWithoutRef<'button'> & {
|
|
7
|
+
/**
|
|
8
|
+
* Change the component to the HTML tag or custom component of the only child.
|
|
9
|
+
* Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.
|
|
10
|
+
*/
|
|
11
|
+
asChild?: boolean;
|
|
12
|
+
href?: never;
|
|
13
|
+
};
|
|
14
|
+
export type NextTriggerProps = (AnchorProps | ButtonProps) & {
|
|
9
15
|
'aria-label': string;
|
|
10
16
|
ref?: Ref<HTMLButtonElement>;
|
|
11
17
|
};
|
|
@@ -1,11 +1,17 @@
|
|
|
1
1
|
import { ComponentPropsWithoutRef, Ref } from 'react';
|
|
2
|
-
|
|
2
|
+
type AnchorProps = ComponentPropsWithoutRef<'a'> & {
|
|
3
3
|
href: string;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
4
|
+
asChild?: never;
|
|
5
|
+
};
|
|
6
|
+
type ButtonProps = ComponentPropsWithoutRef<'button'> & {
|
|
7
|
+
/**
|
|
8
|
+
* Change the component to the HTML tag or custom component of the only child.
|
|
9
|
+
* Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.
|
|
10
|
+
*/
|
|
11
|
+
asChild?: boolean;
|
|
12
|
+
href?: never;
|
|
13
|
+
};
|
|
14
|
+
export type PrevTriggerProps = (AnchorProps | ButtonProps) & {
|
|
9
15
|
'aria-label': string;
|
|
10
16
|
ref?: Ref<HTMLButtonElement>;
|
|
11
17
|
};
|
package/dist/pagination/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),C=require("@zag-js/pagination"),u=require("@zag-js/react"),h=require("react"),A=require("class-variance-authority"),D=require("@spark-ui/icons/ArrowDoubleLeft"),x=require("../Icon-CF0W0LKr.js"),P=require("../IconButton-D3g86WpZ.js"),I=require("../Button-B6rA3-e5.js"),M=require("@spark-ui/icons/ArrowDoubleRight"),R=require("@spark-ui/icons/ArrowVerticalRight"),O=require("@spark-ui/icons/ArrowVerticalLeft");function F(e){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(i,n,r.get?r:{enumerable:!0,get:()=>e[n]})}}return i.default=e,Object.freeze(i)}const v=F(C);function E(e,i,n){const r=(n-1)/2;let a=Math.max(0,i-r),s=Math.min(e.length,i+r+1);return s-a<n&&(a=Math.max(0,Math.min(a,e.length-n)),s=Math.min(e.length,a+n)),e.slice(a,s)}const L=h.createContext(null),V=({children:e,count:i,visiblePageItems:n=7,pageSize:r,page:a,onPageChange:s,noEllipsis:l,type:c="link"})=>{const g=l?1/0:Math.max(0,Math.floor((n-5)/2)),d=h.useId(),p=u.useMachine(v.machine,{id:d,count:i,siblingCount:g,pageSize:r,page:a,onPageChange:s,type:c}),o=v.connect(p,u.normalizeProps),B=l?E(o.pages,o.page-1,n):o.pages;return t.jsx(L.Provider,{value:{type:c,pagination:{...o,pages:B,getFirstPageTriggerProps:()=>({...o.getPrevTriggerProps(),id:`${o.getRootProps().id}:first`,"data-part":"first-page-trigger",onClick:o.goToFirstPage}),getLastPageTriggerProps:()=>({...o.getNextTriggerProps(),id:`${o.getRootProps().id}:last`,"data-part":"last-page-trigger",onClick:o.goToLastPage})}},children:e})},m=()=>{const e=h.useContext(L);if(!e)throw Error("usePagination must be used within a Pagination provider");return e},q=({children:e,visiblePageItems:i=5,type:n="link",noEllipsis:r=!1,className:a,...s})=>t.jsx(V,{visiblePageItems:i,noEllipsis:r,type:n,...s,children:t.jsx(z,{className:a,children:e})}),z=({children:e,className:i})=>{const{pagination:n}=m(),r=n.getRootProps();return t.jsx("nav",{"data-spark-component":"pagination",...r,className:i,children:t.jsx("ul",{className:"gap-md flex flex-wrap",children:e})})};q.displayName="Pagination";const j=({children:e,index:i,className:n,ref:r,...a})=>{const{pagination:s}=m(),l=s.getEllipsisProps({index:i}),c={className:A.cx("flex size-sz-44 items-center justify-center",n),...a},g=u.mergeProps(l,c);return t.jsx("li",{children:t.jsx("span",{"data-spark-component":"pagination-ellipsis",ref:r,...g,children:e||"…"})})};j.displayName="Pagination.Ellipsis";const b=({children:e,className:i,href:n,ref:r,...a})=>{const{pagination:s,type:l}=m(),c=s.getFirstPageTriggerProps(),g=l==="link"&&c["data-disabled"]==="",d={"data-spark-component":"pagination-first-page-trigger",intent:"support",design:"contrast",...a,className:i,...g&&{disabled:!0,role:"link","aria-disabled":!0}},p=u.mergeProps(c,d),o=e||t.jsx(x.Icon,{children:t.jsx(D.ArrowDoubleLeft,{})});return t.jsx("li",{children:n?t.jsx(P.IconButton,{ref:r,...p,asChild:!0,children:t.jsx("a",{href:g?void 0:n,children:o})}):t.jsx(P.IconButton,{ref:r,...p,children:o})})};b.displayName="Pagination.FirstPageTrigger";
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),C=require("@zag-js/pagination"),u=require("@zag-js/react"),h=require("react"),A=require("class-variance-authority"),D=require("@spark-ui/icons/ArrowDoubleLeft"),x=require("../Icon-CF0W0LKr.js"),P=require("../IconButton-D3g86WpZ.js"),I=require("../Button-B6rA3-e5.js"),M=require("@spark-ui/icons/ArrowDoubleRight"),R=require("@spark-ui/icons/ArrowVerticalRight"),O=require("@spark-ui/icons/ArrowVerticalLeft");function F(e){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(i,n,r.get?r:{enumerable:!0,get:()=>e[n]})}}return i.default=e,Object.freeze(i)}const v=F(C);function E(e,i,n){const r=(n-1)/2;let a=Math.max(0,i-r),s=Math.min(e.length,i+r+1);return s-a<n&&(a=Math.max(0,Math.min(a,e.length-n)),s=Math.min(e.length,a+n)),e.slice(a,s)}const L=h.createContext(null),V=({children:e,count:i,visiblePageItems:n=7,pageSize:r,page:a,onPageChange:s,noEllipsis:l,type:c="link"})=>{const g=l?1/0:Math.max(0,Math.floor((n-5)/2)),d=h.useId(),p=u.useMachine(v.machine,{id:d,count:i,siblingCount:g,pageSize:r,page:a,onPageChange:s,type:c}),o=v.connect(p,u.normalizeProps),B=l?E(o.pages,o.page-1,n):o.pages;return t.jsx(L.Provider,{value:{type:c,pagination:{...o,pages:B,getFirstPageTriggerProps:()=>({...o.getPrevTriggerProps(),id:`${o.getRootProps().id}:first`,"data-part":"first-page-trigger",onClick:o.goToFirstPage}),getLastPageTriggerProps:()=>({...o.getNextTriggerProps(),id:`${o.getRootProps().id}:last`,"data-part":"last-page-trigger",onClick:o.goToLastPage})}},children:e})},m=()=>{const e=h.useContext(L);if(!e)throw Error("usePagination must be used within a Pagination provider");return e},q=({children:e,visiblePageItems:i=5,type:n="link",noEllipsis:r=!1,className:a,...s})=>t.jsx(V,{visiblePageItems:i,noEllipsis:r,type:n,...s,children:t.jsx(z,{className:a,children:e})}),z=({children:e,className:i})=>{const{pagination:n}=m(),r=n.getRootProps();return t.jsx("nav",{"data-spark-component":"pagination",...r,className:i,children:t.jsx("ul",{className:"gap-md flex flex-wrap",children:e})})};q.displayName="Pagination";const j=({children:e,index:i,className:n,ref:r,...a})=>{const{pagination:s}=m(),l=s.getEllipsisProps({index:i}),c={className:A.cx("flex size-sz-44 items-center justify-center",n),...a},g=u.mergeProps(l,c);return t.jsx("li",{children:t.jsx("span",{"data-spark-component":"pagination-ellipsis",ref:r,...g,children:e||"…"})})};j.displayName="Pagination.Ellipsis";const b=({children:e,className:i,href:n,ref:r,...a})=>{const{pagination:s,type:l}=m(),c=s.getFirstPageTriggerProps(),g=l==="link"&&c["data-disabled"]==="",d={"data-spark-component":"pagination-first-page-trigger",intent:"support",design:"contrast",...a,className:i,...g&&{disabled:!0,role:"link","aria-disabled":!0}},p=u.mergeProps(c,d),o=e||t.jsx(x.Icon,{children:t.jsx(D.ArrowDoubleLeft,{})});return t.jsx("li",{children:n?t.jsx(P.IconButton,{ref:r,...p,asChild:!0,children:t.jsx("a",{href:g?void 0:n,children:o})}):t.jsx(P.IconButton,{ref:r,...p,children:o})})};b.displayName="Pagination.FirstPageTrigger";function y({children:e,value:i,className:n,href:r,ref:a,...s}){const{pagination:l}=m(),c=l.getItemProps({type:"page",value:i}),g={"data-spark-component":"pagination-item",intent:"support",design:c["aria-current"]==="page"?"filled":"contrast",className:n,...s},d=u.mergeProps(c,g);return t.jsx("li",{children:r?t.jsx(I.Button,{ref:a,...d,asChild:!0,children:t.jsx("a",{href:r,children:e||i})}):t.jsx(I.Button,{ref:a,...d,children:e||i})})}y.displayName="Pagination.Item";const k=({children:e,className:i,href:n,ref:r,...a})=>{const{pagination:s,type:l}=m(),c=s.getLastPageTriggerProps(),g=l==="link"&&c["data-disabled"]==="",d={"data-spark-component":"pagination-last-page-trigger",intent:"support",design:"contrast",...a,className:i,...g&&{disabled:!0,role:"link","aria-disabled":!0}},p=u.mergeProps(c,d),o=e||t.jsx(x.Icon,{children:t.jsx(M.ArrowDoubleRight,{})});return t.jsx("li",{children:n?t.jsx(P.IconButton,{ref:r,...p,asChild:!0,children:t.jsx("a",{href:g?void 0:n,children:o})}):t.jsx(P.IconButton,{ref:r,...p,children:o})})};k.displayName="Pagination.LastPageTrigger";const N=({children:e,className:i,href:n,ref:r,...a})=>{const{pagination:s,type:l}=m(),c=s.getNextTriggerProps(),g=l==="link"&&c["data-disabled"]==="",d={"data-spark-component":"pagination-next-trigger",intent:"support",design:"contrast",...a,className:i,...g&&{disabled:!0,role:"link","aria-disabled":!0}},p=u.mergeProps(c,d),o=e||t.jsx(x.Icon,{children:t.jsx(R.ArrowVerticalRight,{})});return t.jsx("li",{children:n?t.jsx(P.IconButton,{ref:r,...p,asChild:!0,children:t.jsx("a",{href:g?void 0:n,children:o})}):t.jsx(P.IconButton,{ref:r,...p,children:o})})};N.displayName="Pagination.NextTrigger";const T=({children:e})=>{const{pagination:i}=m();return e(i)};T.displayName="Pagination.Pages";const f=({children:e,className:i,href:n,ref:r,...a})=>{const{pagination:s,type:l}=m(),c=s.getPrevTriggerProps(),g=l==="link"&&c["data-disabled"]==="",d={"data-spark-component":"pagination-prev-trigger",intent:"support",design:"contrast",...a,className:i,...g&&{disabled:!0,role:"link","aria-disabled":!0}},p=u.mergeProps(c,d),o=e||t.jsx(x.Icon,{children:t.jsx(O.ArrowVerticalLeft,{})});return t.jsx("li",{children:n?t.jsx(P.IconButton,{ref:r,...p,asChild:!0,children:t.jsx("a",{href:g?void 0:n,children:o})}):t.jsx(P.IconButton,{ref:r,...p,children:o})})};f.displayName="Pagination.PrevTrigger";const w=Object.assign(q,{PrevTrigger:f,NextTrigger:N,Pages:T,Item:y,Ellipsis:j,FirstPageTrigger:b,LastPageTrigger:k});w.displayName="Pagination";f.displayName="Pagination.PrevTrigger";N.displayName="Pagination.NextTrigger";T.displayName="Pagination.Pages";y.displayName="Pagination.Item";j.displayName="Pagination.Ellipsis";b.displayName="Pagination.FirstPageTrigger";k.displayName="Pagination.LastPageTrigger";exports.Pagination=w;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/pagination/utils.ts","../../src/pagination/PaginationContext.tsx","../../src/pagination/Pagination.tsx","../../src/pagination/PaginationEllipsis.tsx","../../src/pagination/PaginationFirstPageTrigger.tsx","../../src/pagination/PaginationItem.tsx","../../src/pagination/PaginationLastPageTrigger.tsx","../../src/pagination/PaginationNextTrigger.tsx","../../src/pagination/PaginationPages.tsx","../../src/pagination/PaginationPrevTrigger.tsx","../../src/pagination/index.ts"],"sourcesContent":["export function sliceArrayWithIndex(arr: any[], index: number, length: number) {\n const relativeElements = (length - 1) / 2\n\n let start = Math.max(0, index - relativeElements)\n let end = Math.min(arr.length, index + relativeElements + 1)\n\n if (end - start < length) {\n start = Math.max(0, Math.min(start, arr.length - length))\n end = Math.min(arr.length, start + length)\n }\n\n return arr.slice(start, end)\n}\n","import * as pagination from '@zag-js/pagination'\nimport { normalizeProps, type PropTypes, useMachine } from '@zag-js/react'\nimport { createContext, type ReactNode, useContext, useId } from 'react'\n\nimport { sliceArrayWithIndex } from './utils'\n\nexport interface PaginationContextState<T extends PropTypes = PropTypes> {\n type: pagination.Props['type']\n pagination: pagination.Api<T> & {\n getFirstPageTriggerProps: () => ReturnType<pagination.Api<T>['getPrevTriggerProps']> & {\n 'data-part': string\n onClick: () => void\n }\n getLastPageTriggerProps: () => ReturnType<pagination.Api<T>['getNextTriggerProps']> & {\n 'data-part': string\n onClick: () => void\n }\n }\n}\n\nconst PaginationContext = createContext<PaginationContextState | null>(null)\n\nexport interface PaginationProviderProps {\n children: ReactNode\n /**\n * Total number of data items available across all pages.\n */\n count: number\n /**\n * Maximum amount of items displayed on a single page.\n */\n pageSize: number\n /**\n * Number of visible pages (or ellipsis) between previous and next page triggers.\n */\n visiblePageItems?: number\n /**\n * The current page (active page)\n */\n page?: pagination.Props['page']\n /**\n * If your pagination contains buttons instead of links, set `type` to `button`, extra attributes will be applied on page items for a11y.\n */\n type?: pagination.Props['type']\n onPageChange?: pagination.Props['onPageChange']\n noEllipsis?: boolean\n}\n\nexport const PaginationProvider = ({\n children,\n count,\n visiblePageItems = 7,\n pageSize,\n page,\n onPageChange,\n noEllipsis,\n type = 'link',\n}: PaginationProviderProps) => {\n /**\n * Here `Infinity` is used because we apply a custom slice ourselves to manage the \"no ellipsis\" version.\n * It means Zag won't filter out any page item, allowing us to apply our own slicing logic.\n */\n const siblingCount = noEllipsis ? Infinity : Math.max(0, Math.floor((visiblePageItems - 5) / 2))\n\n const id = useId()\n\n const service = useMachine(pagination.machine, {\n id,\n count,\n siblingCount,\n pageSize,\n page,\n onPageChange,\n type,\n })\n\n const api = pagination.connect(service, normalizeProps)\n const pages = noEllipsis\n ? sliceArrayWithIndex(api.pages, api.page - 1, visiblePageItems)\n : api.pages\n\n return (\n <PaginationContext.Provider\n value={{\n type,\n pagination: {\n ...api,\n pages,\n // Extending ZagJS anatomy\n getFirstPageTriggerProps: () => {\n return {\n ...api.getPrevTriggerProps(),\n id: `${api.getRootProps().id}:first`,\n 'data-part': 'first-page-trigger',\n onClick: api.goToFirstPage,\n }\n },\n getLastPageTriggerProps: () => {\n return {\n ...api.getNextTriggerProps(),\n id: `${api.getRootProps().id}:last`,\n 'data-part': 'last-page-trigger',\n onClick: api.goToLastPage,\n }\n },\n },\n }}\n >\n {children}\n </PaginationContext.Provider>\n )\n}\n\nexport const usePagination = () => {\n const context = useContext(PaginationContext)\n\n if (!context) {\n throw Error('usePagination must be used within a Pagination provider')\n }\n\n return context\n}\n","import { ReactNode } from 'react'\n\nimport {\n PaginationProvider,\n type PaginationProviderProps,\n usePagination,\n} from './PaginationContext'\n\nexport type PaginationProps = PaginationProviderProps & { className?: string }\n\nexport const Pagination = ({\n children,\n visiblePageItems = 5,\n type = 'link',\n noEllipsis = false,\n className,\n ...rest\n}: PaginationProps) => {\n return (\n <PaginationProvider\n visiblePageItems={visiblePageItems}\n noEllipsis={noEllipsis}\n type={type}\n {...rest}\n >\n <PaginationWrapper className={className}>{children}</PaginationWrapper>\n </PaginationProvider>\n )\n}\n\nconst PaginationWrapper = ({\n children,\n className,\n}: {\n children: ReactNode\n className?: string\n}) => {\n const { pagination } = usePagination()\n\n const props = pagination.getRootProps()\n\n return (\n <nav data-spark-component=\"pagination\" {...props} className={className}>\n <ul className=\"gap-md flex flex-wrap\">{children}</ul>\n </nav>\n )\n}\n\nPagination.displayName = 'Pagination'\n","import { mergeProps } from '@zag-js/react'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithRef } from 'react'\n\nimport { usePagination } from './PaginationContext'\n\ninterface EllipsisProps extends ComponentPropsWithRef<'span'> {\n index: number\n}\n\nexport const Ellipsis = ({ children, index, className, ref, ...rest }: EllipsisProps) => {\n const { pagination } = usePagination()\n const apiProps = pagination.getEllipsisProps({ index })\n const localProps = {\n className: cx('flex size-sz-44 items-center justify-center', className),\n ...rest,\n }\n\n const mergedProps = mergeProps(apiProps, localProps)\n\n return (\n <li>\n <span data-spark-component=\"pagination-ellipsis\" ref={ref} {...mergedProps}>\n {children || '\\u2026'}\n </span>\n </li>\n )\n}\n\nEllipsis.displayName = 'Pagination.Ellipsis'\n","import { ArrowDoubleLeft } from '@spark-ui/icons/ArrowDoubleLeft'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ninterface AnchorProps extends ComponentPropsWithoutRef<'a'> {\n href: string\n}\n\ninterface ButtonProps extends ComponentPropsWithoutRef<'button'> {\n href?: undefined\n}\nexport type FirstPageTriggerProps = Omit<AnchorProps | ButtonProps, 'aria-label'> & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const FirstPageTrigger = ({\n children,\n className,\n href,\n ref,\n ...props\n}: FirstPageTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getFirstPageTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-first-page-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowDoubleLeft />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nFirstPageTrigger.displayName = 'Pagination.FirstPageTrigger'\n","import { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Button } from '../button'\nimport { usePagination } from './PaginationContext'\n\ninterface AnchorProps extends ComponentPropsWithoutRef<'a'> {\n href: string\n}\n\ninterface ButtonProps extends ComponentPropsWithoutRef<'button'> {\n href?: undefined\n}\nexport type ItemProps = Omit<AnchorProps | ButtonProps, 'aria-label'> & {\n 'aria-label': string\n value: number\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const Item = ({ children, value, className, href, ref, ...props }: ItemProps) => {\n const { pagination } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getItemProps({ type: 'page', value })\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-item',\n intent: 'support',\n design: apiProps['aria-current'] === 'page' ? 'filled' : 'contrast',\n className,\n ...props,\n }\n\n const mergedProps = mergeProps(apiProps, localProps)\n\n return (\n <li>\n {href ? (\n <Button ref={ref} {...mergedProps} asChild>\n <a href={href}>{children || value}</a>\n </Button>\n ) : (\n <Button ref={ref} {...mergedProps}>\n {children || value}\n </Button>\n )}\n </li>\n )\n}\n\nItem.displayName = 'Pagination.Item'\n","import { ArrowDoubleRight } from '@spark-ui/icons/ArrowDoubleRight'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ninterface AnchorProps extends ComponentPropsWithoutRef<'a'> {\n href: string\n}\n\ninterface ButtonProps extends ComponentPropsWithoutRef<'button'> {\n href?: undefined\n}\nexport type LastPageTriggerProps = Omit<AnchorProps | ButtonProps, 'aria-label'> & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const LastPageTrigger = ({\n children,\n className,\n href,\n ref,\n ...props\n}: LastPageTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getLastPageTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-last-page-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowDoubleRight />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nLastPageTrigger.displayName = 'Pagination.LastPageTrigger'\n","import { ArrowVerticalRight } from '@spark-ui/icons/ArrowVerticalRight'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ninterface AnchorProps extends ComponentPropsWithoutRef<'a'> {\n href: string\n}\n\ninterface ButtonProps extends ComponentPropsWithoutRef<'button'> {\n href?: undefined\n}\nexport type NextTriggerProps = Omit<AnchorProps | ButtonProps, 'aria-label'> & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const NextTrigger = ({ children, className, href, ref, ...props }: NextTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getNextTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-next-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowVerticalRight />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nNextTrigger.displayName = 'Pagination.NextTrigger'\n","import * as pagination from '@zag-js/pagination'\nimport { ReactNode } from 'react'\n\nimport { usePagination } from './PaginationContext'\n\n// Extract the 'page' type element from the pagination API's 'pages' array.\ntype PageItem = Extract<pagination.Api['pages'][number], { type: 'page' }>\n\n// Define a type that conditionally tweaks the pagination API\n// based on the generic T parameter.\ntype TweakedPaginationApi<T extends 'noEllipsis' | ''> = Omit<pagination.Api, 'pages'> & {\n pages: T extends 'noEllipsis' ? PageItem[] : pagination.Api['pages']\n}\n\ninterface PagesProps<T extends 'noEllipsis' | ''> {\n children: (pagination: TweakedPaginationApi<T>) => ReactNode\n}\n\nexport const Pages = <T extends 'noEllipsis' | '' = ''>({ children }: PagesProps<T>) => {\n const { pagination } = usePagination()\n\n return children(pagination as TweakedPaginationApi<T>)\n}\n\nPages.displayName = 'Pagination.Pages'\n","import { ArrowVerticalLeft } from '@spark-ui/icons/ArrowVerticalLeft'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ninterface AnchorProps extends ComponentPropsWithoutRef<'a'> {\n href: string\n}\n\ninterface ButtonProps extends ComponentPropsWithoutRef<'button'> {\n href?: undefined\n}\nexport type PrevTriggerProps = Omit<AnchorProps | ButtonProps, 'aria-label'> & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const PrevTrigger = ({ children, className, href, ref, ...props }: PrevTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getPrevTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-prev-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowVerticalLeft />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nPrevTrigger.displayName = 'Pagination.PrevTrigger'\n","import type { FC } from 'react'\n\nimport { Pagination as Root, type PaginationProps } from './Pagination'\nimport { Ellipsis } from './PaginationEllipsis'\nimport { FirstPageTrigger } from './PaginationFirstPageTrigger'\nimport { Item } from './PaginationItem'\nimport { LastPageTrigger } from './PaginationLastPageTrigger'\nimport { NextTrigger } from './PaginationNextTrigger'\nimport { Pages } from './PaginationPages'\nimport { PrevTrigger } from './PaginationPrevTrigger'\n\nexport const Pagination: FC<PaginationProps> & {\n PrevTrigger: typeof PrevTrigger\n NextTrigger: typeof NextTrigger\n Pages: typeof Pages\n Item: typeof Item\n Ellipsis: typeof Ellipsis\n FirstPageTrigger: typeof FirstPageTrigger\n LastPageTrigger: typeof LastPageTrigger\n} = Object.assign(Root, {\n PrevTrigger,\n NextTrigger,\n Pages,\n Item,\n Ellipsis,\n FirstPageTrigger,\n LastPageTrigger,\n})\n\nPagination.displayName = 'Pagination'\n\nPrevTrigger.displayName = 'Pagination.PrevTrigger'\nNextTrigger.displayName = 'Pagination.NextTrigger'\nPages.displayName = 'Pagination.Pages'\nItem.displayName = 'Pagination.Item'\nEllipsis.displayName = 'Pagination.Ellipsis'\nFirstPageTrigger.displayName = 'Pagination.FirstPageTrigger'\nLastPageTrigger.displayName = 'Pagination.LastPageTrigger'\n"],"names":["sliceArrayWithIndex","arr","index","length","relativeElements","start","end","PaginationContext","createContext","PaginationProvider","children","count","visiblePageItems","pageSize","page","onPageChange","noEllipsis","type","siblingCount","id","useId","service","useMachine","pagination","api","normalizeProps","pages","jsx","usePagination","context","useContext","Pagination","className","rest","PaginationWrapper","props","Ellipsis","ref","apiProps","localProps","cx","mergedProps","mergeProps","FirstPageTrigger","href","shouldDisableLink","content","Icon","ArrowDoubleLeft","IconButton","Item","value","Button","LastPageTrigger","ArrowDoubleRight","NextTrigger","ArrowVerticalRight","Pages","PrevTrigger","ArrowVerticalLeft","Root"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/pagination/utils.ts","../../src/pagination/PaginationContext.tsx","../../src/pagination/Pagination.tsx","../../src/pagination/PaginationEllipsis.tsx","../../src/pagination/PaginationFirstPageTrigger.tsx","../../src/pagination/PaginationItem.tsx","../../src/pagination/PaginationLastPageTrigger.tsx","../../src/pagination/PaginationNextTrigger.tsx","../../src/pagination/PaginationPages.tsx","../../src/pagination/PaginationPrevTrigger.tsx","../../src/pagination/index.ts"],"sourcesContent":["export function sliceArrayWithIndex(arr: any[], index: number, length: number) {\n const relativeElements = (length - 1) / 2\n\n let start = Math.max(0, index - relativeElements)\n let end = Math.min(arr.length, index + relativeElements + 1)\n\n if (end - start < length) {\n start = Math.max(0, Math.min(start, arr.length - length))\n end = Math.min(arr.length, start + length)\n }\n\n return arr.slice(start, end)\n}\n","import * as pagination from '@zag-js/pagination'\nimport { normalizeProps, type PropTypes, useMachine } from '@zag-js/react'\nimport { createContext, type ReactNode, useContext, useId } from 'react'\n\nimport { sliceArrayWithIndex } from './utils'\n\nexport interface PaginationContextState<T extends PropTypes = PropTypes> {\n type: pagination.Props['type']\n pagination: pagination.Api<T> & {\n getFirstPageTriggerProps: () => ReturnType<pagination.Api<T>['getPrevTriggerProps']> & {\n 'data-part': string\n onClick: () => void\n }\n getLastPageTriggerProps: () => ReturnType<pagination.Api<T>['getNextTriggerProps']> & {\n 'data-part': string\n onClick: () => void\n }\n }\n}\n\nconst PaginationContext = createContext<PaginationContextState | null>(null)\n\nexport interface PaginationProviderProps {\n children: ReactNode\n /**\n * Total number of data items available across all pages.\n */\n count: number\n /**\n * Maximum amount of items displayed on a single page.\n */\n pageSize: number\n /**\n * Number of visible pages (or ellipsis) between previous and next page triggers.\n */\n visiblePageItems?: number\n /**\n * The current page (active page)\n */\n page?: pagination.Props['page']\n /**\n * If your pagination contains buttons instead of links, set `type` to `button`, extra attributes will be applied on page items for a11y.\n */\n type?: pagination.Props['type']\n onPageChange?: pagination.Props['onPageChange']\n noEllipsis?: boolean\n}\n\nexport const PaginationProvider = ({\n children,\n count,\n visiblePageItems = 7,\n pageSize,\n page,\n onPageChange,\n noEllipsis,\n type = 'link',\n}: PaginationProviderProps) => {\n /**\n * Here `Infinity` is used because we apply a custom slice ourselves to manage the \"no ellipsis\" version.\n * It means Zag won't filter out any page item, allowing us to apply our own slicing logic.\n */\n const siblingCount = noEllipsis ? Infinity : Math.max(0, Math.floor((visiblePageItems - 5) / 2))\n\n const id = useId()\n\n const service = useMachine(pagination.machine, {\n id,\n count,\n siblingCount,\n pageSize,\n page,\n onPageChange,\n type,\n })\n\n const api = pagination.connect(service, normalizeProps)\n const pages = noEllipsis\n ? sliceArrayWithIndex(api.pages, api.page - 1, visiblePageItems)\n : api.pages\n\n return (\n <PaginationContext.Provider\n value={{\n type,\n pagination: {\n ...api,\n pages,\n // Extending ZagJS anatomy\n getFirstPageTriggerProps: () => {\n return {\n ...api.getPrevTriggerProps(),\n id: `${api.getRootProps().id}:first`,\n 'data-part': 'first-page-trigger',\n onClick: api.goToFirstPage,\n }\n },\n getLastPageTriggerProps: () => {\n return {\n ...api.getNextTriggerProps(),\n id: `${api.getRootProps().id}:last`,\n 'data-part': 'last-page-trigger',\n onClick: api.goToLastPage,\n }\n },\n },\n }}\n >\n {children}\n </PaginationContext.Provider>\n )\n}\n\nexport const usePagination = () => {\n const context = useContext(PaginationContext)\n\n if (!context) {\n throw Error('usePagination must be used within a Pagination provider')\n }\n\n return context\n}\n","import { ReactNode } from 'react'\n\nimport {\n PaginationProvider,\n type PaginationProviderProps,\n usePagination,\n} from './PaginationContext'\n\nexport type PaginationProps = PaginationProviderProps & { className?: string }\n\nexport const Pagination = ({\n children,\n visiblePageItems = 5,\n type = 'link',\n noEllipsis = false,\n className,\n ...rest\n}: PaginationProps) => {\n return (\n <PaginationProvider\n visiblePageItems={visiblePageItems}\n noEllipsis={noEllipsis}\n type={type}\n {...rest}\n >\n <PaginationWrapper className={className}>{children}</PaginationWrapper>\n </PaginationProvider>\n )\n}\n\nconst PaginationWrapper = ({\n children,\n className,\n}: {\n children: ReactNode\n className?: string\n}) => {\n const { pagination } = usePagination()\n\n const props = pagination.getRootProps()\n\n return (\n <nav data-spark-component=\"pagination\" {...props} className={className}>\n <ul className=\"gap-md flex flex-wrap\">{children}</ul>\n </nav>\n )\n}\n\nPagination.displayName = 'Pagination'\n","import { mergeProps } from '@zag-js/react'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithRef } from 'react'\n\nimport { usePagination } from './PaginationContext'\n\ninterface EllipsisProps extends ComponentPropsWithRef<'span'> {\n index: number\n}\n\nexport const Ellipsis = ({ children, index, className, ref, ...rest }: EllipsisProps) => {\n const { pagination } = usePagination()\n const apiProps = pagination.getEllipsisProps({ index })\n const localProps = {\n className: cx('flex size-sz-44 items-center justify-center', className),\n ...rest,\n }\n\n const mergedProps = mergeProps(apiProps, localProps)\n\n return (\n <li>\n <span data-spark-component=\"pagination-ellipsis\" ref={ref} {...mergedProps}>\n {children || '\\u2026'}\n </span>\n </li>\n )\n}\n\nEllipsis.displayName = 'Pagination.Ellipsis'\n","import { ArrowDoubleLeft } from '@spark-ui/icons/ArrowDoubleLeft'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ntype AnchorProps = ComponentPropsWithoutRef<'a'> & {\n href: string\n asChild?: never\n}\n\ntype ButtonProps = ComponentPropsWithoutRef<'button'> & {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n * Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.\n */\n asChild?: boolean\n href?: never\n}\n\nexport type FirstPageTriggerProps = (AnchorProps | ButtonProps) & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const FirstPageTrigger = ({\n children,\n className,\n href,\n ref,\n ...props\n}: FirstPageTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getFirstPageTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-first-page-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowDoubleLeft />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nFirstPageTrigger.displayName = 'Pagination.FirstPageTrigger'\n","import { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, ReactElement, Ref } from 'react'\n\nimport { Button } from '../button'\nimport { usePagination } from './PaginationContext'\n\ntype AnchorProps = ComponentPropsWithoutRef<'a'> & {\n href: string\n asChild?: never\n}\n\ntype ButtonProps = ComponentPropsWithoutRef<'button'> & {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n * Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.\n */\n asChild?: boolean\n href?: never\n}\n\nexport type ItemProps = (AnchorProps | ButtonProps) & {\n 'aria-label': string\n value: number\n ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A numbered page item.\n * Should be used within `Pagination.Pages` to ensure proper functionality and accessibility.\n *\n * Can be rendered as an anchor or a button :\n * - Set a `href` prop to render the item as an anchor element.\n * - When using `href`, the `asChild` prop isn’t available since the component will already be rendered as an anchor element.\n */\nexport function Item({ children, value, className, href, ref, ...props }: ItemProps): ReactElement {\n const { pagination } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getItemProps({ type: 'page', value })\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-item',\n intent: 'support',\n design: apiProps['aria-current'] === 'page' ? 'filled' : 'contrast',\n className,\n ...props,\n }\n\n const mergedProps = mergeProps(apiProps, localProps)\n\n return (\n <li>\n {href ? (\n <Button ref={ref} {...mergedProps} asChild>\n <a href={href}>{children || value}</a>\n </Button>\n ) : (\n <Button ref={ref} {...mergedProps}>\n {children || value}\n </Button>\n )}\n </li>\n )\n}\n\nItem.displayName = 'Pagination.Item'\n","import { ArrowDoubleRight } from '@spark-ui/icons/ArrowDoubleRight'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ntype AnchorProps = ComponentPropsWithoutRef<'a'> & {\n href: string\n asChild?: never\n}\n\ntype ButtonProps = ComponentPropsWithoutRef<'button'> & {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n * Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.\n */\n asChild?: boolean\n href?: never\n}\n\nexport type LastPageTriggerProps = (AnchorProps | ButtonProps) & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const LastPageTrigger = ({\n children,\n className,\n href,\n ref,\n ...props\n}: LastPageTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getLastPageTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-last-page-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowDoubleRight />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nLastPageTrigger.displayName = 'Pagination.LastPageTrigger'\n","import { ArrowVerticalRight } from '@spark-ui/icons/ArrowVerticalRight'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ntype AnchorProps = ComponentPropsWithoutRef<'a'> & {\n href: string\n asChild?: never\n}\n\ntype ButtonProps = ComponentPropsWithoutRef<'button'> & {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n * Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.\n */\n asChild?: boolean\n href?: never\n}\n\nexport type NextTriggerProps = (AnchorProps | ButtonProps) & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const NextTrigger = ({ children, className, href, ref, ...props }: NextTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getNextTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-next-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowVerticalRight />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nNextTrigger.displayName = 'Pagination.NextTrigger'\n","import * as pagination from '@zag-js/pagination'\nimport { ReactNode } from 'react'\n\nimport { usePagination } from './PaginationContext'\n\n// Extract the 'page' type element from the pagination API's 'pages' array.\ntype PageItem = Extract<pagination.Api['pages'][number], { type: 'page' }>\n\n// Define a type that conditionally tweaks the pagination API\n// based on the generic T parameter.\ntype TweakedPaginationApi<T extends 'noEllipsis' | ''> = Omit<pagination.Api, 'pages'> & {\n pages: T extends 'noEllipsis' ? PageItem[] : pagination.Api['pages']\n}\n\ninterface PagesProps<T extends 'noEllipsis' | ''> {\n children: (pagination: TweakedPaginationApi<T>) => ReactNode\n}\n\nexport const Pages = <T extends 'noEllipsis' | '' = ''>({ children }: PagesProps<T>) => {\n const { pagination } = usePagination()\n\n return children(pagination as TweakedPaginationApi<T>)\n}\n\nPages.displayName = 'Pagination.Pages'\n","import { ArrowVerticalLeft } from '@spark-ui/icons/ArrowVerticalLeft'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ntype AnchorProps = ComponentPropsWithoutRef<'a'> & {\n href: string\n asChild?: never\n}\n\ntype ButtonProps = ComponentPropsWithoutRef<'button'> & {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n * Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.\n */\n asChild?: boolean\n href?: never\n}\n\nexport type PrevTriggerProps = (AnchorProps | ButtonProps) & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const PrevTrigger = ({ children, className, href, ref, ...props }: PrevTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getPrevTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-prev-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowVerticalLeft />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nPrevTrigger.displayName = 'Pagination.PrevTrigger'\n","import type { FC } from 'react'\n\nimport { Pagination as Root, type PaginationProps } from './Pagination'\nimport { Ellipsis } from './PaginationEllipsis'\nimport { FirstPageTrigger } from './PaginationFirstPageTrigger'\nimport { Item } from './PaginationItem'\nimport { LastPageTrigger } from './PaginationLastPageTrigger'\nimport { NextTrigger } from './PaginationNextTrigger'\nimport { Pages } from './PaginationPages'\nimport { PrevTrigger } from './PaginationPrevTrigger'\n\nexport const Pagination: FC<PaginationProps> & {\n PrevTrigger: typeof PrevTrigger\n NextTrigger: typeof NextTrigger\n Pages: typeof Pages\n Item: typeof Item\n Ellipsis: typeof Ellipsis\n FirstPageTrigger: typeof FirstPageTrigger\n LastPageTrigger: typeof LastPageTrigger\n} = Object.assign(Root, {\n PrevTrigger,\n NextTrigger,\n Pages,\n Item,\n Ellipsis,\n FirstPageTrigger,\n LastPageTrigger,\n})\n\nPagination.displayName = 'Pagination'\n\nPrevTrigger.displayName = 'Pagination.PrevTrigger'\nNextTrigger.displayName = 'Pagination.NextTrigger'\nPages.displayName = 'Pagination.Pages'\nItem.displayName = 'Pagination.Item'\nEllipsis.displayName = 'Pagination.Ellipsis'\nFirstPageTrigger.displayName = 'Pagination.FirstPageTrigger'\nLastPageTrigger.displayName = 'Pagination.LastPageTrigger'\n"],"names":["sliceArrayWithIndex","arr","index","length","relativeElements","start","end","PaginationContext","createContext","PaginationProvider","children","count","visiblePageItems","pageSize","page","onPageChange","noEllipsis","type","siblingCount","id","useId","service","useMachine","pagination","api","normalizeProps","pages","jsx","usePagination","context","useContext","Pagination","className","rest","PaginationWrapper","props","Ellipsis","ref","apiProps","localProps","cx","mergedProps","mergeProps","FirstPageTrigger","href","shouldDisableLink","content","Icon","ArrowDoubleLeft","IconButton","Item","value","Button","LastPageTrigger","ArrowDoubleRight","NextTrigger","ArrowVerticalRight","Pages","PrevTrigger","ArrowVerticalLeft","Root"],"mappings":"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"}
|
|
@@ -89,15 +89,15 @@ const C = F(null), W = ({
|
|
|
89
89
|
return /* @__PURE__ */ t("nav", { "data-spark-component": "pagination", ...a, className: e, children: /* @__PURE__ */ t("ul", { className: "gap-md flex flex-wrap", children: i }) });
|
|
90
90
|
};
|
|
91
91
|
I.displayName = "Pagination";
|
|
92
|
-
const
|
|
92
|
+
const f = ({ children: i, index: e, className: n, ref: a, ...r }) => {
|
|
93
93
|
const { pagination: s } = m(), l = s.getEllipsisProps({ index: e }), g = {
|
|
94
94
|
className: R("flex size-sz-44 items-center justify-center", n),
|
|
95
95
|
...r
|
|
96
96
|
}, p = u(l, g);
|
|
97
97
|
return /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t("span", { "data-spark-component": "pagination-ellipsis", ref: a, ...p, children: i || "…" }) });
|
|
98
98
|
};
|
|
99
|
-
|
|
100
|
-
const
|
|
99
|
+
f.displayName = "Pagination.Ellipsis";
|
|
100
|
+
const k = ({
|
|
101
101
|
children: i,
|
|
102
102
|
className: e,
|
|
103
103
|
href: n,
|
|
@@ -121,8 +121,8 @@ const y = ({
|
|
|
121
121
|
), o = i || /* @__PURE__ */ t(h, { children: /* @__PURE__ */ t(j, {}) });
|
|
122
122
|
return /* @__PURE__ */ t("li", { children: n ? /* @__PURE__ */ t(P, { ref: a, ...c, asChild: !0, children: /* @__PURE__ */ t("a", { href: p ? void 0 : n, children: o }) }) : /* @__PURE__ */ t(P, { ref: a, ...c, children: o }) });
|
|
123
123
|
};
|
|
124
|
-
|
|
125
|
-
|
|
124
|
+
k.displayName = "Pagination.FirstPageTrigger";
|
|
125
|
+
function y({ children: i, value: e, className: n, href: a, ref: r, ...s }) {
|
|
126
126
|
const { pagination: l } = m(), g = l.getItemProps({ type: "page", value: e }), p = {
|
|
127
127
|
"data-spark-component": "pagination-item",
|
|
128
128
|
intent: "support",
|
|
@@ -131,9 +131,9 @@ const N = ({ children: i, value: e, className: n, href: a, ref: r, ...s }) => {
|
|
|
131
131
|
...s
|
|
132
132
|
}, d = u(g, p);
|
|
133
133
|
return /* @__PURE__ */ t("li", { children: a ? /* @__PURE__ */ t(L, { ref: r, ...d, asChild: !0, children: /* @__PURE__ */ t("a", { href: a, children: i || e }) }) : /* @__PURE__ */ t(L, { ref: r, ...d, children: i || e }) });
|
|
134
|
-
}
|
|
135
|
-
|
|
136
|
-
const
|
|
134
|
+
}
|
|
135
|
+
y.displayName = "Pagination.Item";
|
|
136
|
+
const N = ({
|
|
137
137
|
children: i,
|
|
138
138
|
className: e,
|
|
139
139
|
href: n,
|
|
@@ -157,7 +157,7 @@ const f = ({
|
|
|
157
157
|
), o = i || /* @__PURE__ */ t(h, { children: /* @__PURE__ */ t(z, {}) });
|
|
158
158
|
return /* @__PURE__ */ t("li", { children: n ? /* @__PURE__ */ t(P, { ref: a, ...c, asChild: !0, children: /* @__PURE__ */ t("a", { href: p ? void 0 : n, children: o }) }) : /* @__PURE__ */ t(P, { ref: a, ...c, children: o }) });
|
|
159
159
|
};
|
|
160
|
-
|
|
160
|
+
N.displayName = "Pagination.LastPageTrigger";
|
|
161
161
|
const T = ({ children: i, className: e, href: n, ref: a, ...r }) => {
|
|
162
162
|
const { pagination: s, type: l } = m(), g = s.getNextTriggerProps(), p = l === "link" && g["data-disabled"] === "", d = {
|
|
163
163
|
"data-spark-component": "pagination-next-trigger",
|
|
@@ -205,19 +205,19 @@ const q = Object.assign(I, {
|
|
|
205
205
|
PrevTrigger: x,
|
|
206
206
|
NextTrigger: T,
|
|
207
207
|
Pages: b,
|
|
208
|
-
Item:
|
|
209
|
-
Ellipsis:
|
|
210
|
-
FirstPageTrigger:
|
|
211
|
-
LastPageTrigger:
|
|
208
|
+
Item: y,
|
|
209
|
+
Ellipsis: f,
|
|
210
|
+
FirstPageTrigger: k,
|
|
211
|
+
LastPageTrigger: N
|
|
212
212
|
});
|
|
213
213
|
q.displayName = "Pagination";
|
|
214
214
|
x.displayName = "Pagination.PrevTrigger";
|
|
215
215
|
T.displayName = "Pagination.NextTrigger";
|
|
216
216
|
b.displayName = "Pagination.Pages";
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
217
|
+
y.displayName = "Pagination.Item";
|
|
218
|
+
f.displayName = "Pagination.Ellipsis";
|
|
219
|
+
k.displayName = "Pagination.FirstPageTrigger";
|
|
220
|
+
N.displayName = "Pagination.LastPageTrigger";
|
|
221
221
|
export {
|
|
222
222
|
q as Pagination
|
|
223
223
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/pagination/utils.ts","../../src/pagination/PaginationContext.tsx","../../src/pagination/Pagination.tsx","../../src/pagination/PaginationEllipsis.tsx","../../src/pagination/PaginationFirstPageTrigger.tsx","../../src/pagination/PaginationItem.tsx","../../src/pagination/PaginationLastPageTrigger.tsx","../../src/pagination/PaginationNextTrigger.tsx","../../src/pagination/PaginationPages.tsx","../../src/pagination/PaginationPrevTrigger.tsx","../../src/pagination/index.ts"],"sourcesContent":["export function sliceArrayWithIndex(arr: any[], index: number, length: number) {\n const relativeElements = (length - 1) / 2\n\n let start = Math.max(0, index - relativeElements)\n let end = Math.min(arr.length, index + relativeElements + 1)\n\n if (end - start < length) {\n start = Math.max(0, Math.min(start, arr.length - length))\n end = Math.min(arr.length, start + length)\n }\n\n return arr.slice(start, end)\n}\n","import * as pagination from '@zag-js/pagination'\nimport { normalizeProps, type PropTypes, useMachine } from '@zag-js/react'\nimport { createContext, type ReactNode, useContext, useId } from 'react'\n\nimport { sliceArrayWithIndex } from './utils'\n\nexport interface PaginationContextState<T extends PropTypes = PropTypes> {\n type: pagination.Props['type']\n pagination: pagination.Api<T> & {\n getFirstPageTriggerProps: () => ReturnType<pagination.Api<T>['getPrevTriggerProps']> & {\n 'data-part': string\n onClick: () => void\n }\n getLastPageTriggerProps: () => ReturnType<pagination.Api<T>['getNextTriggerProps']> & {\n 'data-part': string\n onClick: () => void\n }\n }\n}\n\nconst PaginationContext = createContext<PaginationContextState | null>(null)\n\nexport interface PaginationProviderProps {\n children: ReactNode\n /**\n * Total number of data items available across all pages.\n */\n count: number\n /**\n * Maximum amount of items displayed on a single page.\n */\n pageSize: number\n /**\n * Number of visible pages (or ellipsis) between previous and next page triggers.\n */\n visiblePageItems?: number\n /**\n * The current page (active page)\n */\n page?: pagination.Props['page']\n /**\n * If your pagination contains buttons instead of links, set `type` to `button`, extra attributes will be applied on page items for a11y.\n */\n type?: pagination.Props['type']\n onPageChange?: pagination.Props['onPageChange']\n noEllipsis?: boolean\n}\n\nexport const PaginationProvider = ({\n children,\n count,\n visiblePageItems = 7,\n pageSize,\n page,\n onPageChange,\n noEllipsis,\n type = 'link',\n}: PaginationProviderProps) => {\n /**\n * Here `Infinity` is used because we apply a custom slice ourselves to manage the \"no ellipsis\" version.\n * It means Zag won't filter out any page item, allowing us to apply our own slicing logic.\n */\n const siblingCount = noEllipsis ? Infinity : Math.max(0, Math.floor((visiblePageItems - 5) / 2))\n\n const id = useId()\n\n const service = useMachine(pagination.machine, {\n id,\n count,\n siblingCount,\n pageSize,\n page,\n onPageChange,\n type,\n })\n\n const api = pagination.connect(service, normalizeProps)\n const pages = noEllipsis\n ? sliceArrayWithIndex(api.pages, api.page - 1, visiblePageItems)\n : api.pages\n\n return (\n <PaginationContext.Provider\n value={{\n type,\n pagination: {\n ...api,\n pages,\n // Extending ZagJS anatomy\n getFirstPageTriggerProps: () => {\n return {\n ...api.getPrevTriggerProps(),\n id: `${api.getRootProps().id}:first`,\n 'data-part': 'first-page-trigger',\n onClick: api.goToFirstPage,\n }\n },\n getLastPageTriggerProps: () => {\n return {\n ...api.getNextTriggerProps(),\n id: `${api.getRootProps().id}:last`,\n 'data-part': 'last-page-trigger',\n onClick: api.goToLastPage,\n }\n },\n },\n }}\n >\n {children}\n </PaginationContext.Provider>\n )\n}\n\nexport const usePagination = () => {\n const context = useContext(PaginationContext)\n\n if (!context) {\n throw Error('usePagination must be used within a Pagination provider')\n }\n\n return context\n}\n","import { ReactNode } from 'react'\n\nimport {\n PaginationProvider,\n type PaginationProviderProps,\n usePagination,\n} from './PaginationContext'\n\nexport type PaginationProps = PaginationProviderProps & { className?: string }\n\nexport const Pagination = ({\n children,\n visiblePageItems = 5,\n type = 'link',\n noEllipsis = false,\n className,\n ...rest\n}: PaginationProps) => {\n return (\n <PaginationProvider\n visiblePageItems={visiblePageItems}\n noEllipsis={noEllipsis}\n type={type}\n {...rest}\n >\n <PaginationWrapper className={className}>{children}</PaginationWrapper>\n </PaginationProvider>\n )\n}\n\nconst PaginationWrapper = ({\n children,\n className,\n}: {\n children: ReactNode\n className?: string\n}) => {\n const { pagination } = usePagination()\n\n const props = pagination.getRootProps()\n\n return (\n <nav data-spark-component=\"pagination\" {...props} className={className}>\n <ul className=\"gap-md flex flex-wrap\">{children}</ul>\n </nav>\n )\n}\n\nPagination.displayName = 'Pagination'\n","import { mergeProps } from '@zag-js/react'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithRef } from 'react'\n\nimport { usePagination } from './PaginationContext'\n\ninterface EllipsisProps extends ComponentPropsWithRef<'span'> {\n index: number\n}\n\nexport const Ellipsis = ({ children, index, className, ref, ...rest }: EllipsisProps) => {\n const { pagination } = usePagination()\n const apiProps = pagination.getEllipsisProps({ index })\n const localProps = {\n className: cx('flex size-sz-44 items-center justify-center', className),\n ...rest,\n }\n\n const mergedProps = mergeProps(apiProps, localProps)\n\n return (\n <li>\n <span data-spark-component=\"pagination-ellipsis\" ref={ref} {...mergedProps}>\n {children || '\\u2026'}\n </span>\n </li>\n )\n}\n\nEllipsis.displayName = 'Pagination.Ellipsis'\n","import { ArrowDoubleLeft } from '@spark-ui/icons/ArrowDoubleLeft'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ninterface AnchorProps extends ComponentPropsWithoutRef<'a'> {\n href: string\n}\n\ninterface ButtonProps extends ComponentPropsWithoutRef<'button'> {\n href?: undefined\n}\nexport type FirstPageTriggerProps = Omit<AnchorProps | ButtonProps, 'aria-label'> & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const FirstPageTrigger = ({\n children,\n className,\n href,\n ref,\n ...props\n}: FirstPageTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getFirstPageTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-first-page-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowDoubleLeft />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nFirstPageTrigger.displayName = 'Pagination.FirstPageTrigger'\n","import { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Button } from '../button'\nimport { usePagination } from './PaginationContext'\n\ninterface AnchorProps extends ComponentPropsWithoutRef<'a'> {\n href: string\n}\n\ninterface ButtonProps extends ComponentPropsWithoutRef<'button'> {\n href?: undefined\n}\nexport type ItemProps = Omit<AnchorProps | ButtonProps, 'aria-label'> & {\n 'aria-label': string\n value: number\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const Item = ({ children, value, className, href, ref, ...props }: ItemProps) => {\n const { pagination } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getItemProps({ type: 'page', value })\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-item',\n intent: 'support',\n design: apiProps['aria-current'] === 'page' ? 'filled' : 'contrast',\n className,\n ...props,\n }\n\n const mergedProps = mergeProps(apiProps, localProps)\n\n return (\n <li>\n {href ? (\n <Button ref={ref} {...mergedProps} asChild>\n <a href={href}>{children || value}</a>\n </Button>\n ) : (\n <Button ref={ref} {...mergedProps}>\n {children || value}\n </Button>\n )}\n </li>\n )\n}\n\nItem.displayName = 'Pagination.Item'\n","import { ArrowDoubleRight } from '@spark-ui/icons/ArrowDoubleRight'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ninterface AnchorProps extends ComponentPropsWithoutRef<'a'> {\n href: string\n}\n\ninterface ButtonProps extends ComponentPropsWithoutRef<'button'> {\n href?: undefined\n}\nexport type LastPageTriggerProps = Omit<AnchorProps | ButtonProps, 'aria-label'> & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const LastPageTrigger = ({\n children,\n className,\n href,\n ref,\n ...props\n}: LastPageTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getLastPageTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-last-page-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowDoubleRight />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nLastPageTrigger.displayName = 'Pagination.LastPageTrigger'\n","import { ArrowVerticalRight } from '@spark-ui/icons/ArrowVerticalRight'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ninterface AnchorProps extends ComponentPropsWithoutRef<'a'> {\n href: string\n}\n\ninterface ButtonProps extends ComponentPropsWithoutRef<'button'> {\n href?: undefined\n}\nexport type NextTriggerProps = Omit<AnchorProps | ButtonProps, 'aria-label'> & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const NextTrigger = ({ children, className, href, ref, ...props }: NextTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getNextTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-next-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowVerticalRight />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nNextTrigger.displayName = 'Pagination.NextTrigger'\n","import * as pagination from '@zag-js/pagination'\nimport { ReactNode } from 'react'\n\nimport { usePagination } from './PaginationContext'\n\n// Extract the 'page' type element from the pagination API's 'pages' array.\ntype PageItem = Extract<pagination.Api['pages'][number], { type: 'page' }>\n\n// Define a type that conditionally tweaks the pagination API\n// based on the generic T parameter.\ntype TweakedPaginationApi<T extends 'noEllipsis' | ''> = Omit<pagination.Api, 'pages'> & {\n pages: T extends 'noEllipsis' ? PageItem[] : pagination.Api['pages']\n}\n\ninterface PagesProps<T extends 'noEllipsis' | ''> {\n children: (pagination: TweakedPaginationApi<T>) => ReactNode\n}\n\nexport const Pages = <T extends 'noEllipsis' | '' = ''>({ children }: PagesProps<T>) => {\n const { pagination } = usePagination()\n\n return children(pagination as TweakedPaginationApi<T>)\n}\n\nPages.displayName = 'Pagination.Pages'\n","import { ArrowVerticalLeft } from '@spark-ui/icons/ArrowVerticalLeft'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ninterface AnchorProps extends ComponentPropsWithoutRef<'a'> {\n href: string\n}\n\ninterface ButtonProps extends ComponentPropsWithoutRef<'button'> {\n href?: undefined\n}\nexport type PrevTriggerProps = Omit<AnchorProps | ButtonProps, 'aria-label'> & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const PrevTrigger = ({ children, className, href, ref, ...props }: PrevTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getPrevTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-prev-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowVerticalLeft />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nPrevTrigger.displayName = 'Pagination.PrevTrigger'\n","import type { FC } from 'react'\n\nimport { Pagination as Root, type PaginationProps } from './Pagination'\nimport { Ellipsis } from './PaginationEllipsis'\nimport { FirstPageTrigger } from './PaginationFirstPageTrigger'\nimport { Item } from './PaginationItem'\nimport { LastPageTrigger } from './PaginationLastPageTrigger'\nimport { NextTrigger } from './PaginationNextTrigger'\nimport { Pages } from './PaginationPages'\nimport { PrevTrigger } from './PaginationPrevTrigger'\n\nexport const Pagination: FC<PaginationProps> & {\n PrevTrigger: typeof PrevTrigger\n NextTrigger: typeof NextTrigger\n Pages: typeof Pages\n Item: typeof Item\n Ellipsis: typeof Ellipsis\n FirstPageTrigger: typeof FirstPageTrigger\n LastPageTrigger: typeof LastPageTrigger\n} = Object.assign(Root, {\n PrevTrigger,\n NextTrigger,\n Pages,\n Item,\n Ellipsis,\n FirstPageTrigger,\n LastPageTrigger,\n})\n\nPagination.displayName = 'Pagination'\n\nPrevTrigger.displayName = 'Pagination.PrevTrigger'\nNextTrigger.displayName = 'Pagination.NextTrigger'\nPages.displayName = 'Pagination.Pages'\nItem.displayName = 'Pagination.Item'\nEllipsis.displayName = 'Pagination.Ellipsis'\nFirstPageTrigger.displayName = 'Pagination.FirstPageTrigger'\nLastPageTrigger.displayName = 'Pagination.LastPageTrigger'\n"],"names":["sliceArrayWithIndex","arr","index","length","relativeElements","start","end","PaginationContext","createContext","PaginationProvider","children","count","visiblePageItems","pageSize","page","onPageChange","noEllipsis","type","siblingCount","id","useId","service","useMachine","pagination","api","normalizeProps","pages","jsx","usePagination","context","useContext","Pagination","className","rest","PaginationWrapper","props","Ellipsis","ref","apiProps","localProps","cx","mergedProps","mergeProps","FirstPageTrigger","href","shouldDisableLink","content","Icon","ArrowDoubleLeft","IconButton","Item","value","Button","LastPageTrigger","ArrowDoubleRight","NextTrigger","ArrowVerticalRight","Pages","PrevTrigger","ArrowVerticalLeft","Root"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../src/pagination/utils.ts","../../src/pagination/PaginationContext.tsx","../../src/pagination/Pagination.tsx","../../src/pagination/PaginationEllipsis.tsx","../../src/pagination/PaginationFirstPageTrigger.tsx","../../src/pagination/PaginationItem.tsx","../../src/pagination/PaginationLastPageTrigger.tsx","../../src/pagination/PaginationNextTrigger.tsx","../../src/pagination/PaginationPages.tsx","../../src/pagination/PaginationPrevTrigger.tsx","../../src/pagination/index.ts"],"sourcesContent":["export function sliceArrayWithIndex(arr: any[], index: number, length: number) {\n const relativeElements = (length - 1) / 2\n\n let start = Math.max(0, index - relativeElements)\n let end = Math.min(arr.length, index + relativeElements + 1)\n\n if (end - start < length) {\n start = Math.max(0, Math.min(start, arr.length - length))\n end = Math.min(arr.length, start + length)\n }\n\n return arr.slice(start, end)\n}\n","import * as pagination from '@zag-js/pagination'\nimport { normalizeProps, type PropTypes, useMachine } from '@zag-js/react'\nimport { createContext, type ReactNode, useContext, useId } from 'react'\n\nimport { sliceArrayWithIndex } from './utils'\n\nexport interface PaginationContextState<T extends PropTypes = PropTypes> {\n type: pagination.Props['type']\n pagination: pagination.Api<T> & {\n getFirstPageTriggerProps: () => ReturnType<pagination.Api<T>['getPrevTriggerProps']> & {\n 'data-part': string\n onClick: () => void\n }\n getLastPageTriggerProps: () => ReturnType<pagination.Api<T>['getNextTriggerProps']> & {\n 'data-part': string\n onClick: () => void\n }\n }\n}\n\nconst PaginationContext = createContext<PaginationContextState | null>(null)\n\nexport interface PaginationProviderProps {\n children: ReactNode\n /**\n * Total number of data items available across all pages.\n */\n count: number\n /**\n * Maximum amount of items displayed on a single page.\n */\n pageSize: number\n /**\n * Number of visible pages (or ellipsis) between previous and next page triggers.\n */\n visiblePageItems?: number\n /**\n * The current page (active page)\n */\n page?: pagination.Props['page']\n /**\n * If your pagination contains buttons instead of links, set `type` to `button`, extra attributes will be applied on page items for a11y.\n */\n type?: pagination.Props['type']\n onPageChange?: pagination.Props['onPageChange']\n noEllipsis?: boolean\n}\n\nexport const PaginationProvider = ({\n children,\n count,\n visiblePageItems = 7,\n pageSize,\n page,\n onPageChange,\n noEllipsis,\n type = 'link',\n}: PaginationProviderProps) => {\n /**\n * Here `Infinity` is used because we apply a custom slice ourselves to manage the \"no ellipsis\" version.\n * It means Zag won't filter out any page item, allowing us to apply our own slicing logic.\n */\n const siblingCount = noEllipsis ? Infinity : Math.max(0, Math.floor((visiblePageItems - 5) / 2))\n\n const id = useId()\n\n const service = useMachine(pagination.machine, {\n id,\n count,\n siblingCount,\n pageSize,\n page,\n onPageChange,\n type,\n })\n\n const api = pagination.connect(service, normalizeProps)\n const pages = noEllipsis\n ? sliceArrayWithIndex(api.pages, api.page - 1, visiblePageItems)\n : api.pages\n\n return (\n <PaginationContext.Provider\n value={{\n type,\n pagination: {\n ...api,\n pages,\n // Extending ZagJS anatomy\n getFirstPageTriggerProps: () => {\n return {\n ...api.getPrevTriggerProps(),\n id: `${api.getRootProps().id}:first`,\n 'data-part': 'first-page-trigger',\n onClick: api.goToFirstPage,\n }\n },\n getLastPageTriggerProps: () => {\n return {\n ...api.getNextTriggerProps(),\n id: `${api.getRootProps().id}:last`,\n 'data-part': 'last-page-trigger',\n onClick: api.goToLastPage,\n }\n },\n },\n }}\n >\n {children}\n </PaginationContext.Provider>\n )\n}\n\nexport const usePagination = () => {\n const context = useContext(PaginationContext)\n\n if (!context) {\n throw Error('usePagination must be used within a Pagination provider')\n }\n\n return context\n}\n","import { ReactNode } from 'react'\n\nimport {\n PaginationProvider,\n type PaginationProviderProps,\n usePagination,\n} from './PaginationContext'\n\nexport type PaginationProps = PaginationProviderProps & { className?: string }\n\nexport const Pagination = ({\n children,\n visiblePageItems = 5,\n type = 'link',\n noEllipsis = false,\n className,\n ...rest\n}: PaginationProps) => {\n return (\n <PaginationProvider\n visiblePageItems={visiblePageItems}\n noEllipsis={noEllipsis}\n type={type}\n {...rest}\n >\n <PaginationWrapper className={className}>{children}</PaginationWrapper>\n </PaginationProvider>\n )\n}\n\nconst PaginationWrapper = ({\n children,\n className,\n}: {\n children: ReactNode\n className?: string\n}) => {\n const { pagination } = usePagination()\n\n const props = pagination.getRootProps()\n\n return (\n <nav data-spark-component=\"pagination\" {...props} className={className}>\n <ul className=\"gap-md flex flex-wrap\">{children}</ul>\n </nav>\n )\n}\n\nPagination.displayName = 'Pagination'\n","import { mergeProps } from '@zag-js/react'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithRef } from 'react'\n\nimport { usePagination } from './PaginationContext'\n\ninterface EllipsisProps extends ComponentPropsWithRef<'span'> {\n index: number\n}\n\nexport const Ellipsis = ({ children, index, className, ref, ...rest }: EllipsisProps) => {\n const { pagination } = usePagination()\n const apiProps = pagination.getEllipsisProps({ index })\n const localProps = {\n className: cx('flex size-sz-44 items-center justify-center', className),\n ...rest,\n }\n\n const mergedProps = mergeProps(apiProps, localProps)\n\n return (\n <li>\n <span data-spark-component=\"pagination-ellipsis\" ref={ref} {...mergedProps}>\n {children || '\\u2026'}\n </span>\n </li>\n )\n}\n\nEllipsis.displayName = 'Pagination.Ellipsis'\n","import { ArrowDoubleLeft } from '@spark-ui/icons/ArrowDoubleLeft'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ntype AnchorProps = ComponentPropsWithoutRef<'a'> & {\n href: string\n asChild?: never\n}\n\ntype ButtonProps = ComponentPropsWithoutRef<'button'> & {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n * Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.\n */\n asChild?: boolean\n href?: never\n}\n\nexport type FirstPageTriggerProps = (AnchorProps | ButtonProps) & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const FirstPageTrigger = ({\n children,\n className,\n href,\n ref,\n ...props\n}: FirstPageTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getFirstPageTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-first-page-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowDoubleLeft />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nFirstPageTrigger.displayName = 'Pagination.FirstPageTrigger'\n","import { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, ReactElement, Ref } from 'react'\n\nimport { Button } from '../button'\nimport { usePagination } from './PaginationContext'\n\ntype AnchorProps = ComponentPropsWithoutRef<'a'> & {\n href: string\n asChild?: never\n}\n\ntype ButtonProps = ComponentPropsWithoutRef<'button'> & {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n * Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.\n */\n asChild?: boolean\n href?: never\n}\n\nexport type ItemProps = (AnchorProps | ButtonProps) & {\n 'aria-label': string\n value: number\n ref?: Ref<HTMLButtonElement>\n}\n\n/**\n * A numbered page item.\n * Should be used within `Pagination.Pages` to ensure proper functionality and accessibility.\n *\n * Can be rendered as an anchor or a button :\n * - Set a `href` prop to render the item as an anchor element.\n * - When using `href`, the `asChild` prop isn’t available since the component will already be rendered as an anchor element.\n */\nexport function Item({ children, value, className, href, ref, ...props }: ItemProps): ReactElement {\n const { pagination } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getItemProps({ type: 'page', value })\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-item',\n intent: 'support',\n design: apiProps['aria-current'] === 'page' ? 'filled' : 'contrast',\n className,\n ...props,\n }\n\n const mergedProps = mergeProps(apiProps, localProps)\n\n return (\n <li>\n {href ? (\n <Button ref={ref} {...mergedProps} asChild>\n <a href={href}>{children || value}</a>\n </Button>\n ) : (\n <Button ref={ref} {...mergedProps}>\n {children || value}\n </Button>\n )}\n </li>\n )\n}\n\nItem.displayName = 'Pagination.Item'\n","import { ArrowDoubleRight } from '@spark-ui/icons/ArrowDoubleRight'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ntype AnchorProps = ComponentPropsWithoutRef<'a'> & {\n href: string\n asChild?: never\n}\n\ntype ButtonProps = ComponentPropsWithoutRef<'button'> & {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n * Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.\n */\n asChild?: boolean\n href?: never\n}\n\nexport type LastPageTriggerProps = (AnchorProps | ButtonProps) & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const LastPageTrigger = ({\n children,\n className,\n href,\n ref,\n ...props\n}: LastPageTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getLastPageTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-last-page-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowDoubleRight />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nLastPageTrigger.displayName = 'Pagination.LastPageTrigger'\n","import { ArrowVerticalRight } from '@spark-ui/icons/ArrowVerticalRight'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ntype AnchorProps = ComponentPropsWithoutRef<'a'> & {\n href: string\n asChild?: never\n}\n\ntype ButtonProps = ComponentPropsWithoutRef<'button'> & {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n * Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.\n */\n asChild?: boolean\n href?: never\n}\n\nexport type NextTriggerProps = (AnchorProps | ButtonProps) & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const NextTrigger = ({ children, className, href, ref, ...props }: NextTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getNextTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-next-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowVerticalRight />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nNextTrigger.displayName = 'Pagination.NextTrigger'\n","import * as pagination from '@zag-js/pagination'\nimport { ReactNode } from 'react'\n\nimport { usePagination } from './PaginationContext'\n\n// Extract the 'page' type element from the pagination API's 'pages' array.\ntype PageItem = Extract<pagination.Api['pages'][number], { type: 'page' }>\n\n// Define a type that conditionally tweaks the pagination API\n// based on the generic T parameter.\ntype TweakedPaginationApi<T extends 'noEllipsis' | ''> = Omit<pagination.Api, 'pages'> & {\n pages: T extends 'noEllipsis' ? PageItem[] : pagination.Api['pages']\n}\n\ninterface PagesProps<T extends 'noEllipsis' | ''> {\n children: (pagination: TweakedPaginationApi<T>) => ReactNode\n}\n\nexport const Pages = <T extends 'noEllipsis' | '' = ''>({ children }: PagesProps<T>) => {\n const { pagination } = usePagination()\n\n return children(pagination as TweakedPaginationApi<T>)\n}\n\nPages.displayName = 'Pagination.Pages'\n","import { ArrowVerticalLeft } from '@spark-ui/icons/ArrowVerticalLeft'\nimport { mergeProps } from '@zag-js/react'\nimport { ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { IconButton } from '../icon-button'\nimport { usePagination } from './PaginationContext'\n\ntype AnchorProps = ComponentPropsWithoutRef<'a'> & {\n href: string\n asChild?: never\n}\n\ntype ButtonProps = ComponentPropsWithoutRef<'button'> & {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n * Unavailable for anchor items (with `href` prop) since the component will already be rendered as an anchor element.\n */\n asChild?: boolean\n href?: never\n}\n\nexport type PrevTriggerProps = (AnchorProps | ButtonProps) & {\n 'aria-label': string\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const PrevTrigger = ({ children, className, href, ref, ...props }: PrevTriggerProps) => {\n const { pagination, type } = usePagination()\n\n // ZagJS props\n const apiProps = pagination.getPrevTriggerProps()\n\n const shouldDisableLink =\n type === 'link' &&\n (apiProps as typeof apiProps & { 'data-disabled'?: string })['data-disabled'] === ''\n\n // Locally managed props\n const localProps = {\n 'data-spark-component': 'pagination-prev-trigger',\n intent: 'support',\n design: 'contrast',\n ...props,\n className,\n ...(shouldDisableLink && {\n disabled: true,\n role: 'link',\n 'aria-disabled': true,\n }),\n }\n\n // We know 'aria-label' is included in props\n type WithAriaLabel = Omit<typeof apiProps, 'aria-label'> & { 'aria-label': string }\n\n const mergedProps = mergeProps(\n apiProps,\n localProps as unknown as typeof apiProps\n ) as WithAriaLabel\n\n const content = children || (\n <Icon>\n <ArrowVerticalLeft />\n </Icon>\n )\n\n return (\n <li>\n {href ? (\n <IconButton ref={ref} {...mergedProps} asChild>\n <a href={shouldDisableLink ? undefined : href}>{content}</a>\n </IconButton>\n ) : (\n <IconButton ref={ref} {...mergedProps}>\n {content}\n </IconButton>\n )}\n </li>\n )\n}\n\nPrevTrigger.displayName = 'Pagination.PrevTrigger'\n","import type { FC } from 'react'\n\nimport { Pagination as Root, type PaginationProps } from './Pagination'\nimport { Ellipsis } from './PaginationEllipsis'\nimport { FirstPageTrigger } from './PaginationFirstPageTrigger'\nimport { Item } from './PaginationItem'\nimport { LastPageTrigger } from './PaginationLastPageTrigger'\nimport { NextTrigger } from './PaginationNextTrigger'\nimport { Pages } from './PaginationPages'\nimport { PrevTrigger } from './PaginationPrevTrigger'\n\nexport const Pagination: FC<PaginationProps> & {\n PrevTrigger: typeof PrevTrigger\n NextTrigger: typeof NextTrigger\n Pages: typeof Pages\n Item: typeof Item\n Ellipsis: typeof Ellipsis\n FirstPageTrigger: typeof FirstPageTrigger\n LastPageTrigger: typeof LastPageTrigger\n} = Object.assign(Root, {\n PrevTrigger,\n NextTrigger,\n Pages,\n Item,\n Ellipsis,\n FirstPageTrigger,\n LastPageTrigger,\n})\n\nPagination.displayName = 'Pagination'\n\nPrevTrigger.displayName = 'Pagination.PrevTrigger'\nNextTrigger.displayName = 'Pagination.NextTrigger'\nPages.displayName = 'Pagination.Pages'\nItem.displayName = 'Pagination.Item'\nEllipsis.displayName = 'Pagination.Ellipsis'\nFirstPageTrigger.displayName = 'Pagination.FirstPageTrigger'\nLastPageTrigger.displayName = 'Pagination.LastPageTrigger'\n"],"names":["sliceArrayWithIndex","arr","index","length","relativeElements","start","end","PaginationContext","createContext","PaginationProvider","children","count","visiblePageItems","pageSize","page","onPageChange","noEllipsis","type","siblingCount","id","useId","service","useMachine","pagination","api","normalizeProps","pages","jsx","usePagination","context","useContext","Pagination","className","rest","PaginationWrapper","props","Ellipsis","ref","apiProps","localProps","cx","mergedProps","mergeProps","FirstPageTrigger","href","shouldDisableLink","content","Icon","ArrowDoubleLeft","IconButton","Item","value","Button","LastPageTrigger","ArrowDoubleRight","NextTrigger","ArrowVerticalRight","Pages","PrevTrigger","ArrowVerticalLeft","Root"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spark-ui/components",
|
|
3
|
-
"version": "16.0
|
|
3
|
+
"version": "16.1.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "Spark (Leboncoin design system) components.",
|
|
6
6
|
"exports": {
|
|
@@ -54,14 +54,15 @@
|
|
|
54
54
|
"@react-aria/toast": "^3.0.0-beta.18",
|
|
55
55
|
"@react-stately/numberfield": "3.9.11",
|
|
56
56
|
"@react-stately/toast": "^3.0.0-beta.7",
|
|
57
|
-
"@spark-ui/hooks": "^16.0
|
|
58
|
-
"@spark-ui/icons": "^16.0
|
|
59
|
-
"@spark-ui/internal-utils": "^16.0
|
|
57
|
+
"@spark-ui/hooks": "^16.1.0",
|
|
58
|
+
"@spark-ui/icons": "^16.1.0",
|
|
59
|
+
"@spark-ui/internal-utils": "^16.1.0",
|
|
60
60
|
"@zag-js/pagination": "1.30.0",
|
|
61
61
|
"@zag-js/react": "1.30.0",
|
|
62
62
|
"class-variance-authority": "0.7.1",
|
|
63
63
|
"downshift": "9.0.10",
|
|
64
64
|
"emulate-tab": "^1.2.1",
|
|
65
|
+
"motion": "^12.34.3",
|
|
65
66
|
"radix-ui": "1.4.3",
|
|
66
67
|
"react-snap-carousel": "^0.5.1"
|
|
67
68
|
},
|