@spark-ui/components 13.1.3 → 13.1.4

package/dist/pagination/index.js

@@ -1,2 +1,1353 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react/jsx-runtime"),P=require("react"),K=require("react-dom"),be=require("../index-DnaHaH_0.js"),Te=require("@spark-ui/icons/ArrowDoubleLeft"),B=require("../Icon-Bf0XrmiR.js"),A=require("../IconButton-Bf-EDzpI.js"),ie=require("../Button-C3xHNaGl.js"),Se=require("@spark-ui/icons/ArrowDoubleRight"),je=require("@spark-ui/icons/ArrowVerticalRight"),Re=require("@spark-ui/icons/ArrowVerticalLeft");var z=(e,t=[])=>({parts:(...n)=>{if(Ne(t))return z(e,n);throw new Error("createAnatomy().parts(...) should only be called once. Did you mean to use .extendWith(...) ?")},extendWith:(...n)=>z(e,[...t,...n]),omit:(...n)=>z(e,t.filter(o=>!n.includes(o))),rename:n=>z(n,t),keys:()=>t,build:()=>[...new Set(t)].reduce((n,o)=>Object.assign(n,{[o]:{selector:[`&[data-scope="${w(e)}"][data-part="${w(o)}"]`,`& [data-scope="${w(e)}"][data-part="${w(o)}"]`].join(", "),attrs:{"data-scope":w(e),"data-part":w(o)}}}),{})}),w=e=>e.replace(/([A-Z])([A-Z])/g,"$1-$2").replace(/([a-z])([A-Z])/g,"$1-$2").replace(/[\s_]+/g,"-").toLowerCase(),Ne=e=>e.length===0,de=e=>typeof e=="object"&&e!==null,W=e=>e?"":void 0,Ae=9,Ie=e=>de(e)&&e.nodeType===Ae,ke=e=>de(e)&&e===e.window;function we(e){if(!e)return!1;const t=e.getRootNode();return pe(t)===e}function Ce(e){return Ie(e)?e:ke(e)?e.document:e?.ownerDocument??document}function pe(e){let t=e.activeElement;for(;t?.shadowRoot;){const n=t.shadowRoot.activeElement;if(!n||n===t)break;t=n}return t}function Le(e){return e==null?[]:Array.isArray(e)?e:[e]}var se=e=>e?.constructor.name==="Array",_e=(e,t)=>{if(e.length!==t.length)return!1;for(let n=0;n<e.length;n++)if(!X(e[n],t[n]))return!1;return!0},X=(e,t)=>{if(Object.is(e,t))return!0;if(e==null&&t!=null||e!=null&&t==null)return!1;if(typeof e?.isEqual=="function"&&typeof t?.isEqual=="function")return e.isEqual(t);if(typeof e=="function"&&typeof t=="function")return e.toString()===t.toString();if(se(e)&&se(t))return _e(Array.from(e),Array.from(t));if(typeof e!="object"||typeof t!="object")return!1;const n=Object.keys(t??Object.create(null)),o=n.length;for(let r=0;r<o;r++)if(!Reflect.has(e,n[r]))return!1;for(let r=0;r<o;r++){const a=n[r];if(!X(e[a],t[a]))return!1}return!0},Oe=e=>e!=null&&typeof e=="object",D=e=>typeof e=="string",M=e=>typeof e=="function",$e=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),ze=e=>Object.prototype.toString.call(e),fe=Function.prototype.toString,Me=fe.call(Object),Ve=e=>{if(!Oe(e)||ze(e)!="[object Object]"||De(e))return!1;const t=Object.getPrototypeOf(e);if(t===null)return!0;const n=$e(t,"constructor")&&t.constructor;return typeof n=="function"&&n instanceof n&&fe.call(n)==Me},qe=e=>typeof e=="object"&&e!==null&&"$$typeof"in e&&"props"in e,Ge=e=>typeof e=="object"&&e!==null&&"__v_isVNode"in e,De=e=>qe(e)||Ge(e),Fe=e=>e(),Be=(...e)=>(...t)=>{e.forEach(function(n){n?.(...t)})};function Pe(e){if(!Ve(e)||e===void 0)return e;const t=Reflect.ownKeys(e).filter(o=>typeof o=="string"),n={};for(const o of t){const r=e[o];r!==void 0&&(n[o]=Pe(r))}return n}function ce(...e){const t=e.length===1?e[0]:e[1];(e.length===2?e[0]:!0)&&process.env.NODE_ENV!=="production"&&console.warn(t)}function We(e,t){if(e==null)throw new Error(t())}var Ue=(...e)=>e.map(t=>t?.trim?.()).filter(Boolean).join(" "),Ze=/((?:--)?(?:\w+-?)+)\s*:\s*([^;]*)/g,ge=e=>{const t={};let n;for(;n=Ze.exec(e);)t[n[1]]=n[2];return t},Ke=(e,t)=>{if(D(e)){if(D(t))return`${e};${t}`;e=ge(e)}else D(t)&&(t=ge(t));return Object.assign({},e??{},t??{})};function L(...e){let t={};for(let n of e){if(!n)continue;for(let r in t){if(r.startsWith("on")&&typeof t[r]=="function"&&typeof n[r]=="function"){t[r]=Be(n[r],t[r]);continue}if(r==="className"||r==="class"){t[r]=Ue(t[r],n[r]);continue}if(r==="style"){t[r]=Ke(t[r],n[r]);continue}t[r]=n[r]!==void 0?n[r]:t[r]}for(let r in n)t[r]===void 0&&(t[r]=n[r]);const o=Object.getOwnPropertySymbols(n);for(let r of o)t[r]=n[r]}return t}function ue(e,t,n){let o=[],r;return a=>{const g=e(a);return(g.length!==o.length||g.some((u,p)=>!X(o[p],u)))&&(o=g,r=t(g,a)),r}}var C=(e=>(e.NotStarted="Not Started",e.Started="Started",e.Stopped="Stopped",e))(C||{}),U="__init__";function Xe(e){const t=()=>e.getRootNode?.()??document,n=()=>Ce(t());return{...e,getRootNode:t,getDoc:n,getWin:()=>n().defaultView??window,getActiveElement:()=>pe(t()),isActiveElement:we,getById:g=>t().getElementById(g)}}function Je(e){return new Proxy({},{get(t,n){return n==="style"?o=>e({style:o}).style:e}})}var J=()=>e=>Array.from(new Set(e)),He=z("pagination").parts("root","item","ellipsis","prevTrigger","nextTrigger"),$=He.build(),Qe=e=>e.ids?.root??`pagination:${e.id}`,Ye=e=>e.ids?.prevTrigger??`pagination:${e.id}:prev`,et=e=>e.ids?.nextTrigger??`pagination:${e.id}:next`,tt=(e,t)=>e.ids?.ellipsis?.(t)??`pagination:${e.id}:ellipsis:${t}`,nt=(e,t)=>e.ids?.item?.(t)??`pagination:${e.id}:item:${t}`,q=(e,t)=>{let n=t-e+1;return Array.from({length:n},(o,r)=>r+e)},rt=e=>e.map(t=>typeof t=="number"?{type:"page",value:t}:{type:"ellipsis"}),G="ellipsis",ot=e=>{const{page:t,totalPages:n,siblingCount:o}=e,r=Math.min(2*o+5,n),a=1,g=n,c=Math.max(t-o,a),u=Math.min(t+o,g),p=c>a+1,f=u<g-1,s=r-2;if(!p&&f)return[...q(1,s),G,g];if(p&&!f){const y=q(g-s+1,g);return[a,G,...y]}if(p&&f){const y=q(c,u);return[a,G,...y,G,g]}return q(a,g)},at=e=>rt(ot(e));function it(e,t){const{send:n,scope:o,prop:r,computed:a,context:g}=e,c=a("totalPages"),u=g.get("page"),p=g.get("pageSize"),f=r("translations"),s=r("count"),m=r("getPageUrl"),y=r("type"),k=a("previousPage"),R=a("nextPage"),E=a("pageRange"),j=u===1,_=u===c,V=at({page:u,totalPages:c,siblingCount:r("siblingCount")});return{count:s,page:u,pageSize:p,totalPages:c,pages:V,previousPage:k,nextPage:R,pageRange:E,slice(b){return b.slice(E.start,E.end)},setPageSize(b){n({type:"SET_PAGE_SIZE",size:b})},setPage(b){n({type:"SET_PAGE",page:b})},goToNextPage(){n({type:"NEXT_PAGE"})},goToPrevPage(){n({type:"PREVIOUS_PAGE"})},goToFirstPage(){n({type:"FIRST_PAGE"})},goToLastPage(){n({type:"LAST_PAGE"})},getRootProps(){return t.element({id:Qe(o),...$.root.attrs,dir:r("dir"),"aria-label":f.rootLabel})},getEllipsisProps(b){return t.element({id:tt(o,b.index),...$.ellipsis.attrs,dir:r("dir")})},getItemProps(b){const S=b.value,x=S===u;return t.element({id:nt(o,S),...$.item.attrs,dir:r("dir"),"data-index":S,"data-selected":W(x),"aria-current":x?"page":void 0,"aria-label":f.itemLabel?.({page:S,totalPages:c}),onClick(){n({type:"SET_PAGE",page:S})},...y==="button"&&{type:"button"},...y==="link"&&m&&{href:m({page:S,pageSize:p})}})},getPrevTriggerProps(){return t.element({id:Ye(o),...$.prevTrigger.attrs,dir:r("dir"),"data-disabled":W(j),"aria-label":f.prevTriggerLabel,onClick(){n({type:"PREVIOUS_PAGE"})},...y==="button"&&{disabled:j,type:"button"},...y==="link"&&m&&k&&{href:m({page:k,pageSize:p})}})},getNextTriggerProps(){return t.element({id:et(o),...$.nextTrigger.attrs,dir:r("dir"),"data-disabled":W(_),"aria-label":f.nextTriggerLabel,onClick(){n({type:"NEXT_PAGE"})},...y==="button"&&{disabled:_,type:"button"},...y==="link"&&m&&R&&{href:m({page:R,pageSize:p})}})}}}var st={props({props:e}){return{defaultPageSize:10,siblingCount:1,defaultPage:1,type:"button",count:1,...e,translations:{rootLabel:"pagination",prevTriggerLabel:"previous page",nextTriggerLabel:"next page",itemLabel({page:t,totalPages:n}){return`${n>1&&t===n?"last page, ":""}page ${t}`},...e.translations}}},initialState(){return"idle"},context({prop:e,bindable:t,getContext:n}){return{page:t(()=>({value:e("page"),defaultValue:e("defaultPage"),onChange(o){const r=n();e("onPageChange")?.({page:o,pageSize:r.get("pageSize")})}})),pageSize:t(()=>({value:e("pageSize"),defaultValue:e("defaultPageSize"),onChange(o){e("onPageSizeChange")?.({pageSize:o})}}))}},watch({track:e,context:t,action:n}){e([()=>t.get("pageSize")],()=>{n(["setPageIfNeeded"])})},computed:{totalPages:ue(({prop:e,context:t})=>[t.get("pageSize"),e("count")],([e,t])=>Math.ceil(t/e)),pageRange:ue(({context:e,prop:t})=>[e.get("page"),e.get("pageSize"),t("count")],([e,t,n])=>{const o=(e-1)*t;return{start:o,end:Math.min(o+t,n)}}),previousPage:({context:e})=>e.get("page")===1?null:e.get("page")-1,nextPage:({context:e,computed:t})=>e.get("page")===t("totalPages")?null:e.get("page")+1,isValidPage:({context:e,computed:t})=>e.get("page")>=1&&e.get("page")<=t("totalPages")},on:{SET_PAGE:{guard:"isValidPage",actions:["setPage"]},SET_PAGE_SIZE:{actions:["setPageSize"]},FIRST_PAGE:{actions:["goToFirstPage"]},LAST_PAGE:{actions:["goToLastPage"]},PREVIOUS_PAGE:{guard:"canGoToPrevPage",actions:["goToPrevPage"]},NEXT_PAGE:{guard:"canGoToNextPage",actions:["goToNextPage"]}},states:{idle:{}},implementations:{guards:{isValidPage:({event:e,computed:t})=>e.page>=1&&e.page<=t("totalPages"),isValidCount:({context:e,event:t})=>e.get("page")>t.count,canGoToNextPage:({context:e,computed:t})=>e.get("page")<t("totalPages"),canGoToPrevPage:({context:e})=>e.get("page")>1},actions:{setPage({context:e,event:t,computed:n}){const o=Z(t.page,n("totalPages"));e.set("page",o)},setPageSize({context:e,event:t}){e.set("pageSize",t.size)},goToFirstPage({context:e}){e.set("page",1)},goToLastPage({context:e,computed:t}){e.set("page",t("totalPages"))},goToPrevPage({context:e,computed:t}){e.set("page",n=>Z(n-1,t("totalPages")))},goToNextPage({context:e,computed:t}){e.set("page",n=>Z(n+1,t("totalPages")))},setPageIfNeeded({context:e,computed:t}){t("isValidPage")||e.set("page",1)}}}},Z=(e,t)=>Math.min(Math.max(e,1),t);J()(["count","dir","getRootNode","id","ids","onPageChange","onPageSizeChange","page","defaultPage","pageSize","defaultPageSize","siblingCount","translations","type","getPageUrl"]);J()(["value","type"]);J()(["index"]);var me=typeof globalThis.document<"u"?P.useLayoutEffect:P.useEffect;function F(e){const t=e().value??e().defaultValue,n=e().isEqual??Object.is,[o]=P.useState(t),[r,a]=P.useState(o),g=e().value!==void 0,c=P.useRef(r);c.current=g?e().value:r;const u=P.useRef(c.current);me(()=>{u.current=c.current},[r,e().value]);const p=s=>{const m=u.current,y=M(s)?s(m):s;e().debug&&console.log(`[bindable > ${e().debug}] setValue`,{next:y,prev:m}),g||a(y),n(y,m)||e().onChange?.(y,m)};function f(){return g?e().value:r}return{initial:o,ref:c,get:f,set(s){(e().sync?K.flushSync:Fe)(()=>p(s))},invoke(s,m){e().onChange?.(s,m)},hash(s){return e().hash?.(s)??String(s)}}}F.cleanup=e=>{P.useEffect(()=>e,[])};F.ref=e=>{const t=P.useRef(e);return{get:()=>t.current,set:n=>{t.current=n}}};function ct(e){const t=P.useRef(e);return{get(n){return t.current[n]},set(n,o){t.current[n]=o}}}var gt=(e,t)=>{const n=P.useRef(!1),o=P.useRef(!1);P.useEffect(()=>{if(n.current&&o.current)return t();o.current=!0},[...(e??[]).map(r=>typeof r=="function"?r():r)]),P.useEffect(()=>(n.current=!0,()=>{n.current=!1}),[])};function ut(e,t={}){const n=P.useMemo(()=>{const{id:i,ids:l,getRootNode:v}=t;return Xe({id:i,ids:l,getRootNode:v})},[t]),o=(...i)=>{e.debug&&console.log(...i)},r=e.props?.({props:Pe(t),scope:n})??t,a=lt(r),g=e.context?.({prop:a,bindable:F,scope:n,flush:le,getContext(){return u},getComputed(){return S},getRefs(){return R},getEvent(){return y()}}),c=ye(g),u={get(i){return c.current?.[i].ref.current},set(i,l){c.current?.[i].set(l)},initial(i){return c.current?.[i].initial},hash(i){const l=c.current?.[i].get();return c.current?.[i].hash(l)}},p=P.useRef(new Map),f=P.useRef(null),s=P.useRef(null),m=P.useRef({type:""}),y=()=>({...m.current,current(){return m.current},previous(){return s.current}}),k=()=>({...x,matches(...i){return i.includes(x.ref.current)},hasTag(i){return!!e.states[x.ref.current]?.tags?.includes(i)}}),R=ct(e.refs?.({prop:a,context:u})??{}),E=()=>({state:k(),context:u,event:y(),prop:a,send:ae,action:j,guard:_,track:gt,refs:R,computed:S,flush:le,scope:n,choose:b}),j=i=>{const l=M(i)?i(E()):i;if(!l)return;const v=l.map(h=>{const T=e.implementations?.actions?.[h];return T||ce(`[zag-js] No implementation found for action "${JSON.stringify(h)}"`),T});for(const h of v)h?.(E())},_=i=>M(i)?i(E()):e.implementations?.guards?.[i](E()),V=i=>{const l=M(i)?i(E()):i;if(!l)return;const v=l.map(T=>{const N=e.implementations?.effects?.[T];return N||ce(`[zag-js] No implementation found for effect "${JSON.stringify(T)}"`),N}),h=[];for(const T of v){const N=T?.(E());N&&h.push(N)}return()=>h.forEach(T=>T?.())},b=i=>Le(i).find(l=>{let v=!l.guard;return D(l.guard)?v=!!_(l.guard):M(l.guard)&&(v=l.guard(E())),v}),S=i=>{We(e.computed,()=>"[zag-js] No computed object found on machine");const l=e.computed[i];return l({context:u,event:y(),prop:a,refs:R,scope:n,computed:S})},x=F(()=>({defaultValue:e.initialState({prop:a}),onChange(i,l){l&&(p.current.get(l)?.(),p.current.delete(l)),l&&j(e.states[l]?.exit),j(f.current?.actions);const v=V(e.states[i]?.effects);if(v&&p.current.set(i,v),l===U){j(e.entry);const h=V(e.effects);h&&p.current.set(U,h)}j(e.states[i]?.entry)}})),oe=P.useRef(void 0),O=P.useRef(C.NotStarted);me(()=>{queueMicrotask(()=>{const v=O.current===C.Started;O.current=C.Started,o(v?"rehydrating...":"initializing...");const h=oe.current??x.initial;x.invoke(h,v?x.get():U)});const i=p.current,l=x.ref.current;return()=>{o("unmounting..."),oe.current=l,O.current=C.Stopped,i.forEach(v=>v?.()),p.current=new Map,f.current=null,queueMicrotask(()=>{j(e.exit)})}},[]);const Ee=()=>"ref"in x?x.ref.current:x.get(),ae=i=>{queueMicrotask(()=>{if(O.current!==C.Started)return;s.current=m.current,m.current=i;let l=Ee();const v=e.states[l].on?.[i.type]??e.on?.[i.type],h=b(v);if(!h)return;f.current=h;const T=h.target??l;o("transition",i.type,h.target||l,`(${h.actions})`);const N=T!==l;N?K.flushSync(()=>x.set(T)):h.reenter&&!N?x.invoke(l,l):j(h.actions??[])})};return e.watch?.(E()),{state:k(),send:ae,context:u,prop:a,scope:n,refs:R,computed:S,event:y(),getStatus:()=>O.current}}function ye(e){const t=P.useRef(e);return t.current=e,t}function lt(e){const t=ye(e);return function(o){return t.current[o]}}function le(e){queueMicrotask(()=>{K.flushSync(()=>e())})}var dt=Je(e=>e);function pt(e,t,n){const o=(n-1)/2;let r=Math.max(0,t-o),a=Math.min(e.length,t+o+1);return a-r<n&&(r=Math.max(0,Math.min(r,e.length-n)),a=Math.min(e.length,r+n)),e.slice(r,a)}const he=P.createContext(null),ft=({children:e,count:t,visiblePageItems:n=7,pageSize:o,page:r,onPageChange:a,noEllipsis:g,type:c="link"})=>{const u=g?1/0:Math.max(0,Math.floor((n-5)/2)),p=P.useId(),f=ut(st,{id:p,count:t,siblingCount:u,pageSize:o,page:r,onPageChange:a,type:c}),s=it(f,dt),m=g?pt(s.pages,s.page-1,n):s.pages;return d.jsx(he.Provider,{value:{type:c,pagination:{...s,pages:m,getFirstPageTriggerProps:()=>({...s.getPrevTriggerProps(),id:`${s.getRootProps().id}:first`,"data-part":"first-page-trigger",onClick:s.goToFirstPage}),getLastPageTriggerProps:()=>({...s.getNextTriggerProps(),id:`${s.getRootProps().id}:last`,"data-part":"last-page-trigger",onClick:s.goToLastPage})}},children:e})},I=()=>{const e=P.useContext(he);if(!e)throw Error("usePagination must be used within a Pagination provider");return e},ve=({children:e,visiblePageItems:t=5,type:n="link",noEllipsis:o=!1,className:r,...a})=>d.jsx(ft,{visiblePageItems:t,noEllipsis:o,type:n,...a,children:d.jsx(Pt,{className:r,children:e})}),Pt=({children:e,className:t})=>{const{pagination:n}=I(),o=n.getRootProps();return d.jsx("nav",{"data-spark-component":"pagination",...o,className:t,children:d.jsx("ul",{className:"gap-md flex flex-wrap",children:e})})};ve.displayName="Pagination";const H=({children:e,index:t,className:n,ref:o,...r})=>{const{pagination:a}=I(),g=a.getEllipsisProps({index:t}),c={className:be.cx("flex size-sz-44 items-center justify-center",n),...r},u=L(g,c);return d.jsx("li",{children:d.jsx("span",{"data-spark-component":"pagination-ellipsis",ref:o,...u,children:e||"…"})})};H.displayName="Pagination.Ellipsis";const Q=({children:e,className:t,href:n,ref:o,...r})=>{const{pagination:a,type:g}=I(),c=a.getFirstPageTriggerProps(),u=g==="link"&&c["data-disabled"]==="",p={"data-spark-component":"pagination-first-page-trigger",intent:"support",design:"contrast",...r,className:t,...u&&{disabled:!0,role:"link","aria-disabled":!0}},f=L(c,p),s=e||d.jsx(B.Icon,{children:d.jsx(Te.ArrowDoubleLeft,{})});return d.jsx("li",{children:n?d.jsx(A.IconButton,{ref:o,...f,asChild:!0,children:d.jsx("a",{href:u?void 0:n,children:s})}):d.jsx(A.IconButton,{ref:o,...f,children:s})})};Q.displayName="Pagination.FirstPageTrigger";const Y=({children:e,value:t,className:n,href:o,ref:r,...a})=>{const{pagination:g}=I(),c=g.getItemProps({type:"page",value:t}),u={"data-spark-component":"pagination-item",intent:"support",design:c["aria-current"]==="page"?"filled":"contrast",className:n,...a},p=L(c,u);return d.jsx("li",{children:o?d.jsx(ie.Button,{ref:r,...p,asChild:!0,children:d.jsx("a",{href:o,children:e||t})}):d.jsx(ie.Button,{ref:r,...p,children:e||t})})};Y.displayName="Pagination.Item";const ee=({children:e,className:t,href:n,ref:o,...r})=>{const{pagination:a,type:g}=I(),c=a.getLastPageTriggerProps(),u=g==="link"&&c["data-disabled"]==="",p={"data-spark-component":"pagination-last-page-trigger",intent:"support",design:"contrast",...r,className:t,...u&&{disabled:!0,role:"link","aria-disabled":!0}},f=L(c,p),s=e||d.jsx(B.Icon,{children:d.jsx(Se.ArrowDoubleRight,{})});return d.jsx("li",{children:n?d.jsx(A.IconButton,{ref:o,...f,asChild:!0,children:d.jsx("a",{href:u?void 0:n,children:s})}):d.jsx(A.IconButton,{ref:o,...f,children:s})})};ee.displayName="Pagination.LastPageTrigger";const te=({children:e,className:t,href:n,ref:o,...r})=>{const{pagination:a,type:g}=I(),c=a.getNextTriggerProps(),u=g==="link"&&c["data-disabled"]==="",p={"data-spark-component":"pagination-next-trigger",intent:"support",design:"contrast",...r,className:t,...u&&{disabled:!0,role:"link","aria-disabled":!0}},f=L(c,p),s=e||d.jsx(B.Icon,{children:d.jsx(je.ArrowVerticalRight,{})});return d.jsx("li",{children:n?d.jsx(A.IconButton,{ref:o,...f,asChild:!0,children:d.jsx("a",{href:u?void 0:n,children:s})}):d.jsx(A.IconButton,{ref:o,...f,children:s})})};te.displayName="Pagination.NextTrigger";const ne=({children:e})=>{const{pagination:t}=I();return e(t)};ne.displayName="Pagination.Pages";const re=({children:e,className:t,href:n,ref:o,...r})=>{const{pagination:a,type:g}=I(),c=a.getPrevTriggerProps(),u=g==="link"&&c["data-disabled"]==="",p={"data-spark-component":"pagination-prev-trigger",intent:"support",design:"contrast",...r,className:t,...u&&{disabled:!0,role:"link","aria-disabled":!0}},f=L(c,p),s=e||d.jsx(B.Icon,{children:d.jsx(Re.ArrowVerticalLeft,{})});return d.jsx("li",{children:n?d.jsx(A.IconButton,{ref:o,...f,asChild:!0,children:d.jsx("a",{href:u?void 0:n,children:s})}):d.jsx(A.IconButton,{ref:o,...f,children:s})})};re.displayName="Pagination.PrevTrigger";const xe=Object.assign(ve,{PrevTrigger:re,NextTrigger:te,Pages:ne,Item:Y,Ellipsis:H,FirstPageTrigger:Q,LastPageTrigger:ee});xe.displayName="Pagination";re.displayName="Pagination.PrevTrigger";te.displayName="Pagination.NextTrigger";ne.displayName="Pagination.Pages";Y.displayName="Pagination.Item";H.displayName="Pagination.Ellipsis";Q.displayName="Pagination.FirstPageTrigger";ee.displayName="Pagination.LastPageTrigger";exports.Pagination=xe;
-//# sourceMappingURL=index.js.map
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/pagination/index.ts
+var pagination_exports = {};
+__export(pagination_exports, {
+  Pagination: () => Pagination2
+});
+module.exports = __toCommonJS(pagination_exports);
+
+// src/pagination/PaginationContext.tsx
+var pagination = __toESM(require("@zag-js/pagination"));
+var import_react = require("@zag-js/react");
+var import_react2 = require("react");
+
+// src/pagination/utils.ts
+function sliceArrayWithIndex(arr, index, length) {
+  const relativeElements = (length - 1) / 2;
+  let start = Math.max(0, index - relativeElements);
+  let end = Math.min(arr.length, index + relativeElements + 1);
+  if (end - start < length) {
+    start = Math.max(0, Math.min(start, arr.length - length));
+    end = Math.min(arr.length, start + length);
+  }
+  return arr.slice(start, end);
+}
+
+// src/pagination/PaginationContext.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var PaginationContext = (0, import_react2.createContext)(null);
+var PaginationProvider = ({
+  children,
+  count,
+  visiblePageItems = 7,
+  pageSize,
+  page,
+  onPageChange,
+  noEllipsis,
+  type = "link"
+}) => {
+  const siblingCount = noEllipsis ? Infinity : Math.max(0, Math.floor((visiblePageItems - 5) / 2));
+  const id = (0, import_react2.useId)();
+  const service = (0, import_react.useMachine)(pagination.machine, {
+    id,
+    count,
+    siblingCount,
+    pageSize,
+    page,
+    onPageChange,
+    type
+  });
+  const api = pagination.connect(service, import_react.normalizeProps);
+  const pages = noEllipsis ? sliceArrayWithIndex(api.pages, api.page - 1, visiblePageItems) : api.pages;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    PaginationContext.Provider,
+    {
+      value: {
+        type,
+        pagination: {
+          ...api,
+          pages,
+          // Extending ZagJS anatomy
+          getFirstPageTriggerProps: () => {
+            return {
+              ...api.getPrevTriggerProps(),
+              id: `${api.getRootProps().id}:first`,
+              "data-part": "first-page-trigger",
+              onClick: api.goToFirstPage
+            };
+          },
+          getLastPageTriggerProps: () => {
+            return {
+              ...api.getNextTriggerProps(),
+              id: `${api.getRootProps().id}:last`,
+              "data-part": "last-page-trigger",
+              onClick: api.goToLastPage
+            };
+          }
+        }
+      },
+      children
+    }
+  );
+};
+var usePagination = () => {
+  const context = (0, import_react2.useContext)(PaginationContext);
+  if (!context) {
+    throw Error("usePagination must be used within a Pagination provider");
+  }
+  return context;
+};
+
+// src/pagination/Pagination.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var Pagination = ({
+  children,
+  visiblePageItems = 5,
+  type = "link",
+  noEllipsis = false,
+  className,
+  ...rest
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    PaginationProvider,
+    {
+      visiblePageItems,
+      noEllipsis,
+      type,
+      ...rest,
+      children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(PaginationWrapper, { className, children })
+    }
+  );
+};
+var PaginationWrapper = ({
+  children,
+  className
+}) => {
+  const { pagination: pagination2 } = usePagination();
+  const props = pagination2.getRootProps();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("nav", { "data-spark-component": "pagination", ...props, className, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("ul", { className: "gap-md flex flex-wrap", children }) });
+};
+Pagination.displayName = "Pagination";
+
+// src/pagination/PaginationEllipsis.tsx
+var import_react3 = require("@zag-js/react");
+var import_class_variance_authority = require("class-variance-authority");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var Ellipsis = ({ children, index, className, ref, ...rest }) => {
+  const { pagination: pagination2 } = usePagination();
+  const apiProps = pagination2.getEllipsisProps({ index });
+  const localProps = {
+    className: (0, import_class_variance_authority.cx)("flex size-sz-44 items-center justify-center", className),
+    ...rest
+  };
+  const mergedProps = (0, import_react3.mergeProps)(apiProps, localProps);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { "data-spark-component": "pagination-ellipsis", ref, ...mergedProps, children: children || "\u2026" }) });
+};
+Ellipsis.displayName = "Pagination.Ellipsis";
+
+// src/pagination/PaginationFirstPageTrigger.tsx
+var import_ArrowDoubleLeft = require("@spark-ui/icons/ArrowDoubleLeft");
+var import_react7 = require("@zag-js/react");
+
+// src/icon/Icon.tsx
+var import_react5 = require("react");
+
+// src/slot/Slot.tsx
+var import_radix_ui = require("radix-ui");
+var import_react4 = require("react");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var Slottable = import_radix_ui.Slot.Slottable;
+var Slot = ({ ref, ...props }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_radix_ui.Slot.Root, { ref, ...props });
+};
+var wrapPolymorphicSlot = (asChild, children, callback) => {
+  if (!asChild) return callback(children);
+  return (0, import_react4.isValidElement)(children) ? (0, import_react4.cloneElement)(
+    children,
+    void 0,
+    callback(children.props.children)
+  ) : null;
+};
+
+// src/visually-hidden/VisuallyHidden.tsx
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var VisuallyHidden = ({ asChild = false, ref, ...props }) => {
+  const Component = asChild ? Slot : "span";
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    Component,
+    {
+      ...props,
+      ref,
+      style: {
+        // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss
+        position: "absolute",
+        border: 0,
+        width: 1,
+        height: 1,
+        padding: 0,
+        margin: -1,
+        overflow: "hidden",
+        clip: "rect(0, 0, 0, 0)",
+        whiteSpace: "nowrap",
+        wordWrap: "normal",
+        ...props.style
+      }
+    }
+  );
+};
+VisuallyHidden.displayName = "VisuallyHidden";
+
+// src/icon/Icon.styles.tsx
+var import_internal_utils = require("@spark-ui/internal-utils");
+var import_class_variance_authority2 = require("class-variance-authority");
+var iconStyles = (0, import_class_variance_authority2.cva)(["fill-current shrink-0"], {
+  variants: {
+    /**
+     * Color scheme of the icon.
+     */
+    intent: (0, import_internal_utils.makeVariants)({
+      current: ["text-current"],
+      main: ["text-main"],
+      support: ["text-support"],
+      accent: ["text-accent"],
+      basic: ["text-basic"],
+      success: ["text-success"],
+      alert: ["text-alert"],
+      error: ["text-error"],
+      info: ["text-info"],
+      neutral: ["text-neutral"]
+    }),
+    /**
+     * Sets the size of the icon.
+     */
+    size: (0, import_internal_utils.makeVariants)({
+      current: ["u-current-font-size"],
+      sm: ["w-sz-16", "h-sz-16"],
+      md: ["w-sz-24", "h-sz-24"],
+      lg: ["w-sz-32", "h-sz-32"],
+      xl: ["w-sz-40", "h-sz-40"]
+    })
+  }
+});
+
+// src/icon/Icon.tsx
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var Icon = ({
+  label,
+  className,
+  size = "current",
+  intent = "current",
+  children,
+  ...others
+}) => {
+  const child = import_react5.Children.only(children);
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+    (0, import_react5.cloneElement)(child, {
+      className: iconStyles({ className, size, intent }),
+      "data-spark-component": "icon",
+      "aria-hidden": "true",
+      focusable: "false",
+      ...others
+    }),
+    label && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(VisuallyHidden, { children: label })
+  ] });
+};
+Icon.displayName = "Icon";
+
+// src/button/Button.tsx
+var import_class_variance_authority5 = require("class-variance-authority");
+var import_react6 = require("react");
+
+// src/spinner/Spinner.styles.tsx
+var import_internal_utils2 = require("@spark-ui/internal-utils");
+var import_class_variance_authority3 = require("class-variance-authority");
+var defaultVariants = {
+  intent: "current",
+  size: "current",
+  isBackgroundVisible: false
+};
+var spinnerStyles = (0, import_class_variance_authority3.cva)(
+  ["inline-block", "border-solid", "rounded-full", "border-md", "animate-spin"],
+  {
+    variants: {
+      /**
+       * Use `size` prop to set the size of the spinner. If you want to set the full size for the spinner, don't forget to add a wrapping container with its own size.
+       */
+      size: {
+        current: ["u-current-font-size"],
+        sm: ["w-sz-20", "h-sz-20"],
+        md: ["w-sz-28", "h-sz-28"],
+        full: ["w-full", "h-full"]
+      },
+      /**
+       * Color scheme of the spinner.
+       */
+      intent: (0, import_internal_utils2.makeVariants)({
+        current: ["border-current"],
+        main: ["border-main"],
+        support: ["border-support"],
+        accent: ["border-accent"],
+        basic: ["border-basic"],
+        success: ["border-success"],
+        alert: ["border-alert"],
+        error: ["border-error"],
+        info: ["border-info"],
+        neutral: ["border-neutral"]
+      }),
+      /**
+       * Size of the button.
+       */
+      isBackgroundVisible: {
+        true: ["border-b-neutral-container", "border-l-neutral-container"],
+        false: ["border-b-transparent", "border-l-transparent"]
+      }
+    },
+    defaultVariants
+  }
+);
+
+// src/spinner/Spinner.tsx
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var Spinner = ({
+  className,
+  size = "current",
+  intent = "current",
+  label,
+  isBackgroundVisible,
+  ref,
+  ...others
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    "span",
+    {
+      role: "status",
+      "data-spark-component": "spinner",
+      ref,
+      className: spinnerStyles({ className, size, intent, isBackgroundVisible }),
+      ...others,
+      children: label && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(VisuallyHidden, { children: label })
+    }
+  );
+};
+
+// src/button/Button.styles.tsx
+var import_internal_utils8 = require("@spark-ui/internal-utils");
+var import_class_variance_authority4 = require("class-variance-authority");
+
+// src/button/variants/filled.ts
+var import_internal_utils3 = require("@spark-ui/internal-utils");
+var filledVariants = [
+  // Main
+  {
+    intent: "main",
+    design: "filled",
+    class: (0, import_internal_utils3.tw)([
+      "bg-main",
+      "text-on-main",
+      "hover:bg-main-hovered",
+      "enabled:active:bg-main-hovered",
+      "focus-visible:bg-main-hovered"
+    ])
+  },
+  // Support
+  {
+    intent: "support",
+    design: "filled",
+    class: (0, import_internal_utils3.tw)([
+      "bg-support",
+      "text-on-support",
+      "hover:bg-support-hovered",
+      "enabled:active:bg-support-hovered",
+      "focus-visible:bg-support-hovered"
+    ])
+  },
+  // Accent
+  {
+    intent: "accent",
+    design: "filled",
+    class: (0, import_internal_utils3.tw)([
+      "bg-accent",
+      "text-on-accent",
+      "hover:bg-accent-hovered",
+      "enabled:active:bg-accent-hovered",
+      "focus-visible:bg-accent-hovered"
+    ])
+  },
+  // Basic
+  {
+    intent: "basic",
+    design: "filled",
+    class: (0, import_internal_utils3.tw)([
+      "bg-basic",
+      "text-on-basic",
+      "hover:bg-basic-hovered",
+      "enabled:active:bg-basic-hovered",
+      "focus-visible:bg-basic-hovered"
+    ])
+  },
+  // Success
+  {
+    intent: "success",
+    design: "filled",
+    class: (0, import_internal_utils3.tw)([
+      "bg-success",
+      "text-on-success",
+      "hover:bg-success-hovered",
+      "enabled:active:bg-success-hovered",
+      "focus-visible:bg-success-hovered"
+    ])
+  },
+  // Alert
+  {
+    intent: "alert",
+    design: "filled",
+    class: (0, import_internal_utils3.tw)([
+      "bg-alert",
+      "text-on-alert",
+      "hover:bg-alert-hovered",
+      "enabled:active:bg-alert-hovered",
+      "focus-visible:bg-alert-hovered"
+    ])
+  },
+  // Danger
+  {
+    intent: "danger",
+    design: "filled",
+    class: (0, import_internal_utils3.tw)([
+      "text-on-error bg-error",
+      "hover:bg-error-hovered enabled:active:bg-error-hovered",
+      "focus-visible:bg-error-hovered"
+    ])
+  },
+  // Info
+  {
+    intent: "info",
+    design: "filled",
+    class: (0, import_internal_utils3.tw)([
+      "text-on-error bg-info",
+      "hover:bg-info-hovered enabled:active:bg-info-hovered",
+      "focus-visible:bg-info-hovered"
+    ])
+  },
+  // Neutral
+  {
+    intent: "neutral",
+    design: "filled",
+    class: (0, import_internal_utils3.tw)([
+      "bg-neutral",
+      "text-on-neutral",
+      "hover:bg-neutral-hovered",
+      "enabled:active:bg-neutral-hovered",
+      "focus-visible:bg-neutral-hovered"
+    ])
+  },
+  // Surface
+  {
+    intent: "surface",
+    design: "filled",
+    class: (0, import_internal_utils3.tw)([
+      "bg-surface",
+      "text-on-surface",
+      "hover:bg-surface-hovered",
+      "enabled:active:bg-surface-hovered",
+      "focus-visible:bg-surface-hovered"
+    ])
+  },
+  {
+    intent: "surfaceInverse",
+    design: "filled",
+    class: (0, import_internal_utils3.tw)([
+      "bg-surface-inverse",
+      "text-on-surface-inverse",
+      "hover:bg-surface-inverse-hovered",
+      "enabled:active:bg-surface-inverse-hovered",
+      "focus-visible:bg-surface-inverse-hovered"
+    ])
+  }
+];
+
+// src/button/variants/ghost.ts
+var import_internal_utils4 = require("@spark-ui/internal-utils");
+var ghostVariants = [
+  {
+    intent: "main",
+    design: "ghost",
+    class: (0, import_internal_utils4.tw)([
+      "text-on-main-container",
+      "hover:bg-main/dim-5",
+      "enabled:active:bg-main/dim-5",
+      "focus-visible:bg-main/dim-5"
+    ])
+  },
+  {
+    intent: "support",
+    design: "ghost",
+    class: (0, import_internal_utils4.tw)([
+      "text-on-support-container",
+      "hover:bg-support/dim-5",
+      "enabled:active:bg-support/dim-5",
+      "focus-visible:bg-support/dim-5"
+    ])
+  },
+  {
+    intent: "accent",
+    design: "ghost",
+    class: (0, import_internal_utils4.tw)([
+      "text-on-accent-container",
+      "hover:bg-accent/dim-5",
+      "enabled:active:bg-accent/dim-5",
+      "focus-visible:bg-accent/dim-5"
+    ])
+  },
+  {
+    intent: "basic",
+    design: "ghost",
+    class: (0, import_internal_utils4.tw)([
+      "text-on-basic-container",
+      "hover:bg-basic/dim-5",
+      "enabled:active:bg-basic/dim-5",
+      "focus-visible:bg-basic/dim-5"
+    ])
+  },
+  {
+    intent: "success",
+    design: "ghost",
+    class: (0, import_internal_utils4.tw)([
+      "text-on-success-container",
+      "hover:bg-success/dim-5",
+      "enabled:active:bg-success/dim-5",
+      "focus-visible:bg-success/dim-5"
+    ])
+  },
+  {
+    intent: "alert",
+    design: "ghost",
+    class: (0, import_internal_utils4.tw)([
+      "text-on-alert-container",
+      "hover:bg-alert/dim-5",
+      "enabled:active:bg-alert/dim-5",
+      "focus-visible:bg-alert/dim-5"
+    ])
+  },
+  {
+    intent: "danger",
+    design: "ghost",
+    class: (0, import_internal_utils4.tw)([
+      "text-on-error-container",
+      "hover:bg-error/dim-5",
+      "enabled:active:bg-error/dim-5",
+      "focus-visible:bg-error/dim-5"
+    ])
+  },
+  {
+    intent: "info",
+    design: "ghost",
+    class: (0, import_internal_utils4.tw)([
+      "text-on-info-container",
+      "hover:bg-info/dim-5",
+      "enabled:active:bg-info/dim-5",
+      "focus-visible:bg-info/dim-5"
+    ])
+  },
+  {
+    intent: "neutral",
+    design: "ghost",
+    class: (0, import_internal_utils4.tw)([
+      "text-on-neutral-container",
+      "hover:bg-neutral/dim-5",
+      "enabled:active:bg-neutral/dim-5",
+      "focus-visible:bg-neutral/dim-5"
+    ])
+  },
+  {
+    intent: "surface",
+    design: "ghost",
+    class: (0, import_internal_utils4.tw)([
+      "text-surface",
+      "hover:bg-surface/dim-5",
+      "enabled:active:bg-surface/dim-5",
+      "focus-visible:bg-surface/dim-5"
+    ])
+  },
+  {
+    intent: "surfaceInverse",
+    design: "ghost",
+    class: (0, import_internal_utils4.tw)([
+      "text-surface-inverse",
+      "hover:bg-surface-inverse/dim-5",
+      "enabled:active:bg-surface-inverse/dim-5",
+      "focus-visible:bg-surface-inverse/dim-5"
+    ])
+  }
+];
+
+// src/button/variants/outlined.ts
+var import_internal_utils5 = require("@spark-ui/internal-utils");
+var outlinedVariants = [
+  {
+    intent: "main",
+    design: "outlined",
+    class: (0, import_internal_utils5.tw)([
+      "hover:bg-main/dim-5",
+      "enabled:active:bg-main/dim-5",
+      "focus-visible:bg-main/dim-5",
+      "text-main"
+    ])
+  },
+  {
+    intent: "support",
+    design: "outlined",
+    class: (0, import_internal_utils5.tw)([
+      "hover:bg-support/dim-5",
+      "enabled:active:bg-support/dim-5",
+      "focus-visible:bg-support/dim-5",
+      "text-support"
+    ])
+  },
+  {
+    intent: "accent",
+    design: "outlined",
+    class: (0, import_internal_utils5.tw)([
+      "hover:bg-accent/dim-5",
+      "enabled:active:bg-accent/dim-5",
+      "focus-visible:bg-accent/dim-5",
+      "text-accent"
+    ])
+  },
+  {
+    intent: "basic",
+    design: "outlined",
+    class: (0, import_internal_utils5.tw)([
+      "hover:bg-basic/dim-5",
+      "enabled:active:bg-basic/dim-5",
+      "focus-visible:bg-basic/dim-5",
+      "text-basic"
+    ])
+  },
+  {
+    intent: "success",
+    design: "outlined",
+    class: (0, import_internal_utils5.tw)([
+      "hover:bg-success/dim-5",
+      "enabled:active:bg-success/dim-5",
+      "focus-visible:bg-success/dim-5",
+      "text-success"
+    ])
+  },
+  {
+    intent: "alert",
+    design: "outlined",
+    class: (0, import_internal_utils5.tw)([
+      "hover:bg-alert/dim-5",
+      "enabled:active:bg-alert/dim-5",
+      "focus-visible:bg-alert/dim-5",
+      "text-alert"
+    ])
+  },
+  {
+    intent: "danger",
+    design: "outlined",
+    class: (0, import_internal_utils5.tw)([
+      "hover:bg-error/dim-5",
+      "enabled:active:bg-error/dim-5",
+      "focus-visible:bg-error/dim-5",
+      "text-error"
+    ])
+  },
+  {
+    intent: "info",
+    design: "outlined",
+    class: (0, import_internal_utils5.tw)([
+      "hover:bg-info/dim-5",
+      "enabled:active:bg-info/dim-5",
+      "focus-visible:bg-info/dim-5",
+      "text-info"
+    ])
+  },
+  {
+    intent: "neutral",
+    design: "outlined",
+    class: (0, import_internal_utils5.tw)([
+      "hover:bg-neutral/dim-5",
+      "enabled:active:bg-neutral/dim-5",
+      "focus-visible:bg-neutral/dim-5",
+      "text-neutral"
+    ])
+  },
+  {
+    intent: "surface",
+    design: "outlined",
+    class: (0, import_internal_utils5.tw)([
+      "hover:bg-surface/dim-5",
+      "enabled:active:bg-surface/dim-5",
+      "focus-visible:bg-surface/dim-5",
+      "text-surface"
+    ])
+  },
+  {
+    intent: "surfaceInverse",
+    design: "outlined",
+    class: (0, import_internal_utils5.tw)([
+      "hover:bg-surface-inverse/dim-5",
+      "enabled:active:bg-surface-inverse/dim-5",
+      "focus-visible:bg-surface-inverse/dim-5",
+      "text-surface-inverse"
+    ])
+  }
+];
+
+// src/button/variants/tinted.ts
+var import_internal_utils6 = require("@spark-ui/internal-utils");
+var tintedVariants = [
+  {
+    intent: "main",
+    design: "tinted",
+    class: (0, import_internal_utils6.tw)([
+      "bg-main-container",
+      "text-on-main-container",
+      "hover:bg-main-container-hovered",
+      "enabled:active:bg-main-container-hovered",
+      "focus-visible:bg-main-container-hovered"
+    ])
+  },
+  {
+    intent: "support",
+    design: "tinted",
+    class: (0, import_internal_utils6.tw)([
+      "bg-support-container",
+      "text-on-support-container",
+      "hover:bg-support-container-hovered",
+      "enabled:active:bg-support-container-hovered",
+      "focus-visible:bg-support-container-hovered"
+    ])
+  },
+  {
+    intent: "accent",
+    design: "tinted",
+    class: (0, import_internal_utils6.tw)([
+      "bg-accent-container",
+      "text-on-accent-container",
+      "hover:bg-accent-container-hovered",
+      "enabled:active:bg-accent-container-hovered",
+      "focus-visible:bg-accent-container-hovered"
+    ])
+  },
+  {
+    intent: "basic",
+    design: "tinted",
+    class: (0, import_internal_utils6.tw)([
+      "bg-basic-container",
+      "text-on-basic-container",
+      "hover:bg-basic-container-hovered",
+      "enabled:active:bg-basic-container-hovered",
+      "focus-visible:bg-basic-container-hovered"
+    ])
+  },
+  {
+    intent: "success",
+    design: "tinted",
+    class: (0, import_internal_utils6.tw)([
+      "bg-success-container",
+      "text-on-success-container",
+      "hover:bg-success-container-hovered",
+      "enabled:active:bg-success-container-hovered",
+      "focus-visible:bg-success-container-hovered"
+    ])
+  },
+  {
+    intent: "alert",
+    design: "tinted",
+    class: (0, import_internal_utils6.tw)([
+      "bg-alert-container",
+      "text-on-alert-container",
+      "hover:bg-alert-container-hovered",
+      "enabled:active:bg-alert-container-hovered",
+      "focus-visible:bg-alert-container-hovered"
+    ])
+  },
+  {
+    intent: "danger",
+    design: "tinted",
+    class: (0, import_internal_utils6.tw)([
+      "bg-error-container",
+      "text-on-error-container",
+      "hover:bg-error-container-hovered",
+      "enabled:active:bg-error-container-hovered",
+      "focus-visible:bg-error-container-hovered"
+    ])
+  },
+  {
+    intent: "info",
+    design: "tinted",
+    class: (0, import_internal_utils6.tw)([
+      "bg-info-container",
+      "text-on-info-container",
+      "hover:bg-info-container-hovered",
+      "enabled:active:bg-info-container-hovered",
+      "focus-visible:bg-info-container-hovered"
+    ])
+  },
+  {
+    intent: "neutral",
+    design: "tinted",
+    class: (0, import_internal_utils6.tw)([
+      "bg-neutral-container",
+      "text-on-neutral-container",
+      "hover:bg-neutral-container-hovered",
+      "enabled:active:bg-neutral-container-hovered",
+      "focus-visible:bg-neutral-container-hovered"
+    ])
+  },
+  {
+    intent: "surface",
+    design: "tinted",
+    class: (0, import_internal_utils6.tw)([
+      "bg-surface",
+      "text-on-surface",
+      "hover:bg-surface-hovered",
+      "enabled:active:bg-surface-hovered",
+      "focus-visible:bg-surface-hovered"
+    ])
+  },
+  {
+    intent: "surfaceInverse",
+    design: "tinted",
+    class: (0, import_internal_utils6.tw)([
+      "bg-surface-inverse",
+      "text-on-surface-inverse",
+      "hover:bg-surface-inverse-hovered",
+      "enabled:active:bg-surface-inverse-hovered",
+      "focus-visible:bg-surface-inverse-hovered"
+    ])
+  }
+];
+
+// src/button/variants/contrast.ts
+var import_internal_utils7 = require("@spark-ui/internal-utils");
+var contrastVariants = [
+  {
+    intent: "main",
+    design: "contrast",
+    class: (0, import_internal_utils7.tw)([
+      "text-on-main-contaier bg-surface",
+      "hover:bg-main-container-hovered",
+      "enabled:active:bg-main-container-hovered",
+      "focus-visible:bg-main-container-hovered"
+    ])
+  },
+  {
+    intent: "support",
+    design: "contrast",
+    class: (0, import_internal_utils7.tw)([
+      "text-on-support-container bg-surface",
+      "hover:bg-support-container-hovered",
+      "enabled:active:bg-support-container-hovered",
+      "focus-visible:bg-support-container-hovered"
+    ])
+  },
+  {
+    intent: "accent",
+    design: "contrast",
+    class: (0, import_internal_utils7.tw)([
+      "text-on-accent-container bg-surface",
+      "hover:bg-accent-container-hovered",
+      "enabled:active:bg-accent-container-hovered",
+      "focus-visible:bg-accent-container-hovered"
+    ])
+  },
+  {
+    intent: "basic",
+    design: "contrast",
+    class: (0, import_internal_utils7.tw)([
+      "text-on-basic-container bg-surface",
+      "hover:bg-basic-container-hovered",
+      "enabled:active:bg-basic-container-hovered",
+      "focus-visible:bg-basic-container-hovered"
+    ])
+  },
+  {
+    intent: "success",
+    design: "contrast",
+    class: (0, import_internal_utils7.tw)([
+      "text-on-success-container bg-surface",
+      "hover:bg-success-container-hovered",
+      "enabled:active:bg-success-container-hovered",
+      "focus-visible:bg-success-container-hovered"
+    ])
+  },
+  {
+    intent: "alert",
+    design: "contrast",
+    class: (0, import_internal_utils7.tw)([
+      "text-on-alert-container bg-surface",
+      "hover:bg-alert-container-hovered",
+      "enabled:active:bg-alert-container-hovered",
+      "focus-visible:bg-alert-container-hovered"
+    ])
+  },
+  {
+    intent: "danger",
+    design: "contrast",
+    class: (0, import_internal_utils7.tw)([
+      "text-on-error-container bg-surface",
+      "hover:bg-error-container-hovered",
+      "enabled:active:bg-error-container-hovered",
+      "focus-visible:bg-error-container-hovered"
+    ])
+  },
+  {
+    intent: "info",
+    design: "contrast",
+    class: (0, import_internal_utils7.tw)([
+      "text-on-info-container bg-surface",
+      "hover:bg-info-container-hovered",
+      "enabled:active:bg-info-container-hovered",
+      "focus-visible:bg-info-container-hovered"
+    ])
+  },
+  {
+    intent: "neutral",
+    design: "contrast",
+    class: (0, import_internal_utils7.tw)([
+      "text-on-neutral-container bg-surface",
+      "hover:bg-neutral-container-hovered",
+      "enabled:active:bg-neutral-container-hovered",
+      "focus-visible:bg-neutral-container-hovered"
+    ])
+  },
+  {
+    intent: "surface",
+    design: "contrast",
+    class: (0, import_internal_utils7.tw)([
+      "text-on-surface bg-surface",
+      "hover:bg-surface-hovered",
+      "enabled:active:bg-surface-hovered",
+      "focus-visible:bg-surface-hovered"
+    ])
+  },
+  {
+    intent: "surfaceInverse",
+    design: "contrast",
+    class: (0, import_internal_utils7.tw)([
+      "text-on-surface-inverse bg-surface-inverse",
+      "hover:bg-surface-inverse-hovered",
+      "enabled:active:bg-surface-inverse-hovered",
+      "focus-visible:bg-surface-inverse-hovered"
+    ])
+  }
+];
+
+// src/button/Button.styles.tsx
+var buttonStyles = (0, import_class_variance_authority4.cva)(
+  [
+    "u-shadow-border-transition",
+    "box-border inline-flex items-center justify-center gap-md whitespace-nowrap",
+    "default:px-lg",
+    "text-body-1 font-bold",
+    "focus-visible:u-outline"
+  ],
+  {
+    variants: {
+      /**
+       * Main style of the button.
+       *
+       * - `filled`: Button will be plain.
+       *
+       * - `outlined`: Button will be transparent with an outline.
+       *
+       * - `tinted`: Button will be filled but using a lighter color scheme.
+       *
+       * - `ghost`: Button will look like a link. No borders, plain text.
+       *
+       * - `contrast`: Button will be surface filled. No borders, plain text.
+       *
+       */
+      design: (0, import_internal_utils8.makeVariants)({
+        filled: [],
+        outlined: ["bg-transparent", "border-sm", "border-current"],
+        tinted: [],
+        ghost: ["default:-mx-md px-md hover:bg-main/dim-5"],
+        contrast: []
+      }),
+      underline: {
+        true: ["underline"]
+      },
+      /**
+       * Color scheme of the button.
+       */
+      intent: (0, import_internal_utils8.makeVariants)({
+        main: [],
+        support: [],
+        accent: [],
+        basic: [],
+        success: [],
+        alert: [],
+        danger: [],
+        info: [],
+        neutral: [],
+        surface: [],
+        surfaceInverse: []
+      }),
+      /**
+       * Size of the button.
+       */
+      size: (0, import_internal_utils8.makeVariants)({
+        sm: ["min-w-sz-32", "h-sz-32"],
+        md: ["min-w-sz-44", "h-sz-44"],
+        lg: ["min-w-sz-56", "h-sz-56"]
+      }),
+      /**
+       * Shape of the button.
+       */
+      shape: (0, import_internal_utils8.makeVariants)({
+        rounded: ["rounded-lg"],
+        square: ["rounded-0"],
+        pill: ["rounded-full"]
+      }),
+      /**
+       * Disable the button, preventing user interaction and adding opacity.
+       */
+      disabled: {
+        true: ["cursor-not-allowed", "opacity-dim-3"],
+        false: ["cursor-pointer"]
+      }
+    },
+    compoundVariants: [
+      ...filledVariants,
+      ...outlinedVariants,
+      ...tintedVariants,
+      ...ghostVariants,
+      ...contrastVariants
+    ],
+    defaultVariants: {
+      design: "filled",
+      intent: "main",
+      size: "md",
+      shape: "rounded"
+    }
+  }
+);
+
+// src/button/Button.tsx
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var blockedEventHandlers = [
+  "onClick",
+  "onMouseDown",
+  "onMouseUp",
+  "onMouseEnter",
+  "onMouseLeave",
+  "onMouseOver",
+  "onMouseOut",
+  "onKeyDown",
+  "onKeyPress",
+  "onKeyUp",
+  "onSubmit"
+];
+var Button = ({
+  children,
+  design = "filled",
+  disabled = false,
+  intent = "main",
+  isLoading = false,
+  loadingLabel,
+  loadingText,
+  shape = "rounded",
+  size = "md",
+  asChild,
+  className,
+  underline = false,
+  ref,
+  ...others
+}) => {
+  const Component = asChild ? Slot : "button";
+  const shouldNotInteract = !!disabled || isLoading;
+  const disabledEventHandlers = (0, import_react6.useMemo)(() => {
+    const result = {};
+    if (shouldNotInteract) {
+      blockedEventHandlers.forEach((eventHandler) => result[eventHandler] = void 0);
+    }
+    return result;
+  }, [shouldNotInteract]);
+  const spinnerProps = {
+    size: "current",
+    className: loadingText ? "inline-block" : "absolute",
+    ...loadingLabel && { "aria-label": loadingLabel }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    Component,
+    {
+      "data-spark-component": "button",
+      ...Component === "button" && { type: "button" },
+      ref,
+      className: buttonStyles({
+        className,
+        design,
+        disabled: shouldNotInteract,
+        intent,
+        shape,
+        size,
+        underline
+      }),
+      disabled: !!disabled,
+      "aria-busy": isLoading,
+      "aria-live": isLoading ? "assertive" : "off",
+      ...others,
+      ...disabledEventHandlers,
+      children: wrapPolymorphicSlot(
+        asChild,
+        children,
+        (slotted) => isLoading ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Spinner, { ...spinnerProps }),
+          loadingText && loadingText,
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+            "div",
+            {
+              "aria-hidden": true,
+              className: (0, import_class_variance_authority5.cx)("gap-md", loadingText ? "hidden" : "inline-flex opacity-0"),
+              children: slotted
+            }
+          )
+        ] }) : slotted
+      )
+    }
+  );
+};
+Button.displayName = "Button";
+
+// src/icon-button/IconButton.styles.tsx
+var import_internal_utils9 = require("@spark-ui/internal-utils");
+var import_class_variance_authority6 = require("class-variance-authority");
+var iconButtonStyles = (0, import_class_variance_authority6.cva)(["pl-0 pr-0"], {
+  variants: {
+    /**
+     * Sets the size of the icon.
+     */
+    size: (0, import_internal_utils9.makeVariants)({
+      sm: ["text-body-1"],
+      md: ["text-body-1"],
+      lg: ["text-display-3"]
+    })
+  }
+});
+
+// src/icon-button/IconButton.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var IconButton = ({
+  design = "filled",
+  disabled = false,
+  intent = "main",
+  shape = "rounded",
+  size = "md",
+  className,
+  ref,
+  ...others
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    Button,
+    {
+      "data-spark-component": "icon-button",
+      ref,
+      className: iconButtonStyles({ size, className }),
+      design,
+      disabled,
+      intent,
+      shape,
+      size,
+      ...others
+    }
+  );
+};
+IconButton.displayName = "IconButton";
+
+// src/pagination/PaginationFirstPageTrigger.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var FirstPageTrigger = ({
+  children,
+  className,
+  href,
+  ref,
+  ...props
+}) => {
+  const { pagination: pagination2, type } = usePagination();
+  const apiProps = pagination2.getFirstPageTriggerProps();
+  const shouldDisableLink = type === "link" && apiProps["data-disabled"] === "";
+  const localProps = {
+    "data-spark-component": "pagination-first-page-trigger",
+    intent: "support",
+    design: "contrast",
+    ...props,
+    className,
+    ...shouldDisableLink && {
+      disabled: true,
+      role: "link",
+      "aria-disabled": true
+    }
+  };
+  const mergedProps = (0, import_react7.mergeProps)(
+    apiProps,
+    localProps
+  );
+  const content = children || /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Icon, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_ArrowDoubleLeft.ArrowDoubleLeft, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("li", { children: href ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(IconButton, { ref, ...mergedProps, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("a", { href: shouldDisableLink ? void 0 : href, children: content }) }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(IconButton, { ref, ...mergedProps, children: content }) });
+};
+FirstPageTrigger.displayName = "Pagination.FirstPageTrigger";
+
+// src/pagination/PaginationItem.tsx
+var import_react8 = require("@zag-js/react");
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var Item = ({ children, value, className, href, ref, ...props }) => {
+  const { pagination: pagination2 } = usePagination();
+  const apiProps = pagination2.getItemProps({ type: "page", value });
+  const localProps = {
+    "data-spark-component": "pagination-item",
+    intent: "support",
+    design: apiProps["aria-current"] === "page" ? "filled" : "contrast",
+    className,
+    ...props
+  };
+  const mergedProps = (0, import_react8.mergeProps)(apiProps, localProps);
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("li", { children: href ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Button, { ref, ...mergedProps, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("a", { href, children: children || value }) }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Button, { ref, ...mergedProps, children: children || value }) });
+};
+Item.displayName = "Pagination.Item";
+
+// src/pagination/PaginationLastPageTrigger.tsx
+var import_ArrowDoubleRight = require("@spark-ui/icons/ArrowDoubleRight");
+var import_react9 = require("@zag-js/react");
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var LastPageTrigger = ({
+  children,
+  className,
+  href,
+  ref,
+  ...props
+}) => {
+  const { pagination: pagination2, type } = usePagination();
+  const apiProps = pagination2.getLastPageTriggerProps();
+  const shouldDisableLink = type === "link" && apiProps["data-disabled"] === "";
+  const localProps = {
+    "data-spark-component": "pagination-last-page-trigger",
+    intent: "support",
+    design: "contrast",
+    ...props,
+    className,
+    ...shouldDisableLink && {
+      disabled: true,
+      role: "link",
+      "aria-disabled": true
+    }
+  };
+  const mergedProps = (0, import_react9.mergeProps)(
+    apiProps,
+    localProps
+  );
+  const content = children || /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Icon, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_ArrowDoubleRight.ArrowDoubleRight, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("li", { children: href ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconButton, { ref, ...mergedProps, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("a", { href: shouldDisableLink ? void 0 : href, children: content }) }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconButton, { ref, ...mergedProps, children: content }) });
+};
+LastPageTrigger.displayName = "Pagination.LastPageTrigger";
+
+// src/pagination/PaginationNextTrigger.tsx
+var import_ArrowVerticalRight = require("@spark-ui/icons/ArrowVerticalRight");
+var import_react10 = require("@zag-js/react");
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var NextTrigger = ({ children, className, href, ref, ...props }) => {
+  const { pagination: pagination2, type } = usePagination();
+  const apiProps = pagination2.getNextTriggerProps();
+  const shouldDisableLink = type === "link" && apiProps["data-disabled"] === "";
+  const localProps = {
+    "data-spark-component": "pagination-next-trigger",
+    intent: "support",
+    design: "contrast",
+    ...props,
+    className,
+    ...shouldDisableLink && {
+      disabled: true,
+      role: "link",
+      "aria-disabled": true
+    }
+  };
+  const mergedProps = (0, import_react10.mergeProps)(
+    apiProps,
+    localProps
+  );
+  const content = children || /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Icon, { children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_ArrowVerticalRight.ArrowVerticalRight, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("li", { children: href ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconButton, { ref, ...mergedProps, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("a", { href: shouldDisableLink ? void 0 : href, children: content }) }) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconButton, { ref, ...mergedProps, children: content }) });
+};
+NextTrigger.displayName = "Pagination.NextTrigger";
+
+// src/pagination/PaginationPages.tsx
+var Pages = ({ children }) => {
+  const { pagination: pagination2 } = usePagination();
+  return children(pagination2);
+};
+Pages.displayName = "Pagination.Pages";
+
+// src/pagination/PaginationPrevTrigger.tsx
+var import_ArrowVerticalLeft = require("@spark-ui/icons/ArrowVerticalLeft");
+var import_react11 = require("@zag-js/react");
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var PrevTrigger = ({ children, className, href, ref, ...props }) => {
+  const { pagination: pagination2, type } = usePagination();
+  const apiProps = pagination2.getPrevTriggerProps();
+  const shouldDisableLink = type === "link" && apiProps["data-disabled"] === "";
+  const localProps = {
+    "data-spark-component": "pagination-prev-trigger",
+    intent: "support",
+    design: "contrast",
+    ...props,
+    className,
+    ...shouldDisableLink && {
+      disabled: true,
+      role: "link",
+      "aria-disabled": true
+    }
+  };
+  const mergedProps = (0, import_react11.mergeProps)(
+    apiProps,
+    localProps
+  );
+  const content = children || /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Icon, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_ArrowVerticalLeft.ArrowVerticalLeft, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("li", { children: href ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(IconButton, { ref, ...mergedProps, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("a", { href: shouldDisableLink ? void 0 : href, children: content }) }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(IconButton, { ref, ...mergedProps, children: content }) });
+};
+PrevTrigger.displayName = "Pagination.PrevTrigger";
+
+// src/pagination/index.ts
+var Pagination2 = Object.assign(Pagination, {
+  PrevTrigger,
+  NextTrigger,
+  Pages,
+  Item,
+  Ellipsis,
+  FirstPageTrigger,
+  LastPageTrigger
+});
+Pagination2.displayName = "Pagination";
+PrevTrigger.displayName = "Pagination.PrevTrigger";
+NextTrigger.displayName = "Pagination.NextTrigger";
+Pages.displayName = "Pagination.Pages";
+Item.displayName = "Pagination.Item";
+Ellipsis.displayName = "Pagination.Ellipsis";
+FirstPageTrigger.displayName = "Pagination.FirstPageTrigger";
+LastPageTrigger.displayName = "Pagination.LastPageTrigger";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Pagination
+});
+//# sourceMappingURL=index.js.map