@spark-ui/components 17.14.0 → 17.14.2
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/avatar/index.js +1 -1
- package/dist/avatar/index.mjs +1 -1
- package/dist/button/index.js +1 -1
- package/dist/button/index.mjs +1 -1
- package/dist/{button-CNabSkd_.mjs → button-D49vse7F.mjs} +6 -2
- package/dist/{button-CNabSkd_.mjs.map → button-D49vse7F.mjs.map} +1 -1
- package/dist/{button-Tv2N8_24.js → button-pz6WB_vb.js} +2 -2
- package/dist/{button-Tv2N8_24.js.map → button-pz6WB_vb.js.map} +1 -1
- package/dist/carousel/index.js +1 -1
- package/dist/carousel/index.mjs +1 -1
- package/dist/combobox/index.js +1 -1
- package/dist/combobox/index.mjs +2 -2
- package/dist/dialog/index.js +1 -1
- package/dist/dialog/index.mjs +1 -1
- package/dist/drawer/index.js +1 -1
- package/dist/drawer/index.mjs +1 -1
- package/dist/dropdown/index.js +1 -1
- package/dist/dropdown/index.mjs +1 -1
- package/dist/file-upload/index.js +1 -1
- package/dist/file-upload/index.mjs +2 -2
- package/dist/icon-button/index.js +1 -1
- package/dist/icon-button/index.mjs +1 -1
- package/dist/{icon-button-CTe0v0g7.js → icon-button-BKVPOP0K.js} +2 -2
- package/dist/{icon-button-CTe0v0g7.js.map → icon-button-BKVPOP0K.js.map} +1 -1
- package/dist/{icon-button-DVbKK2_a.mjs → icon-button-Bw0k4nKs.mjs} +2 -2
- package/dist/{icon-button-DVbKK2_a.mjs.map → icon-button-Bw0k4nKs.mjs.map} +1 -1
- package/dist/pagination/index.js +1 -1
- package/dist/pagination/index.mjs +2 -2
- package/dist/popover/index.js +1 -1
- package/dist/popover/index.mjs +1 -1
- package/dist/{popover-83FABwMs.mjs → popover-B11eXklt.mjs} +2 -2
- package/dist/{popover-83FABwMs.mjs.map → popover-B11eXklt.mjs.map} +1 -1
- package/dist/{popover-Daknmg_Z.js → popover-CWZCAwhW.js} +2 -2
- package/dist/{popover-Daknmg_Z.js.map → popover-CWZCAwhW.js.map} +1 -1
- package/dist/scrolling-list/index.js +1 -1
- package/dist/scrolling-list/index.mjs +2 -2
- package/dist/stepper/index.js +1 -1
- package/dist/stepper/index.mjs +1 -1
- package/dist/table/index.js +1 -1
- package/dist/table/index.mjs +1 -1
- package/dist/tabs/index.js +1 -1
- package/dist/tabs/index.mjs +3 -3
- package/dist/toast/index.js +1 -1
- package/dist/toast/index.js.map +1 -1
- package/dist/toast/index.mjs +4 -4
- package/dist/toast/index.mjs.map +1 -1
- package/package.json +5 -5
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../slot/index.js`),t=require(`../icon-CRPcdgYp.js`),n=require(`../button-
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../slot/index.js`),t=require(`../icon-CRPcdgYp.js`),n=require(`../button-pz6WB_vb.js`),r=require(`../icon-button-BKVPOP0K.js`);let i=require(`class-variance-authority`),a=require(`react`),o=require(`react/jsx-runtime`),s=require(`@spark-ui/hooks/use-scroll-overflow`),c=require(`@spark-ui/icons/ArrowVerticalRight`),l=require(`@spark-ui/icons/ArrowVerticalLeft`),u=require(`react-snap-carousel`);var d=(0,a.createContext)(null),f=({snapType:e=`none`,snapStop:t=`normal`,scrollBehavior:n=`smooth`,loop:r=!1,gap:c=16,withFade:l=!1,scrollPadding:f=0,children:p,className:m,...h})=>{let g=(0,a.useRef)(null),_=(0,a.useRef)(null),v=(0,u.useSnapCarousel)(),{overflow:y,refresh:b}=(0,s.useScrollOverflow)(g,{precisionTreshold:1}),{activePageIndex:x,pages:S,refresh:C}=v,w=S[x],T=w?[w[0]+1,w[w.length-1]+1]:[0,0],E=(0,a.useCallback)(()=>{C&&g.current&&setTimeout(()=>{C()},0)},[C]);(0,a.useEffect)(()=>{E()},[p,E]),(0,a.useLayoutEffect)(()=>{g.current&&requestAnimationFrame(()=>{b()})},[p,b]);let D=()=>{_.current?.focus()};return(0,o.jsxs)(d,{value:{...v,snapType:e,snapStop:t,skipKeyboardNavigation:D,scrollBehavior:n,visibleItemsRange:T,loop:r,gap:c,withFade:l,scrollPadding:f,scrollAreaRef:g,overflow:y},children:[(0,o.jsx)(`div`,{"data-spark-component":`scrolling-list`,className:(0,i.cx)(`gap-lg group/scrolling-list relative flex flex-col default:w-full`,m),...h,children:p}),(0,o.jsx)(`span`,{ref:_,className:`size-0 overflow-hidden`,tabIndex:-1})]})};f.displayName=`ScrollingList`;var p=({children:e,visibility:t=`always`,className:n,...r})=>(0,o.jsx)(`div`,{"data-spark-component":`scrolling-list-controls`,className:(0,i.cx)(`default:px-md pointer-events-none absolute inset-0 flex flex-row items-center justify-between overflow-hidden`,n),style:{"--scrolling-list-controls-opacity":t===`hover`?`0`:`1`},"data-orientation":`horizontal`,...r,children:e});p.displayName=`ScrollingList.Controls`;function m(e,t){let[n,r]=(0,a.useState)(!1);return(0,a.useEffect)(()=>{let n=e=>{r(!0);let n=e.target,i=t.current;if(n&&i){let e=n.getBoundingClientRect(),t=i.getBoundingClientRect();e.left>=t.left&&e.right<=t.right&&e.top>=t.top&&e.bottom<=t.bottom||n.scrollIntoView({behavior:`smooth`,inline:`center`,block:`nearest`})}},i=t=>{e.current&&!e.current.contains(t.relatedTarget)&&r(!1)},a=e.current;return a&&(a.addEventListener(`focusin`,n),a.addEventListener(`focusout`,i)),()=>{a&&(a.removeEventListener(`focusin`,n),a.removeEventListener(`focusout`,i))}},[e,t]),n}var h=({asChild:t=!1,children:n,index:r=0,className:s=``,...c})=>{let l=(0,a.useContext)(d),u=(0,a.useRef)(null),f=l.snapPointIndexes.has(r);return m(u,l.scrollAreaRef),(0,o.jsx)(t?e.Slot:`div`,{"data-spark-component":`scrolling-list-item`,role:`listitem`,ref:u,className:(0,i.cx)(`default:w-auto default:shrink-0`,{"snap-start":f,"snap-normal":f&&l.snapStop===`normal`,"snap-always":f&&l.snapStop===`always`},s),...c,children:n})};h.displayName=`ScrollingList.Item`;function g(...e){return t=>{e.forEach(e=>{typeof e==`function`?e(t):e&&typeof e==`object`&&`current`in e&&(e.current=t)})}}var _=({children:e,ref:t,className:n=``,...r})=>{let s=(0,a.useContext)(d),c={mandatory:`x mandatory`,proximity:`x proximity`,none:`none`},l=e=>{!s.loop&&!s.hasPrevPage||(e.preventDefault(),s.goTo(s.hasPrevPage?s.activePageIndex-1:s.pages.length-1,{behavior:s.scrollBehavior}))},u=e=>{!s.loop&&!s.hasNextPage||(e.preventDefault(),s.goTo(s.hasNextPage?s.activePageIndex+1:0,{behavior:s.scrollBehavior}))},f=e=>{e.key===`ArrowLeft`&&l(e),e.key===`ArrowRight`&&u(e)},p={scrollSnapType:c[s.snapType],scrollPaddingInline:`var(--scrolling-list-px)`,"--scrolling-list-px":`${s.scrollPadding}px`,"--scrolling-list-gap":`${s.gap}px`,...s.withFade&&{maskImage:`linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))`,maskSize:`calc(100% + ${s.overflow.left?`0px`:`44px`} + ${s.overflow.right?`0px`:`44px`}) 100%`,maskPosition:`${s.overflow.left?`0px`:`-44px`} 0`}};return(0,o.jsx)(`div`,{"data-spark-component":`scrolling-list-items`,id:`scrolling-list-items`,role:`list`,className:(0,i.cx)(`relative transition-all duration-300`,`u-no-scrollbar overflow-x-auto scroll-smooth`,`w-full gap-(--scrolling-list-gap) default:flex default:flex-row`,`focus-visible:u-outline`,n),ref:g(s.scrollAreaRef,s.scrollRef,t),style:p,onKeyDown:f,...r,children:a.Children.map(e,(e,t)=>(0,a.isValidElement)(e)?(0,a.cloneElement)(e,{index:t}):e)})};_.displayName=`ScrollingList.Items`;var v=({"aria-label":e,onClick:n,...s})=>{let l=(0,a.useContext)(d),u=e=>{l.hasNextPage?l.next({behavior:l.scrollBehavior}):l.goTo(0,{behavior:l.scrollBehavior}),n?.(e)},f=!(l.overflow.left||l.overflow.right)||!l.loop&&!l.overflow.right;return(0,o.jsx)(r.t,{"data-spark-component":`scrolling-list-next-button`,size:`sm`,intent:`surface`,design:`filled`,className:(0,i.cx)(`pointer-events-auto opacity-(--scrolling-list-controls-opacity) shadow-sm disabled:invisible`,`group-hover/scrolling-list:opacity-none focus-visible:opacity-none`),onClick:u,disabled:f,"aria-label":e,"aria-controls":`scrolling-list-items`,...s,children:(0,o.jsx)(t.t,{children:(0,o.jsx)(c.ArrowVerticalRight,{})})})};v.displayName=`ScrollingList.NextButton`;var y=({"aria-label":e,onClick:n,...s})=>{let c=(0,a.useContext)(d),u=e=>{c.activePageIndex===0&&(c.scrollAreaRef.current?.scrollLeft||0)>0?c.goTo(0,{behavior:c.scrollBehavior}):c.hasPrevPage?c.prev({behavior:c.scrollBehavior}):c.goTo(c.pages.length-1,{behavior:c.scrollBehavior}),n?.(e)},f=!(c.overflow.left||c.overflow.right)||!c.loop&&!c.overflow.left;return(0,o.jsx)(r.t,{"data-spark-component":`scrolling-list-prev-button`,size:`sm`,intent:`surface`,design:`filled`,className:(0,i.cx)(`pointer-events-auto opacity-(--scrolling-list-controls-opacity) shadow-sm disabled:invisible`,`group-hover/scrolling-list:opacity-none focus-visible:opacity-none`),onClick:u,disabled:f,"aria-label":e,"aria-controls":`scrolling-list-items`,...s,children:(0,o.jsx)(t.t,{children:(0,o.jsx)(l.ArrowVerticalLeft,{})})})};y.displayName=`ScrollingList.PrevButton`;var b=({children:e,...t})=>{let r=(0,a.useContext)(d);return(0,o.jsx)(n.t,{type:`button`,design:`tinted`,intent:`surface`,tabIndex:0,className:(0,i.cx)(`z-raised absolute top-1/2 left-0 -translate-y-1/2`,`not-focus-visible:pointer-events-none not-focus-visible:size-0 not-focus-visible:opacity-0`),onClick:r.skipKeyboardNavigation,...t,children:e})};b.displayName=`ScrollingList.SkipButton`;var x=Object.assign(f,{Controls:p,NextButton:v,PrevButton:y,Item:h,Items:_,SkipButton:b});x.displayName=`ScrollingList`,exports.ScrollingList=x;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Slot as e } from "../slot/index.mjs";
|
|
2
2
|
import { t } from "../icon-D05Uqh8_.mjs";
|
|
3
|
-
import { t as n } from "../button-
|
|
4
|
-
import { t as r } from "../icon-button-
|
|
3
|
+
import { t as n } from "../button-D49vse7F.mjs";
|
|
4
|
+
import { t as r } from "../icon-button-Bw0k4nKs.mjs";
|
|
5
5
|
import { cx as i } from "class-variance-authority";
|
|
6
6
|
import { Children as a, cloneElement as o, createContext as s, isValidElement as c, useCallback as l, useContext as u, useEffect as d, useLayoutEffect as f, useRef as p, useState as m } from "react";
|
|
7
7
|
import { jsx as h, jsxs as g } from "react/jsx-runtime";
|
package/dist/stepper/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../icon-CRPcdgYp.js`),t=require(`../icon-button-
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../icon-CRPcdgYp.js`),t=require(`../icon-button-BKVPOP0K.js`),n=require(`../input-BSCMbnO4.js`);let r=require(`class-variance-authority`),i=require(`react`),a=require(`react/jsx-runtime`),o=require(`@spark-ui/hooks/use-merge-refs`),s=require(`@spark-ui/components/form-field`),c=require(`@spark-ui/icons/Minus`),l=require(`@base-ui/react/number-field`),u=require(`@spark-ui/icons/Plus`);var d=(0,i.createContext)(null),f=({children:e,formatOptions:t,minValue:o,maxValue:c,ref:u,onValueChange:f,locale:p=`fr`,name:m,...h})=>{let g=(0,i.useRef)(null),_=(0,s.useFormFieldControl)(),v=(0,i.useRef)(h.value??h.defaultValue??null),y=_.name??m,b=_.disabled??h.disabled,x=_.readOnly??h.readOnly,S=_.isRequired??h.required,C=e=>{f&&e!==v.current&&(v.current=e,f(e))},{"aria-label":w,...T}=h;return(0,a.jsx)(d,{value:{inputRef:g,fieldId:_.id,fieldLabelId:_.labelId,fieldIsInvalid:_.isInvalid,fieldIsRequired:S,state:h.state,ariaLabel:w},children:(0,a.jsx)(l.NumberField.Root,{...T,format:t,min:o,max:c,locale:p,disabled:b,readOnly:x,required:S,name:y,inputRef:g,onValueCommitted:C,"aria-describedby":_.description,children:(0,a.jsx)(`div`,{"data-spark-component":`stepper`,ref:u,className:(0,r.cx)(n.r({disabled:b,readOnly:x}),h.className),children:e})})})};f.displayName=`Stepper`;var p=()=>{let e=(0,i.useContext)(d);if(!e)throw Error(`useStepperContext must be used within a Stepper provider`);return e},m=({children:n,design:i=`ghost`,intent:o=`neutral`,className:s,ref:c,disabled:d,...f})=>{let{fieldId:m,state:h}=p();return(0,a.jsx)(l.NumberField.Increment,{render:l=>{let p=d||`disabled`in l&&l.disabled,g=`readOnly`in l&&l.readOnly;return(0,a.jsx)(`div`,{className:(0,r.cx)(`rounded-r-lg`,p||g?`bg-on-surface/dim-5`:null),"data-spark-component":`stepper-increment-button`,children:(0,a.jsx)(t.t,{ref:c,design:i,intent:o,className:(0,r.cx)(`overflow-hidden border-sm shrink-0 h-full focus-visible:relative focus-visible:z-raised mx-0`,`rounded-l-0! -ml-px rounded-r-lg`,h===`error`&&`border-error`,h===`alert`&&`border-alert`,h===`success`&&`border-success`,!h&&`border-outline`,s),...f,...l,"aria-label":f[`aria-label`]||l[`aria-label`],"aria-controls":m,disabled:p,children:n||(0,a.jsx)(e.t,{children:(0,a.jsx)(u.Plus,{})})})})}})},h=({children:n,design:i=`ghost`,intent:o=`neutral`,className:s,ref:u,disabled:d,...f})=>{let{fieldId:m,state:h}=p();return(0,a.jsx)(l.NumberField.Decrement,{render:l=>{let p=d||`disabled`in l&&l.disabled,g=`readOnly`in l&&l.readOnly;return(0,a.jsx)(`div`,{className:(0,r.cx)(`rounded-l-lg`,p||g?`bg-on-surface/dim-5`:null),"data-spark-component":`stepper-decrement-button`,children:(0,a.jsx)(t.t,{ref:u,design:i,intent:o,className:(0,r.cx)(`overflow-hidden border-sm shrink-0 h-full focus-visible:relative focus-visible:z-raised mx-0`,`rounded-r-0! -mr-px rounded-l-lg`,h===`error`&&`border-error`,h===`alert`&&`border-alert`,h===`success`&&`border-success`,!h&&`border-outline`,s),...f,...l,"aria-label":f[`aria-label`]||l[`aria-label`],"aria-controls":m,disabled:p,children:n||(0,a.jsx)(e.t,{children:(0,a.jsx)(c.Minus,{})})})})}})},g=m,_=h;m.displayName=`Stepper.IncrementButton`,h.displayName=`Stepper.DecrementButton`;var v=({ref:e,...t})=>{let{inputRef:r,fieldId:i,fieldLabelId:s,fieldIsInvalid:c,fieldIsRequired:u,ariaLabel:d}=p(),f=(0,o.useMergeRefs)(e,r),{className:m=``,...h}=t,g=!!s;return(0,a.jsx)(`div`,{className:`relative inline-flex w-full`,children:(0,a.jsx)(l.NumberField.Input,{render:e=>{let t;u===void 0?`required`in e&&(t=e.required):t=u;let r=c===void 0?e[`aria-invalid`]:c;return(0,a.jsx)(n.n,{ref:f,...e,...h,id:i||e.id,required:t,"aria-invalid":r,"aria-label":g?void 0:d,className:`min-w-sz-56 text-center rounded-none! ${m}`})}})})},y=v;v.displayName=`Stepper.Input`;var b=Object.assign(f,{IncrementButton:g,DecrementButton:_,Input:y});b.displayName=`Stepper`,g.displayName=`Stepper.IncrementButton`,_.displayName=`Stepper.DecrementButton`,y.displayName=`Stepper.Input`,exports.Stepper=b;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/stepper/index.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { t as e } from "../icon-D05Uqh8_.mjs";
|
|
2
|
-
import { t } from "../icon-button-
|
|
2
|
+
import { t } from "../icon-button-Bw0k4nKs.mjs";
|
|
3
3
|
import { n, r } from "../input-cKdm2R3n.mjs";
|
|
4
4
|
import { cx as i } from "class-variance-authority";
|
|
5
5
|
import { createContext as a, useContext as o, useRef as s } from "react";
|
package/dist/table/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../chunk-C91j1N6u.js`),t=require(`../icon-CRPcdgYp.js`),n=require(`../button-Tv2N8_24.js`),r=require(`../checkbox-hVGRiWC_.js`);let i=require(`class-variance-authority`),a=require(`react`);a=e.t(a);let o=require(`react/jsx-runtime`),s=require(`@react-aria/utils`),c=require(`@react-stately/table`),l=require(`react-aria`),u=require(`@react-aria/table`),d=require(`@spark-ui/icons/ArrowDown`),f=require(`@spark-ui/icons/ArrowUp`),p=require(`@spark-ui/icons/Sort`);var m=(0,a.createContext)({isResizable:!1,tableWidth:0});function h(){return(0,a.useContext)(m)}var g=(0,a.createContext)({selectedCount:0,onClearSelection:()=>{}});function _(){return(0,a.useContext)(g)}function v({children:e,className:t,selectedKeys:n,onSelectionChange:r,totalCount:a,hasMultiplePages:s,onClearSelection:c,onSelectAll:l,allowsResizing:u=!0,resizeColumnAriaLabel:d,maxHeight:f,stickyHeader:p,onResizeStart:m,onResize:h,onResizeEnd:_,onKeyDownCapture:v,sortDescriptor:y,onSortChange:b,...x}){let S=0;n===`all`?S=a??0:n instanceof Set?S=n.size:n&&(S=new Set(n).size);let C=c??(()=>r?.(new Set));return(0,o.jsx)(g,{value:{...x,selectedKeys:n,onSelectionChange:r,totalCount:a,hasMultiplePages:s,onSelectAll:l,selectedCount:S,onClearSelection:C,allowsResizing:u,resizeColumnAriaLabel:d,maxHeight:f,stickyHeader:p,onResizeStart:m,onResize:h,onResizeEnd:_,onKeyDownCapture:v,sortDescriptor:y,onSortChange:b,className:t},children:(0,o.jsx)(`div`,{className:(0,i.cx)(`gap-md flex flex-col`,t),children:e})})}v.displayName=`Table`;function y({className:e,children:t,...n}){let r=(0,a.useRef)(null),[c,l]=(0,a.useState)(0);return(0,a.useLayoutEffect)(()=>{let e=r.current;e&&l(e.clientWidth)},[]),(0,s.useResizeObserver)({ref:r,onResize:()=>{let e=r.current;e&&l(e.clientWidth)}}),(0,o.jsx)(m,{value:{isResizable:!0,tableWidth:c},children:(0,o.jsx)(`div`,{ref:r,"data-spark-component":`resizable-table-container`,className:(0,i.cx)(`relative w-full overflow-auto`,e),...n,children:t})})}y.displayName=`ResizableTableContainer`;var b=`[data-spark-component="table-cell"]`;function x(e){return!e||!(e instanceof Element)?!1:!!e.closest(`[role="combobox"],select,[data-spark-component="dropdown-trigger"],[data-spark-component="combobox-input"]`)}function S(e){if(!e||!(e instanceof Element))return!1;let t=e.closest(`[role="combobox"],[data-spark-component="dropdown-trigger"],[data-spark-component="combobox-input"]`);return t?t.getAttribute(`aria-expanded`)===`true`:!1}var C=`a[href], button:not([disabled]), input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), [tabindex]`;function w(e){return!e||!(e instanceof Element)?null:e.closest(b)}function T(e){return e.getAttribute(`data-table-cell-kind`)===`selection`}function E(e){return Array.from(e.querySelectorAll(C)).filter(t=>!(t===e||t.hasAttribute(`disabled`)||t.getAttribute(`aria-disabled`)===`true`||t.getAttribute(`hidden`)!==null))}function D(e,t){for(let n of E(e)){let e=`data-prev-tabindex`;if(!t)n.hasAttribute(e)||n.setAttribute(e,n.getAttribute(`tabindex`)??``),n.setAttribute(`tabindex`,`-1`);else{let t=n.getAttribute(e);if(t===null)continue;n.removeAttribute(e),t===``?n.removeAttribute(`tabindex`):n.setAttribute(`tabindex`,t)}}}function O(e){let t=Array.from(e.querySelectorAll(b));for(let e of t)D(e,!1)}function ee({ref:e,gridProps:t,onKeyDownCapture:n,onFocusCapture:r}){let[i,o]=(0,a.useState)(`grid`),s=(0,a.useRef)(`grid`),c=(0,a.useRef)(null),u=(0,a.useRef)(!1),d=(0,a.useMemo)(()=>{let{onKeyDown:a,...d}=t,f=e=>{c.current=e,s.current=`interaction`,o(`interaction`),D(e,!0)};return(0,l.mergeProps)(d,{onKeyDown:e=>{if(s.current===`interaction`&&(e.key===`ArrowLeft`||e.key===`ArrowRight`||e.key===`ArrowUp`||e.key===`ArrowDown`)){let e=c.current,t=document.activeElement;if(e&&t instanceof Node&&e.contains(t))return}s.current===`interaction`&&(e.key===`ArrowUp`||e.key===`ArrowDown`)&&x(e.target)&&w(e.target)===c.current||a?.(e)},onKeyDownCapture:e=>{if(n?.(e),s.current===`interaction`&&e.key===`Tab`){let t=w(e.target);t&&t===c.current&&e.stopPropagation();return}if(x(e.target)&&s.current===`interaction`&&(e.key===`ArrowLeft`||e.key===`ArrowRight`||e.key===`ArrowUp`||e.key===`ArrowDown`)){let t=w(e.target);if(t&&t===c.current)return}if(s.current===`interaction`&&(e.key===`ArrowLeft`||e.key===`ArrowRight`||e.key===`ArrowUp`||e.key===`ArrowDown`)){let t=w(e.target);if(t&&t===c.current){e.stopPropagation();return}}if(s.current===`grid`&&e.key===`ArrowRight`){let t=w(e.target);if(t){let n=t.closest(`tr`);if(n){let r=Array.from(n.querySelectorAll(b));if(r.length>0&&r[r.length-1]===t){e.preventDefault(),e.stopPropagation(),n.focus();return}}}}if(s.current===`grid`&&e.key===`Enter`){let t=w(e.target);if(!t||T(t))return;let n=E(t);if(n.length===0)return;e.preventDefault(),e.stopPropagation(),f(t),n[0]?.focus();return}if(s.current===`grid`&&e.key===`F2`){let t=w(e.target);if(!t||T(t))return;let n=E(t);if(n.length===0)return;e.preventDefault(),e.stopPropagation(),f(t),n[0]?.focus();return}if(s.current===`interaction`&&e.key===`Escape`){if(S(e.target))return;let t=c.current;if(!t)return;e.preventDefault(),e.stopPropagation(),s.current=`grid`,o(`grid`),t.focus()}if(s.current===`interaction`&&e.key===`F2`){let t=c.current;if(!t)return;e.preventDefault(),e.stopPropagation(),s.current=`grid`,o(`grid`),t.focus()}},onBlurCapture:t=>{if(s.current!==`interaction`)return;let n=e.current;if(!n)return;let r=t.relatedTarget;r instanceof Node&&n.contains(r)||(c.current=null,s.current=`grid`,o(`grid`))},onFocusCapture:t=>{r?.(t);let n=u.current;u.current=!1;let i=e.current,a=w(t.target);if(s.current===`interaction`&&c.current&&i){let e=!!(a&&a!==c.current),n=!a&&t.target instanceof Element&&i.contains(t.target)&&!c.current.contains(t.target);(e||n)&&(s.current=`grid`,o(`grid`),n&&(c.current=null))}if(!a)return;c.current=a;let l=t.target instanceof Element?t.target:null,d=a.matches(b),p=s.current===`grid`,m=!!(l&&l!==a&&a.contains(l)),h=E(a).length>0;p&&d&&m&&h&&!n&&queueMicrotask(()=>a.focus()),n&&p&&m&&d&&h&&!T(a)&&f(a)},onPointerDownCapture:e=>{let t=w(e.target);t?.matches(b)&&e.target instanceof Element&&e.target!==t&&t.contains(e.target)&&(u.current=!0)},"data-table-keyboard-mode":i})},[t,i,e,r,n]);return(0,a.useEffect)(()=>{s.current=i;let t=e.current;if(t){if(i===`grid`){O(t),c.current?.focus?.();return}O(t),c.current&&D(c.current,!0)}},[i,e]),{gridProps:d,keyboardMode:i}}var k=(0,i.cva)([`h-sz-64 min-w-sz-64`,`relative group/column first:rounded-l-xl last:rounded-r-xl bg-neutral-container`,`pl-lg pr-lg py-sm text-left outline-none box-border`,`cursor-default`,`data-focus-visible:u-outline data-focus-visible:-outline-offset-2`],{variants:{checkbox:{true:[`w-sz-64 min-w-sz-64 max-w-sz-64`,`px-0 align-middle`]},resizable:{true:[`pr-xl`]}},defaultVariants:{checkbox:!1,resizable:!1}}),te=(0,i.cva)([`flex flex-1 justify-between items-center gap-md`,`font-inherit text-left text-inherit`,`whitespace-nowrap text-ellipsis`,`border-transparent`,`data-focus-visible:u-outline data-focus-visible:outline-offset-2`],{variants:{},defaultVariants:{}});(0,i.cva)([`empty:italic empty:text-center empty:text-body-2 empty:py-lg`],{variants:{},defaultVariants:{}});var ne=(0,i.cva)([`p-lg outline-none box-border default:overflow-hidden`,`border-b-sm border-outline [tr:last-child>&]:border-b-0`,`[-webkit-tap-highlight-color:transparent]`,`data-focus-visible:u-outline-inset data-focus-visible:outline-dashed`],{variants:{checkbox:{true:[`w-sz-64 py-sm px-0 align-middle`]}},defaultVariants:{checkbox:!1}}),re=(0,i.cva)([`pointer-events-none`,`[&_td]:h-sz-16 [&_td]:p-0 [&_td]:border-0 [&_td]:border-b-0 [&_td]:bg-surface [&_td]:align-middle`],{variants:{},defaultVariants:{}}),ie=`button, [role="button"], [role="switch"], [role="checkbox"], [role="option"], input:not([type="hidden"]), select, textarea, [href], [data-spark-component="dropdown-trigger"], [data-spark-component="icon-button"], [data-spark-component="switch"], [data-spark-component="switch-input"], [data-spark-component="combobox-input"]`,ae=`a[href], button:not([disabled]), input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), [tabindex]`;function oe(e){if(!e||!(e instanceof Element))return!1;let t=e;return t.matches(ie)||t.closest(ie)!==null}function se(e){return e?e instanceof Element?e:e instanceof Text?e.parentElement:null:null}function ce(e){for(let t of e.querySelectorAll(ae))if(t!==e&&!t.hasAttribute(`disabled`)&&t.getAttribute(`aria-disabled`)!==`true`&&t.getAttribute(`hidden`)===null)return!0;return!1}function le(e){let t=se(e);if(!t)return!1;if(oe(t))return!0;let n=t.closest(`[data-spark-component="table-cell"]`);return!n||n.getAttribute(`data-table-cell-kind`)===`selection`?!1:ce(n)}var A=(0,a.createContext)(`grid`);function j({checkboxProps:e,className:t,suppressFocusWalker:n}){let{isSelected:i,isIndeterminate:a,isDisabled:s,onChange:c,...l}=e,u=a===!0?`indeterminate`:!!i;return(0,o.jsx)(`span`,{...n?{"data-react-aria-prevent-focus":!0}:void 0,onClick:e=>e.stopPropagation(),onPointerDown:e=>e.stopPropagation(),className:t??`flex h-full min-h-full items-center justify-center`,children:(0,o.jsx)(r.n,{checked:u,disabled:s,onCheckedChange:c,...l})})}j.displayName=`Table.SelectionCheckbox`;function M({cell:e,state:t,resizeState:n}){let r=(0,a.useRef)(null),{gridCellProps:i}=(0,l.useTableCell)({node:e},t,r),{isFocusVisible:s,focusProps:c}=(0,l.useFocusRing)(),d=(0,a.useContext)(A),f=(0,a.useCallback)(e=>{d===`interaction`&&(e.key!==` `&&e.key!==`Enter`||e.stopPropagation())},[d]),{onKeyDownCapture:p,...m}=i,h=(0,a.useCallback)(e=>{[`ArrowLeft`,`ArrowRight`,`ArrowUp`,`ArrowDown`].includes(e.key)||p?.(e)},[p]),g=(0,u.useTableSelectionCheckbox)({key:e.parentKey??e.key},t),_=t.collection.columns[e.index??0]?.key??null,v=_?n?.columnWidths?.get?.(_):void 0;return e.props?.isSelectionCell?(0,o.jsx)(`td`,{...(0,l.mergeProps)(m,{onKeyDownCapture:h},c,{onKeyDown:f}),ref:r,"data-spark-component":`table-cell`,"data-table-cell-kind":`selection`,className:ne({checkbox:!0}),"data-focus-visible":s||void 0,children:(0,o.jsx)(j,{suppressFocusWalker:d===`grid`,checkboxProps:g.checkboxProps})}):(0,o.jsx)(`td`,{...(0,l.mergeProps)(m,{onKeyDownCapture:h},c,{onKeyDown:f}),ref:r,"data-spark-component":`table-cell`,className:ne(),"data-focus-visible":s||void 0,style:v?{width:v}:void 0,children:e.rendered})}M.displayName=`Table.BodyCellRenderer`;function N(e){if(e)return t=>{le((0,s.getEventTarget)(t.nativeEvent))||e(t)}}function P({item:e,state:t,resizeState:n}){let r=(0,a.useRef)(null),{rowProps:s,isSelected:c}=(0,l.useTableRow)({node:e},t,r),{isFocusVisible:u,focusProps:d}=(0,l.useFocusRing)(),{onClick:f,onPointerDown:p,onMouseDown:m,onPointerUp:h,onPointerCancel:g,..._}=s,v=(0,i.cx)(`outline-none box-border data-focus-visible:u-outline-inset data-focus-visible:outline-dashed`,_.className,c&&`bg-support-container text-on-support-container`);return(0,o.jsx)(`tr`,{...(0,l.mergeProps)(_,d),onPointerDown:N(p),onMouseDown:N(m),onPointerUp:N(h),onPointerCancel:N(g),onClick:N(f),ref:r,"data-spark-component":`table-row`,"data-selected":c||void 0,"data-focus-visible":u||void 0,className:v,tabIndex:-1,children:[...e.childNodes].map(e=>(0,o.jsx)(M,{cell:e,state:t,resizeState:n},e.key))})}P.displayName=`Table.BodyRowRenderer`;function F({column:e,ariaLabel:t,resizeState:n,resizeCallbacks:r}){let s=(0,a.useRef)(null),{resizerProps:c,inputProps:l,isResizing:d}=(0,u.useTableColumnResize)({column:e,"aria-label":t??`Resize column`,onResizeStart:r.onResizeStart,onResize:r.onResize,onResizeEnd:r.onResizeEnd},n,s);return(0,o.jsx)(`div`,{role:`presentation`,className:(0,i.cx)(`cursor-col-resize absolute inset-y-lg right-0 flex w-lg items-center justify-center`,`after:block after:h-full after:w-[2px] after:bg-outline after:transition-all after:duration-75`,`has-[input:focus-visible]:after:u-outline has-[input:focus-visible]:after:outline-offset-2`,d&&`after:bg-outline-high after:scale-120`),"data-resizable-direction":`both`,...c,children:(0,o.jsx)(`input`,{ref:s,disabled:!d,...l})})}F.displayName=`Table.ColumnResizer`;function I({state:e}){let{checkboxProps:t}=(0,u.useTableSelectAllCheckbox)(e),{collection:n,selectionManager:r}=e,i=r.selectedKeys,a=n,s=a.body,c=s==null?new Set(n.getKeys()):new Set([...a.getChildren(s.key)].map(e=>e.key)),l=i===`all`?c:i,d=[...c].filter(e=>l.has(e)).length,f=c.size,p=f>0&&d===f,m=d>0&&d<f,{isSelected:h,isIndeterminate:g,onChange:_,...v}=t,y=e=>{(e.key===` `||e.key===`Enter`)&&e.stopPropagation(),e.key===`Enter`&&(e.preventDefault(),t.isDisabled||_?.(!p))};return(0,o.jsx)(j,{checkboxProps:{...v,isSelected:p,isIndeterminate:m,onChange:_,onKeyDown:y}})}I.displayName=`Table.HeaderSelectionCheckbox`;var L=(0,i.cx)(`sticky top-0 z-sticky`);function R({column:e,state:n,resizeState:r,stickyHeader:s,resizeCallbacks:c,isLastColumnInRow:u=!1}){let m=(0,a.useRef)(null),{resizeColumnAriaLabel:h}=_(),{columnHeaderProps:g}=(0,l.useTableColumnHeader)({node:e},n,m),{isFocusVisible:v,focusProps:y}=(0,l.useFocusRing)(),b=e.props?.allowsResizing!==!1&&!u,x=r?.columnWidths?.get?.(e.key),S=!!(r&&b);if(e.props?.isSelectionCell)return(0,o.jsx)(`th`,{...g,ref:m,role:`columnheader`,className:(0,i.cx)(k({checkbox:!0}),s&&L),"data-spark-component":`table-column`,"data-table-selection-columnheader":!0,"data-focus-visible":v||void 0,children:(0,o.jsx)(I,{state:n})});let C=!!e.props?.allowsSorting,w=n.sortDescriptor?.column===e.key,T=n.sortDescriptor?.direction??`ascending`,E=w?T===`descending`?(0,o.jsx)(d.ArrowDown,{}):(0,o.jsx)(f.ArrowUp,{}):(0,o.jsx)(p.Sort,{}),D=t=>{C&&(t.key!==`Enter`&&t.key!==` `||(t.preventDefault(),t.stopPropagation(),n.sort?.(e.key)))};return(0,o.jsxs)(`th`,{...(0,l.mergeProps)(g,y),ref:m,role:`columnheader`,className:(0,i.cx)(k({resizable:S}),s&&L),style:x?{width:x}:void 0,"data-spark-component":`table-column`,"data-focus-visible":v||void 0,onKeyDown:D,children:[(0,o.jsxs)(`div`,{className:te(),children:[(0,o.jsx)(`button`,{type:`button`,className:(0,i.cx)(`gap-md flex min-w-0 flex-1 items-center text-left`,`focus-visible:u-outline outline-none`,`bg-transparent p-0 border-0`),onKeyDown:D,children:(0,o.jsx)(`span`,{className:`min-w-0 overflow-hidden text-ellipsis whitespace-nowrap`,children:e.rendered})}),C?(0,o.jsx)(`span`,{"aria-hidden":`true`,className:(0,i.cx)(`shrink-0 opacity-dim-2 group-hover/column:opacity-100`,w&&`opacity-100`),children:(0,o.jsx)(t.t,{size:`sm`,children:E})}):null]}),r&&b?(0,o.jsx)(F,{column:e,ariaLabel:typeof h==`function`?h(e):h,resizeState:r,resizeCallbacks:c}):null]})}R.displayName=`Table.ColumnHeader`;function z({item:e,state:t,resizeState:n,stickyHeader:r,resizeCallbacks:i}){let s=(0,a.useRef)(null),{rowProps:c}=(0,l.useTableHeaderRow)({node:e},t,s),u=[...e.childNodes];return(0,o.jsx)(`tr`,{...c,ref:s,children:u.map((e,a)=>(0,o.jsx)(R,{column:e,state:t,resizeState:n,stickyHeader:r,resizeCallbacks:i,isLastColumnInRow:a===u.length-1},e.key))})}z.displayName=`Table.HeaderRowRenderer`;function B({className:e,children:t,stickyHeader:n,...r}){let u=!!n,d=(0,a.useRef)(null),f=h(),p=r.selectionMode===`multiple`,m=(0,c.useTableState)({...r,showSelectionCheckboxes:r.selectionMode===`multiple`,children:t}),g=(0,c.useTableColumnResizeState)({tableWidth:f.tableWidth},m),_=f.isResizable&&r.allowsResizing!==!1?g:null,{gridProps:v}=(0,l.useTable)({...r},m,d),y=m.collection.headerRows,b=[...m.collection.body.childNodes],x=m.collection.body.props?.renderEmptyState,S=m.collection.columns.length||1,C=b.length>0||!!x,{rowGroupProps:w}=(0,l.useTableRowGroup)(),{rowGroupProps:T}=(0,l.useTableRowGroup)(),{gridProps:E,keyboardMode:D}=ee({ref:d,gridProps:v,onKeyDownCapture:r.onKeyDownCapture,onFocusCapture:r.onFocusCapture});return(0,o.jsx)(A,{value:D,children:(0,o.jsxs)(`table`,{...(0,l.mergeProps)(E,(0,s.filterDOMProps)(r,{global:!0})),ref:d,"data-spark-component":`table`,className:(0,i.cx)(`default:w-full`,p?`table-fixed`:void 0,`border-separate border-spacing-y-0`,`bg-surface`,`outline-none`,`text-body-1`,`forced-color-adjust-none`,`data-focus-visible:u-outline-inset`,`has-[>[data-empty]]:h-full`,e),children:[(0,o.jsx)(`thead`,{...w,"data-spark-component":`table-header`,children:y.map(e=>(0,o.jsx)(z,{item:e,state:m,resizeState:_,stickyHeader:u,resizeCallbacks:{onResizeStart:r.onResizeStart,onResize:r.onResize,onResizeEnd:r.onResizeEnd}},e.key))}),(0,o.jsxs)(`tbody`,{...T,"data-spark-component":`table-body`,children:[C?(0,o.jsx)(`tr`,{"aria-hidden":`true`,className:re(),role:`presentation`,"data-spark-component":`table-body-spacer`,children:(0,o.jsx)(`td`,{colSpan:S,role:`presentation`})}):null,b.length===0&&x?(0,o.jsx)(`tr`,{"data-empty":!0,children:(0,o.jsx)(`td`,{colSpan:S,children:x({isEmpty:!0})})}):null,b.map(e=>(0,o.jsx)(P,{item:e,state:m,resizeState:_},e.key))]})]})})}B.displayName=`Table.Grid.Inner`;function ue(e){return typeof e==`number`?`${e}px`:e}function V({"aria-label":e,"aria-labelledby":t,className:n,children:r}){let{allowsResizing:i=!0,maxHeight:a,stickyHeader:s,onResizeStart:c,onResize:l,onResizeEnd:u,onKeyDownCapture:d,sortDescriptor:f,onSortChange:p,className:m,...h}=_(),g=a==null?void 0:{maxHeight:ue(a)},v=n??m,b={...h,...e!=null&&{"aria-label":e},...t!=null&&{"aria-labelledby":t},sortDescriptor:f,onSortChange:p,onKeyDownCapture:d,className:v,stickyHeader:s},x=B;return i?(0,o.jsx)(y,{className:v,style:g,onResizeStart:c,onResize:l,onResizeEnd:u,children:(0,o.jsx)(x,{...b,children:r})}):(0,o.jsx)(`div`,{className:`relative w-full overflow-auto`,style:g,children:(0,o.jsx)(x,{...b,children:r})})}V.displayName=`Table.Grid`;function H(e){return(0,o.jsx)(c.TableBody,{...e})}H.displayName=`Table.Body`,H.getCollectionNode=c.TableBody.getCollectionNode;var U=(0,a.createContext)(null);function W(){let e=(0,a.useContext)(U);if(!e)throw Error(`Table.BulkBar subcomponents must be used within Table.BulkBar`);return e}function G({children:e,className:t,rootProps:n,...r}){let{selectedCount:a,totalCount:s,onClearSelection:c,onSelectAll:l,hasMultiplePages:u}=_();return(0,o.jsx)(U,{value:{selectedCount:a,totalCount:s,onClearSelection:c,onSelectAll:l,hasMultiplePages:u},children:(0,o.jsx)(`div`,{role:`toolbar`,"aria-label":r[`aria-label`]??`Table bulk actions`,"data-spark-component":`table-bulk-bar`,className:(0,i.cx)(`gap-lg min-h-sz-64 flex w-full flex-wrap items-center justify-between`,`rounded-lg`,`bg-support-container text-on-support-container p-lg`,t),...n,children:e})})}function K({children:e}){return W(),(0,o.jsx)(`span`,{className:`text-body-1-highlight`,children:e})}function q({className:e,children:t,...r}){let{selectedCount:a,onClearSelection:s,hasMultiplePages:c}=W();return c?(0,o.jsx)(n.t,{size:`sm`,design:`ghost`,intent:`support`,underline:!0,ariaDisabled:a===0,onClick:s,className:(0,i.cx)(`text-body-2`,e),...r,children:t}):null}function de({className:e,children:t,...r}){let{selectedCount:a,totalCount:s,onSelectAll:c,hasMultiplePages:l}=W();return l?(0,o.jsx)(n.t,{size:`sm`,design:`ghost`,intent:`support`,underline:!0,ariaDisabled:s==null||c==null||a>=s,onClick:c,className:(0,i.cx)(`text-body-2`,e),...r,children:t}):null}G.displayName=`Table.BulkBar`;var J=G;J.displayName=`Table.BulkBar`,K.displayName=`Table.BulkBarSelectedCount`,q.displayName=`Table.BulkBarClearButton`,de.displayName=`Table.BulkBarSelectAllButton`;function Y(e){return(0,o.jsx)(c.Cell,{...e})}Y.displayName=`Table.Cell`,Y.getCollectionNode=c.Cell.getCollectionNode;function X({label:e,allowsResizing:t=!0,...n}){return null}X.displayName=`Table.Column`,X.getCollectionNode=function*(e,t){let n=e.title??e.label??e.children??null,r=e.textValue||(typeof n==`string`?n:``)||e[`aria-label`],i=yield{type:`column`,key:e.id??null,hasChildNodes:!!e.childColumns||!!e.title&&a.default.Children.count(e.children)>0,rendered:n,textValue:r,props:{...e,title:e.title??e.label,allowsResizing:e.allowsResizing},*childNodes(){if(e.childColumns)for(let t of e.childColumns)yield{type:`column`,value:t};else if(e.title){let t=[];a.default.Children.forEach(e.children,e=>{t.push({type:`column`,element:e})}),yield*t}},shouldInvalidate(e){return o(e),!1}},o=e=>{for(let t of i)t.hasChildNodes||e.columns.push(t)};o(t)};function Z(e){return(0,o.jsx)(c.TableHeader,{...e})}Z.displayName=`Table.Header`,Z.getCollectionNode=c.TableHeader.getCollectionNode;function Q(e){return null}Q.displayName=`Table.Row`,Q.getCollectionNode=function*(e,t){let{children:n,textValue:r,UNSTABLE_childItems:i}=e;yield{type:`item`,key:e.id??null,props:e,textValue:r,"aria-label":e[`aria-label`],hasChildNodes:!0,*childNodes(){if(t.showDragButtons&&(yield{type:`cell`,key:`header-drag`,props:{isDragButtonCell:!0}}),t.showSelectionCheckboxes&&t.selectionMode!==`none`&&(yield{type:`cell`,key:`header`,props:{isSelectionCell:!0}}),typeof n==`function`){for(let e of t.columns)yield{type:`cell`,element:n(e.key),key:e.key};if(i)for(let e of i)yield{type:`item`,value:e}}else{let e=[],r=[],i=0;if(a.default.Children.forEach(n,n=>{if(n)if(n.type===Q){if(e.length<t.columns.length)throw Error(`All of a Row's child Cells must be positioned before any child Rows.`);r.push({type:`item`,element:n})}else e.push({type:`cell`,element:n}),i+=n.props?.colSpan??1}),i!==t.columns.length)throw Error(`Cell count must match column count. Found ${i} cells and ${t.columns.length} columns.`);yield*e,yield*r}},shouldInvalidate(e){return e.columns.length!==t.columns.length||e.columns.some((e,n)=>e.key!==t.columns[n].key)||e.showSelectionCheckboxes!==t.showSelectionCheckboxes||e.showDragButtons!==t.showDragButtons||e.selectionMode!==t.selectionMode}}};function fe(e,t,n,r){let i=e[n],a=t[n];if(i===a)return 0;let o;return o=typeof i==`number`&&typeof a==`number`?i<a?-1:1:String(i).localeCompare(String(a)),r===`descending`?-o:o}function pe(e,t={}){let{initialSort:n,compare:r}=t,[i,o]=(0,a.useState)(()=>n?{column:n.column,direction:n.direction}:{column:`id`,direction:`ascending`});return{sortDescriptor:i,onSortChange:o,setSortDescriptor:o,sortedItems:(0,a.useMemo)(()=>{let t=i.column;if(!t)return[...e];let n=r??fe,a=i.direction??`ascending`;return[...e].sort((e,r)=>n(e,r,t,a))},[e,i.column,i.direction,r])}}function me(e,t){let{pageSize:n,initialPage:r=1,getId:i}=t,[o,s]=(0,a.useState)(r),[c,l]=(0,a.useState)(()=>new Set),u=e.length,d=Math.max(1,Math.ceil(u/n));(0,a.useEffect)(()=>{s(e=>e<1?1:e>d?d:e)},[d]);let f=o;f<1?f=1:f>d&&(f=d);let p=(0,a.useMemo)(()=>{let t=(f-1)*n,r=t+n;return e.slice(t,r)},[e,f,n]),m=(0,a.useMemo)(()=>{let t=i??(e=>{let t=e.id;if(t==null)throw Error("useTablePagination: item.id is undefined. Provide a `getId` option to extract a stable key.");return t});return new Set(e.map(e=>t(e)))},[i,e]),h=(0,a.useMemo)(()=>{let e=i??(e=>{let t=e.id;if(t==null)throw Error("useTablePagination: item.id is undefined. Provide a `getId` option to extract a stable key.");return t});return new Set(p.map(t=>e(t)))},[i,p]);return{page:f,setPage:s,pageItems:p,totalItems:u,totalPages:d,allKeys:m,selectedKeys:c,onSelectionChange:e=>{let t=e===`all`?new Set(h):new Set(e);l(e=>{let n=new Set(t);for(let t of e)h.has(t)||n.add(t);return n})},onPageChange:e=>{s(e.page)},clearSelection:()=>{l(()=>new Set)}}}var $=Object.assign(v,{Grid:V,Header:Z,Column:X,Body:H,Row:Q,Cell:Y,BulkBar:J,BulkBarSelectedCount:K,BulkBarClearButton:q,BulkBarSelectAllButton:de});$.displayName=`Table`,Z.displayName=`Table.Header`,X.displayName=`Table.Column`,H.displayName=`Table.Body`,Q.displayName=`Table.Row`,Y.displayName=`Table.Cell`,exports.Table=$,exports.TableCompound=$,exports.useTablePagination=me,exports.useTableSort=pe;
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../chunk-C91j1N6u.js`),t=require(`../icon-CRPcdgYp.js`),n=require(`../button-pz6WB_vb.js`),r=require(`../checkbox-hVGRiWC_.js`);let i=require(`class-variance-authority`),a=require(`react`);a=e.t(a);let o=require(`react/jsx-runtime`),s=require(`@react-aria/utils`),c=require(`@react-stately/table`),l=require(`react-aria`),u=require(`@react-aria/table`),d=require(`@spark-ui/icons/ArrowDown`),f=require(`@spark-ui/icons/ArrowUp`),p=require(`@spark-ui/icons/Sort`);var m=(0,a.createContext)({isResizable:!1,tableWidth:0});function h(){return(0,a.useContext)(m)}var g=(0,a.createContext)({selectedCount:0,onClearSelection:()=>{}});function _(){return(0,a.useContext)(g)}function v({children:e,className:t,selectedKeys:n,onSelectionChange:r,totalCount:a,hasMultiplePages:s,onClearSelection:c,onSelectAll:l,allowsResizing:u=!0,resizeColumnAriaLabel:d,maxHeight:f,stickyHeader:p,onResizeStart:m,onResize:h,onResizeEnd:_,onKeyDownCapture:v,sortDescriptor:y,onSortChange:b,...x}){let S=0;n===`all`?S=a??0:n instanceof Set?S=n.size:n&&(S=new Set(n).size);let C=c??(()=>r?.(new Set));return(0,o.jsx)(g,{value:{...x,selectedKeys:n,onSelectionChange:r,totalCount:a,hasMultiplePages:s,onSelectAll:l,selectedCount:S,onClearSelection:C,allowsResizing:u,resizeColumnAriaLabel:d,maxHeight:f,stickyHeader:p,onResizeStart:m,onResize:h,onResizeEnd:_,onKeyDownCapture:v,sortDescriptor:y,onSortChange:b,className:t},children:(0,o.jsx)(`div`,{className:(0,i.cx)(`gap-md flex flex-col`,t),children:e})})}v.displayName=`Table`;function y({className:e,children:t,...n}){let r=(0,a.useRef)(null),[c,l]=(0,a.useState)(0);return(0,a.useLayoutEffect)(()=>{let e=r.current;e&&l(e.clientWidth)},[]),(0,s.useResizeObserver)({ref:r,onResize:()=>{let e=r.current;e&&l(e.clientWidth)}}),(0,o.jsx)(m,{value:{isResizable:!0,tableWidth:c},children:(0,o.jsx)(`div`,{ref:r,"data-spark-component":`resizable-table-container`,className:(0,i.cx)(`relative w-full overflow-auto`,e),...n,children:t})})}y.displayName=`ResizableTableContainer`;var b=`[data-spark-component="table-cell"]`;function x(e){return!e||!(e instanceof Element)?!1:!!e.closest(`[role="combobox"],select,[data-spark-component="dropdown-trigger"],[data-spark-component="combobox-input"]`)}function S(e){if(!e||!(e instanceof Element))return!1;let t=e.closest(`[role="combobox"],[data-spark-component="dropdown-trigger"],[data-spark-component="combobox-input"]`);return t?t.getAttribute(`aria-expanded`)===`true`:!1}var C=`a[href], button:not([disabled]), input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), [tabindex]`;function w(e){return!e||!(e instanceof Element)?null:e.closest(b)}function T(e){return e.getAttribute(`data-table-cell-kind`)===`selection`}function E(e){return Array.from(e.querySelectorAll(C)).filter(t=>!(t===e||t.hasAttribute(`disabled`)||t.getAttribute(`aria-disabled`)===`true`||t.getAttribute(`hidden`)!==null))}function D(e,t){for(let n of E(e)){let e=`data-prev-tabindex`;if(!t)n.hasAttribute(e)||n.setAttribute(e,n.getAttribute(`tabindex`)??``),n.setAttribute(`tabindex`,`-1`);else{let t=n.getAttribute(e);if(t===null)continue;n.removeAttribute(e),t===``?n.removeAttribute(`tabindex`):n.setAttribute(`tabindex`,t)}}}function O(e){let t=Array.from(e.querySelectorAll(b));for(let e of t)D(e,!1)}function ee({ref:e,gridProps:t,onKeyDownCapture:n,onFocusCapture:r}){let[i,o]=(0,a.useState)(`grid`),s=(0,a.useRef)(`grid`),c=(0,a.useRef)(null),u=(0,a.useRef)(!1),d=(0,a.useMemo)(()=>{let{onKeyDown:a,...d}=t,f=e=>{c.current=e,s.current=`interaction`,o(`interaction`),D(e,!0)};return(0,l.mergeProps)(d,{onKeyDown:e=>{if(s.current===`interaction`&&(e.key===`ArrowLeft`||e.key===`ArrowRight`||e.key===`ArrowUp`||e.key===`ArrowDown`)){let e=c.current,t=document.activeElement;if(e&&t instanceof Node&&e.contains(t))return}s.current===`interaction`&&(e.key===`ArrowUp`||e.key===`ArrowDown`)&&x(e.target)&&w(e.target)===c.current||a?.(e)},onKeyDownCapture:e=>{if(n?.(e),s.current===`interaction`&&e.key===`Tab`){let t=w(e.target);t&&t===c.current&&e.stopPropagation();return}if(x(e.target)&&s.current===`interaction`&&(e.key===`ArrowLeft`||e.key===`ArrowRight`||e.key===`ArrowUp`||e.key===`ArrowDown`)){let t=w(e.target);if(t&&t===c.current)return}if(s.current===`interaction`&&(e.key===`ArrowLeft`||e.key===`ArrowRight`||e.key===`ArrowUp`||e.key===`ArrowDown`)){let t=w(e.target);if(t&&t===c.current){e.stopPropagation();return}}if(s.current===`grid`&&e.key===`ArrowRight`){let t=w(e.target);if(t){let n=t.closest(`tr`);if(n){let r=Array.from(n.querySelectorAll(b));if(r.length>0&&r[r.length-1]===t){e.preventDefault(),e.stopPropagation(),n.focus();return}}}}if(s.current===`grid`&&e.key===`Enter`){let t=w(e.target);if(!t||T(t))return;let n=E(t);if(n.length===0)return;e.preventDefault(),e.stopPropagation(),f(t),n[0]?.focus();return}if(s.current===`grid`&&e.key===`F2`){let t=w(e.target);if(!t||T(t))return;let n=E(t);if(n.length===0)return;e.preventDefault(),e.stopPropagation(),f(t),n[0]?.focus();return}if(s.current===`interaction`&&e.key===`Escape`){if(S(e.target))return;let t=c.current;if(!t)return;e.preventDefault(),e.stopPropagation(),s.current=`grid`,o(`grid`),t.focus()}if(s.current===`interaction`&&e.key===`F2`){let t=c.current;if(!t)return;e.preventDefault(),e.stopPropagation(),s.current=`grid`,o(`grid`),t.focus()}},onBlurCapture:t=>{if(s.current!==`interaction`)return;let n=e.current;if(!n)return;let r=t.relatedTarget;r instanceof Node&&n.contains(r)||(c.current=null,s.current=`grid`,o(`grid`))},onFocusCapture:t=>{r?.(t);let n=u.current;u.current=!1;let i=e.current,a=w(t.target);if(s.current===`interaction`&&c.current&&i){let e=!!(a&&a!==c.current),n=!a&&t.target instanceof Element&&i.contains(t.target)&&!c.current.contains(t.target);(e||n)&&(s.current=`grid`,o(`grid`),n&&(c.current=null))}if(!a)return;c.current=a;let l=t.target instanceof Element?t.target:null,d=a.matches(b),p=s.current===`grid`,m=!!(l&&l!==a&&a.contains(l)),h=E(a).length>0;p&&d&&m&&h&&!n&&queueMicrotask(()=>a.focus()),n&&p&&m&&d&&h&&!T(a)&&f(a)},onPointerDownCapture:e=>{let t=w(e.target);t?.matches(b)&&e.target instanceof Element&&e.target!==t&&t.contains(e.target)&&(u.current=!0)},"data-table-keyboard-mode":i})},[t,i,e,r,n]);return(0,a.useEffect)(()=>{s.current=i;let t=e.current;if(t){if(i===`grid`){O(t),c.current?.focus?.();return}O(t),c.current&&D(c.current,!0)}},[i,e]),{gridProps:d,keyboardMode:i}}var k=(0,i.cva)([`h-sz-64 min-w-sz-64`,`relative group/column first:rounded-l-xl last:rounded-r-xl bg-neutral-container`,`pl-lg pr-lg py-sm text-left outline-none box-border`,`cursor-default`,`data-focus-visible:u-outline data-focus-visible:-outline-offset-2`],{variants:{checkbox:{true:[`w-sz-64 min-w-sz-64 max-w-sz-64`,`px-0 align-middle`]},resizable:{true:[`pr-xl`]}},defaultVariants:{checkbox:!1,resizable:!1}}),te=(0,i.cva)([`flex flex-1 justify-between items-center gap-md`,`font-inherit text-left text-inherit`,`whitespace-nowrap text-ellipsis`,`border-transparent`,`data-focus-visible:u-outline data-focus-visible:outline-offset-2`],{variants:{},defaultVariants:{}});(0,i.cva)([`empty:italic empty:text-center empty:text-body-2 empty:py-lg`],{variants:{},defaultVariants:{}});var ne=(0,i.cva)([`p-lg outline-none box-border default:overflow-hidden`,`border-b-sm border-outline [tr:last-child>&]:border-b-0`,`[-webkit-tap-highlight-color:transparent]`,`data-focus-visible:u-outline-inset data-focus-visible:outline-dashed`],{variants:{checkbox:{true:[`w-sz-64 py-sm px-0 align-middle`]}},defaultVariants:{checkbox:!1}}),re=(0,i.cva)([`pointer-events-none`,`[&_td]:h-sz-16 [&_td]:p-0 [&_td]:border-0 [&_td]:border-b-0 [&_td]:bg-surface [&_td]:align-middle`],{variants:{},defaultVariants:{}}),ie=`button, [role="button"], [role="switch"], [role="checkbox"], [role="option"], input:not([type="hidden"]), select, textarea, [href], [data-spark-component="dropdown-trigger"], [data-spark-component="icon-button"], [data-spark-component="switch"], [data-spark-component="switch-input"], [data-spark-component="combobox-input"]`,ae=`a[href], button:not([disabled]), input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), [tabindex]`;function oe(e){if(!e||!(e instanceof Element))return!1;let t=e;return t.matches(ie)||t.closest(ie)!==null}function se(e){return e?e instanceof Element?e:e instanceof Text?e.parentElement:null:null}function ce(e){for(let t of e.querySelectorAll(ae))if(t!==e&&!t.hasAttribute(`disabled`)&&t.getAttribute(`aria-disabled`)!==`true`&&t.getAttribute(`hidden`)===null)return!0;return!1}function le(e){let t=se(e);if(!t)return!1;if(oe(t))return!0;let n=t.closest(`[data-spark-component="table-cell"]`);return!n||n.getAttribute(`data-table-cell-kind`)===`selection`?!1:ce(n)}var A=(0,a.createContext)(`grid`);function j({checkboxProps:e,className:t,suppressFocusWalker:n}){let{isSelected:i,isIndeterminate:a,isDisabled:s,onChange:c,...l}=e,u=a===!0?`indeterminate`:!!i;return(0,o.jsx)(`span`,{...n?{"data-react-aria-prevent-focus":!0}:void 0,onClick:e=>e.stopPropagation(),onPointerDown:e=>e.stopPropagation(),className:t??`flex h-full min-h-full items-center justify-center`,children:(0,o.jsx)(r.n,{checked:u,disabled:s,onCheckedChange:c,...l})})}j.displayName=`Table.SelectionCheckbox`;function M({cell:e,state:t,resizeState:n}){let r=(0,a.useRef)(null),{gridCellProps:i}=(0,l.useTableCell)({node:e},t,r),{isFocusVisible:s,focusProps:c}=(0,l.useFocusRing)(),d=(0,a.useContext)(A),f=(0,a.useCallback)(e=>{d===`interaction`&&(e.key!==` `&&e.key!==`Enter`||e.stopPropagation())},[d]),{onKeyDownCapture:p,...m}=i,h=(0,a.useCallback)(e=>{[`ArrowLeft`,`ArrowRight`,`ArrowUp`,`ArrowDown`].includes(e.key)||p?.(e)},[p]),g=(0,u.useTableSelectionCheckbox)({key:e.parentKey??e.key},t),_=t.collection.columns[e.index??0]?.key??null,v=_?n?.columnWidths?.get?.(_):void 0;return e.props?.isSelectionCell?(0,o.jsx)(`td`,{...(0,l.mergeProps)(m,{onKeyDownCapture:h},c,{onKeyDown:f}),ref:r,"data-spark-component":`table-cell`,"data-table-cell-kind":`selection`,className:ne({checkbox:!0}),"data-focus-visible":s||void 0,children:(0,o.jsx)(j,{suppressFocusWalker:d===`grid`,checkboxProps:g.checkboxProps})}):(0,o.jsx)(`td`,{...(0,l.mergeProps)(m,{onKeyDownCapture:h},c,{onKeyDown:f}),ref:r,"data-spark-component":`table-cell`,className:ne(),"data-focus-visible":s||void 0,style:v?{width:v}:void 0,children:e.rendered})}M.displayName=`Table.BodyCellRenderer`;function N(e){if(e)return t=>{le((0,s.getEventTarget)(t.nativeEvent))||e(t)}}function P({item:e,state:t,resizeState:n}){let r=(0,a.useRef)(null),{rowProps:s,isSelected:c}=(0,l.useTableRow)({node:e},t,r),{isFocusVisible:u,focusProps:d}=(0,l.useFocusRing)(),{onClick:f,onPointerDown:p,onMouseDown:m,onPointerUp:h,onPointerCancel:g,..._}=s,v=(0,i.cx)(`outline-none box-border data-focus-visible:u-outline-inset data-focus-visible:outline-dashed`,_.className,c&&`bg-support-container text-on-support-container`);return(0,o.jsx)(`tr`,{...(0,l.mergeProps)(_,d),onPointerDown:N(p),onMouseDown:N(m),onPointerUp:N(h),onPointerCancel:N(g),onClick:N(f),ref:r,"data-spark-component":`table-row`,"data-selected":c||void 0,"data-focus-visible":u||void 0,className:v,tabIndex:-1,children:[...e.childNodes].map(e=>(0,o.jsx)(M,{cell:e,state:t,resizeState:n},e.key))})}P.displayName=`Table.BodyRowRenderer`;function F({column:e,ariaLabel:t,resizeState:n,resizeCallbacks:r}){let s=(0,a.useRef)(null),{resizerProps:c,inputProps:l,isResizing:d}=(0,u.useTableColumnResize)({column:e,"aria-label":t??`Resize column`,onResizeStart:r.onResizeStart,onResize:r.onResize,onResizeEnd:r.onResizeEnd},n,s);return(0,o.jsx)(`div`,{role:`presentation`,className:(0,i.cx)(`cursor-col-resize absolute inset-y-lg right-0 flex w-lg items-center justify-center`,`after:block after:h-full after:w-[2px] after:bg-outline after:transition-all after:duration-75`,`has-[input:focus-visible]:after:u-outline has-[input:focus-visible]:after:outline-offset-2`,d&&`after:bg-outline-high after:scale-120`),"data-resizable-direction":`both`,...c,children:(0,o.jsx)(`input`,{ref:s,disabled:!d,...l})})}F.displayName=`Table.ColumnResizer`;function I({state:e}){let{checkboxProps:t}=(0,u.useTableSelectAllCheckbox)(e),{collection:n,selectionManager:r}=e,i=r.selectedKeys,a=n,s=a.body,c=s==null?new Set(n.getKeys()):new Set([...a.getChildren(s.key)].map(e=>e.key)),l=i===`all`?c:i,d=[...c].filter(e=>l.has(e)).length,f=c.size,p=f>0&&d===f,m=d>0&&d<f,{isSelected:h,isIndeterminate:g,onChange:_,...v}=t,y=e=>{(e.key===` `||e.key===`Enter`)&&e.stopPropagation(),e.key===`Enter`&&(e.preventDefault(),t.isDisabled||_?.(!p))};return(0,o.jsx)(j,{checkboxProps:{...v,isSelected:p,isIndeterminate:m,onChange:_,onKeyDown:y}})}I.displayName=`Table.HeaderSelectionCheckbox`;var L=(0,i.cx)(`sticky top-0 z-sticky`);function R({column:e,state:n,resizeState:r,stickyHeader:s,resizeCallbacks:c,isLastColumnInRow:u=!1}){let m=(0,a.useRef)(null),{resizeColumnAriaLabel:h}=_(),{columnHeaderProps:g}=(0,l.useTableColumnHeader)({node:e},n,m),{isFocusVisible:v,focusProps:y}=(0,l.useFocusRing)(),b=e.props?.allowsResizing!==!1&&!u,x=r?.columnWidths?.get?.(e.key),S=!!(r&&b);if(e.props?.isSelectionCell)return(0,o.jsx)(`th`,{...g,ref:m,role:`columnheader`,className:(0,i.cx)(k({checkbox:!0}),s&&L),"data-spark-component":`table-column`,"data-table-selection-columnheader":!0,"data-focus-visible":v||void 0,children:(0,o.jsx)(I,{state:n})});let C=!!e.props?.allowsSorting,w=n.sortDescriptor?.column===e.key,T=n.sortDescriptor?.direction??`ascending`,E=w?T===`descending`?(0,o.jsx)(d.ArrowDown,{}):(0,o.jsx)(f.ArrowUp,{}):(0,o.jsx)(p.Sort,{}),D=t=>{C&&(t.key!==`Enter`&&t.key!==` `||(t.preventDefault(),t.stopPropagation(),n.sort?.(e.key)))};return(0,o.jsxs)(`th`,{...(0,l.mergeProps)(g,y),ref:m,role:`columnheader`,className:(0,i.cx)(k({resizable:S}),s&&L),style:x?{width:x}:void 0,"data-spark-component":`table-column`,"data-focus-visible":v||void 0,onKeyDown:D,children:[(0,o.jsxs)(`div`,{className:te(),children:[(0,o.jsx)(`button`,{type:`button`,className:(0,i.cx)(`gap-md flex min-w-0 flex-1 items-center text-left`,`focus-visible:u-outline outline-none`,`bg-transparent p-0 border-0`),onKeyDown:D,children:(0,o.jsx)(`span`,{className:`min-w-0 overflow-hidden text-ellipsis whitespace-nowrap`,children:e.rendered})}),C?(0,o.jsx)(`span`,{"aria-hidden":`true`,className:(0,i.cx)(`shrink-0 opacity-dim-2 group-hover/column:opacity-100`,w&&`opacity-100`),children:(0,o.jsx)(t.t,{size:`sm`,children:E})}):null]}),r&&b?(0,o.jsx)(F,{column:e,ariaLabel:typeof h==`function`?h(e):h,resizeState:r,resizeCallbacks:c}):null]})}R.displayName=`Table.ColumnHeader`;function z({item:e,state:t,resizeState:n,stickyHeader:r,resizeCallbacks:i}){let s=(0,a.useRef)(null),{rowProps:c}=(0,l.useTableHeaderRow)({node:e},t,s),u=[...e.childNodes];return(0,o.jsx)(`tr`,{...c,ref:s,children:u.map((e,a)=>(0,o.jsx)(R,{column:e,state:t,resizeState:n,stickyHeader:r,resizeCallbacks:i,isLastColumnInRow:a===u.length-1},e.key))})}z.displayName=`Table.HeaderRowRenderer`;function B({className:e,children:t,stickyHeader:n,...r}){let u=!!n,d=(0,a.useRef)(null),f=h(),p=r.selectionMode===`multiple`,m=(0,c.useTableState)({...r,showSelectionCheckboxes:r.selectionMode===`multiple`,children:t}),g=(0,c.useTableColumnResizeState)({tableWidth:f.tableWidth},m),_=f.isResizable&&r.allowsResizing!==!1?g:null,{gridProps:v}=(0,l.useTable)({...r},m,d),y=m.collection.headerRows,b=[...m.collection.body.childNodes],x=m.collection.body.props?.renderEmptyState,S=m.collection.columns.length||1,C=b.length>0||!!x,{rowGroupProps:w}=(0,l.useTableRowGroup)(),{rowGroupProps:T}=(0,l.useTableRowGroup)(),{gridProps:E,keyboardMode:D}=ee({ref:d,gridProps:v,onKeyDownCapture:r.onKeyDownCapture,onFocusCapture:r.onFocusCapture});return(0,o.jsx)(A,{value:D,children:(0,o.jsxs)(`table`,{...(0,l.mergeProps)(E,(0,s.filterDOMProps)(r,{global:!0})),ref:d,"data-spark-component":`table`,className:(0,i.cx)(`default:w-full`,p?`table-fixed`:void 0,`border-separate border-spacing-y-0`,`bg-surface`,`outline-none`,`text-body-1`,`forced-color-adjust-none`,`data-focus-visible:u-outline-inset`,`has-[>[data-empty]]:h-full`,e),children:[(0,o.jsx)(`thead`,{...w,"data-spark-component":`table-header`,children:y.map(e=>(0,o.jsx)(z,{item:e,state:m,resizeState:_,stickyHeader:u,resizeCallbacks:{onResizeStart:r.onResizeStart,onResize:r.onResize,onResizeEnd:r.onResizeEnd}},e.key))}),(0,o.jsxs)(`tbody`,{...T,"data-spark-component":`table-body`,children:[C?(0,o.jsx)(`tr`,{"aria-hidden":`true`,className:re(),role:`presentation`,"data-spark-component":`table-body-spacer`,children:(0,o.jsx)(`td`,{colSpan:S,role:`presentation`})}):null,b.length===0&&x?(0,o.jsx)(`tr`,{"data-empty":!0,children:(0,o.jsx)(`td`,{colSpan:S,children:x({isEmpty:!0})})}):null,b.map(e=>(0,o.jsx)(P,{item:e,state:m,resizeState:_},e.key))]})]})})}B.displayName=`Table.Grid.Inner`;function ue(e){return typeof e==`number`?`${e}px`:e}function V({"aria-label":e,"aria-labelledby":t,className:n,children:r}){let{allowsResizing:i=!0,maxHeight:a,stickyHeader:s,onResizeStart:c,onResize:l,onResizeEnd:u,onKeyDownCapture:d,sortDescriptor:f,onSortChange:p,className:m,...h}=_(),g=a==null?void 0:{maxHeight:ue(a)},v=n??m,b={...h,...e!=null&&{"aria-label":e},...t!=null&&{"aria-labelledby":t},sortDescriptor:f,onSortChange:p,onKeyDownCapture:d,className:v,stickyHeader:s},x=B;return i?(0,o.jsx)(y,{className:v,style:g,onResizeStart:c,onResize:l,onResizeEnd:u,children:(0,o.jsx)(x,{...b,children:r})}):(0,o.jsx)(`div`,{className:`relative w-full overflow-auto`,style:g,children:(0,o.jsx)(x,{...b,children:r})})}V.displayName=`Table.Grid`;function H(e){return(0,o.jsx)(c.TableBody,{...e})}H.displayName=`Table.Body`,H.getCollectionNode=c.TableBody.getCollectionNode;var U=(0,a.createContext)(null);function W(){let e=(0,a.useContext)(U);if(!e)throw Error(`Table.BulkBar subcomponents must be used within Table.BulkBar`);return e}function G({children:e,className:t,rootProps:n,...r}){let{selectedCount:a,totalCount:s,onClearSelection:c,onSelectAll:l,hasMultiplePages:u}=_();return(0,o.jsx)(U,{value:{selectedCount:a,totalCount:s,onClearSelection:c,onSelectAll:l,hasMultiplePages:u},children:(0,o.jsx)(`div`,{role:`toolbar`,"aria-label":r[`aria-label`]??`Table bulk actions`,"data-spark-component":`table-bulk-bar`,className:(0,i.cx)(`gap-lg min-h-sz-64 flex w-full flex-wrap items-center justify-between`,`rounded-lg`,`bg-support-container text-on-support-container p-lg`,t),...n,children:e})})}function K({children:e}){return W(),(0,o.jsx)(`span`,{className:`text-body-1-highlight`,children:e})}function q({className:e,children:t,...r}){let{selectedCount:a,onClearSelection:s,hasMultiplePages:c}=W();return c?(0,o.jsx)(n.t,{size:`sm`,design:`ghost`,intent:`support`,underline:!0,ariaDisabled:a===0,onClick:s,className:(0,i.cx)(`text-body-2`,e),...r,children:t}):null}function de({className:e,children:t,...r}){let{selectedCount:a,totalCount:s,onSelectAll:c,hasMultiplePages:l}=W();return l?(0,o.jsx)(n.t,{size:`sm`,design:`ghost`,intent:`support`,underline:!0,ariaDisabled:s==null||c==null||a>=s,onClick:c,className:(0,i.cx)(`text-body-2`,e),...r,children:t}):null}G.displayName=`Table.BulkBar`;var J=G;J.displayName=`Table.BulkBar`,K.displayName=`Table.BulkBarSelectedCount`,q.displayName=`Table.BulkBarClearButton`,de.displayName=`Table.BulkBarSelectAllButton`;function Y(e){return(0,o.jsx)(c.Cell,{...e})}Y.displayName=`Table.Cell`,Y.getCollectionNode=c.Cell.getCollectionNode;function X({label:e,allowsResizing:t=!0,...n}){return null}X.displayName=`Table.Column`,X.getCollectionNode=function*(e,t){let n=e.title??e.label??e.children??null,r=e.textValue||(typeof n==`string`?n:``)||e[`aria-label`],i=yield{type:`column`,key:e.id??null,hasChildNodes:!!e.childColumns||!!e.title&&a.default.Children.count(e.children)>0,rendered:n,textValue:r,props:{...e,title:e.title??e.label,allowsResizing:e.allowsResizing},*childNodes(){if(e.childColumns)for(let t of e.childColumns)yield{type:`column`,value:t};else if(e.title){let t=[];a.default.Children.forEach(e.children,e=>{t.push({type:`column`,element:e})}),yield*t}},shouldInvalidate(e){return o(e),!1}},o=e=>{for(let t of i)t.hasChildNodes||e.columns.push(t)};o(t)};function Z(e){return(0,o.jsx)(c.TableHeader,{...e})}Z.displayName=`Table.Header`,Z.getCollectionNode=c.TableHeader.getCollectionNode;function Q(e){return null}Q.displayName=`Table.Row`,Q.getCollectionNode=function*(e,t){let{children:n,textValue:r,UNSTABLE_childItems:i}=e;yield{type:`item`,key:e.id??null,props:e,textValue:r,"aria-label":e[`aria-label`],hasChildNodes:!0,*childNodes(){if(t.showDragButtons&&(yield{type:`cell`,key:`header-drag`,props:{isDragButtonCell:!0}}),t.showSelectionCheckboxes&&t.selectionMode!==`none`&&(yield{type:`cell`,key:`header`,props:{isSelectionCell:!0}}),typeof n==`function`){for(let e of t.columns)yield{type:`cell`,element:n(e.key),key:e.key};if(i)for(let e of i)yield{type:`item`,value:e}}else{let e=[],r=[],i=0;if(a.default.Children.forEach(n,n=>{if(n)if(n.type===Q){if(e.length<t.columns.length)throw Error(`All of a Row's child Cells must be positioned before any child Rows.`);r.push({type:`item`,element:n})}else e.push({type:`cell`,element:n}),i+=n.props?.colSpan??1}),i!==t.columns.length)throw Error(`Cell count must match column count. Found ${i} cells and ${t.columns.length} columns.`);yield*e,yield*r}},shouldInvalidate(e){return e.columns.length!==t.columns.length||e.columns.some((e,n)=>e.key!==t.columns[n].key)||e.showSelectionCheckboxes!==t.showSelectionCheckboxes||e.showDragButtons!==t.showDragButtons||e.selectionMode!==t.selectionMode}}};function fe(e,t,n,r){let i=e[n],a=t[n];if(i===a)return 0;let o;return o=typeof i==`number`&&typeof a==`number`?i<a?-1:1:String(i).localeCompare(String(a)),r===`descending`?-o:o}function pe(e,t={}){let{initialSort:n,compare:r}=t,[i,o]=(0,a.useState)(()=>n?{column:n.column,direction:n.direction}:{column:`id`,direction:`ascending`});return{sortDescriptor:i,onSortChange:o,setSortDescriptor:o,sortedItems:(0,a.useMemo)(()=>{let t=i.column;if(!t)return[...e];let n=r??fe,a=i.direction??`ascending`;return[...e].sort((e,r)=>n(e,r,t,a))},[e,i.column,i.direction,r])}}function me(e,t){let{pageSize:n,initialPage:r=1,getId:i}=t,[o,s]=(0,a.useState)(r),[c,l]=(0,a.useState)(()=>new Set),u=e.length,d=Math.max(1,Math.ceil(u/n));(0,a.useEffect)(()=>{s(e=>e<1?1:e>d?d:e)},[d]);let f=o;f<1?f=1:f>d&&(f=d);let p=(0,a.useMemo)(()=>{let t=(f-1)*n,r=t+n;return e.slice(t,r)},[e,f,n]),m=(0,a.useMemo)(()=>{let t=i??(e=>{let t=e.id;if(t==null)throw Error("useTablePagination: item.id is undefined. Provide a `getId` option to extract a stable key.");return t});return new Set(e.map(e=>t(e)))},[i,e]),h=(0,a.useMemo)(()=>{let e=i??(e=>{let t=e.id;if(t==null)throw Error("useTablePagination: item.id is undefined. Provide a `getId` option to extract a stable key.");return t});return new Set(p.map(t=>e(t)))},[i,p]);return{page:f,setPage:s,pageItems:p,totalItems:u,totalPages:d,allKeys:m,selectedKeys:c,onSelectionChange:e=>{let t=e===`all`?new Set(h):new Set(e);l(e=>{let n=new Set(t);for(let t of e)h.has(t)||n.add(t);return n})},onPageChange:e=>{s(e.page)},clearSelection:()=>{l(()=>new Set)}}}var $=Object.assign(v,{Grid:V,Header:Z,Column:X,Body:H,Row:Q,Cell:Y,BulkBar:J,BulkBarSelectedCount:K,BulkBarClearButton:q,BulkBarSelectAllButton:de});$.displayName=`Table`,Z.displayName=`Table.Header`,X.displayName=`Table.Column`,H.displayName=`Table.Body`,Q.displayName=`Table.Row`,Y.displayName=`Table.Cell`,exports.Table=$,exports.TableCompound=$,exports.useTablePagination=me,exports.useTableSort=pe;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/table/index.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { t as e } from "../icon-D05Uqh8_.mjs";
|
|
2
|
-
import { t } from "../button-
|
|
2
|
+
import { t } from "../button-D49vse7F.mjs";
|
|
3
3
|
import { n } from "../checkbox-CbMh-21q.mjs";
|
|
4
4
|
import { cva as r, cx as i } from "class-variance-authority";
|
|
5
5
|
import a, { createContext as o, useCallback as s, useContext as c, useEffect as l, useLayoutEffect as u, useMemo as d, useRef as f, useState as p } from "react";
|
package/dist/tabs/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../slot/index.js`),t=require(`../icon-CRPcdgYp.js`),n=require(`../button-
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../slot/index.js`),t=require(`../icon-CRPcdgYp.js`),n=require(`../button-pz6WB_vb.js`),r=require(`../icon-button-BKVPOP0K.js`),i=require(`../popover-CWZCAwhW.js`);let a=require(`class-variance-authority`),o=require(`react`),s=require(`react/jsx-runtime`),c=require(`@spark-ui/internal-utils`),l=require(`@spark-ui/hooks/use-merge-refs`),u=require(`@spark-ui/icons/ArrowVerticalRight`),d=require(`@spark-ui/icons/ArrowVerticalLeft`),f=require(`@base-ui/react/tabs`),p=require(`@spark-ui/icons/MoreMenuHorizontal`);var m=(0,o.createContext)({}),h=()=>{let e=(0,o.useContext)(m);if(!e)throw Error(`useTabsContext must be used within a TabsContext Provider`);return e},g=(0,a.cva)([`flex`,`data-[orientation=horizontal]:flex-col`,`data-[orientation=vertical]:flex-row`,`max-w-full`]);function _(t){return t?({...t})=>(0,s.jsx)(e.Slot,{...t}):void 0}var v=({intent:e=`support`,size:t=`md`,asChild:n=!1,forceMount:r=!1,orientation:i=`horizontal`,children:a,className:o,ref:c,...l})=>{let u=_(n);return(0,s.jsx)(m,{value:{intent:e,size:t,orientation:i,forceMount:r},children:(0,s.jsx)(f.Tabs.Root,{ref:c,orientation:i,className:g({className:o}),"data-spark-component":`tabs`,render:u,...l,children:a})})};v.displayName=`Tabs`;var y=(0,a.cva)([`w-full p-lg`,`focus-visible:u-outline-inset`],{variants:{forceMount:{true:`data-[hidden]:hidden`,false:``}}}),b=({children:e,asChild:t=!1,className:n,ref:r,forceMount:i,...a})=>{let{forceMount:o}=h(),c=_(t),l=o||i;return(0,s.jsx)(f.Tabs.Panel,{"data-spark-component":`tabs-content`,ref:r,keepMounted:l,className:y({className:n,forceMount:l}),render:c,...a,children:e})};b.displayName=`Tabs.Content`;var x=(0,a.cva)([`relative flex`]),S=(0,a.cva)([`flex w-full`,`data-[orientation=horizontal]:flex-row`,`data-[orientation=vertical]:flex-col`,`overflow-y-hidden u-no-scrollbar data-[orientation=vertical]:overflow-x-hidden`,`after:flex after:shrink after:grow after:border-outline`,`data-[orientation=horizontal]:after:border-b-sm`,`data-[orientation=vertical]:after:border-r-sm`]),C=(0,a.cva)([`h-auto! flex-none`,`border-b-sm border-outline`,`outline-hidden`,`focus-visible:border-none focus-visible:bg-surface-hovered focus-visible:u-outline-inset!`]),w=(e,t)=>{let[n,r]=(0,o.useState)({width:void 0,height:void 0}),i=(0,o.useRef)(null),a=(0,o.useRef)(t);return(0,o.useEffect)(()=>{a.current=t},[t]),(0,o.useEffect)(()=>{let t=e&&`current`in e?e.current:e;if(!(!t||i.current))return i.current=new ResizeObserver(([e])=>{let{inlineSize:t,blockSize:n}=e?.borderBoxSize?.[0]??{};a.current?.(e),r({width:t,height:n})}),i.current.observe(t),()=>{i.current&&i.current.unobserve(t)}},[e,i,a]),n},T=({asChild:e=!1,loop:r=!1,children:i,className:a,ref:c,...l})=>{let p=(0,o.useRef)(null),m=(0,o.useRef)(null),g=c||m,{orientation:v}=h(),y=_(e),{width:b}=w(p),[T,E]=(0,o.useState)({prev:`hidden`,next:`hidden`});(0,o.useEffect)(()=>{typeof g==`function`||!g.current||E(v===`horizontal`?{prev:g.current.scrollWidth>g.current.clientWidth?`visible`:`hidden`,next:g.current.scrollWidth>g.current.clientWidth?`visible`:`hidden`}:{prev:`hidden`,next:`hidden`})},[v,g,b]),(0,o.useEffect)(()=>{if(typeof g==`function`||!g.current||T.prev===`hidden`||r)return;let e=e=>{E({prev:e.scrollLeft>0?`visible`:`disabled`,next:e.scrollLeft+e.clientWidth<e.scrollWidth?`visible`:`disabled`})},t=g.current;return e(t),t.addEventListener(`scroll`,({target:t})=>e(t)),()=>t.removeEventListener(`scroll`,({target:t})=>e(t))},[g,T.prev,r]);let D=()=>{if(typeof g==`function`||!g.current)return;let e=r&&g.current.scrollLeft<=0;g.current.scrollTo({left:e?g.current.scrollLeft+g.current.scrollWidth-g.current.clientWidth:g.current.scrollLeft-g.current.clientWidth,behavior:`smooth`})},O=()=>{if(typeof g==`function`||!g.current)return;let e=r&&g.current.scrollLeft+g.current.clientWidth>=g.current.scrollWidth;g.current.scrollTo({left:e?0:g.current.scrollLeft+g.current.clientWidth,behavior:`smooth`})};return(0,s.jsxs)(`div`,{className:x({className:a}),ref:p,children:[T.prev!==`hidden`&&(0,s.jsx)(n.t,{shape:`square`,intent:`surface`,size:`sm`,className:C(),onClick:D,disabled:T.prev===`disabled`,"aria-label":`Scroll left`,children:(0,s.jsx)(t.t,{children:(0,s.jsx)(d.ArrowVerticalLeft,{})})}),(0,s.jsx)(f.Tabs.List,{"data-spark-component":`tabs-list`,ref:g,className:S(),render:y,loopFocus:r,activateOnFocus:!0,...l,children:i}),T.next!==`hidden`&&(0,s.jsx)(n.t,{shape:`square`,intent:`surface`,size:`sm`,className:C(),onClick:O,disabled:T.next===`disabled`,"aria-label":`Scroll right`,children:(0,s.jsx)(t.t,{children:(0,s.jsx)(u.ArrowVerticalRight,{})})})]})};T.displayName=`Tabs.List`;var E=(0,o.createContext)(void 0),D=()=>{let e=(0,o.useContext)(E);if(!e)throw Error(`TabsPopover components must be used within TabsPopover`);return e},O=(0,o.forwardRef)(({"aria-label":e,children:n,...a},o)=>{let{popoverTriggerRef:c}=D(),u=(0,l.useMergeRefs)(o,c);return(0,s.jsx)(i.t.Trigger,{asChild:!0,...a,children:(0,s.jsx)(r.t,{ref:u,size:`sm`,intent:`surfaceInverse`,design:`ghost`,"aria-label":e,tabIndex:-1,children:(0,s.jsx)(t.t,{children:n||(0,s.jsx)(p.MoreMenuHorizontal,{})})})})});O.displayName=`Popover.Trigger`;var k=(0,o.forwardRef)(({side:e,align:t=`start`,className:n,...r},o)=>{let{popoverSide:c}=D(),l=(0,a.cx)(`gap-sm flex flex-col`,n);return(0,s.jsx)(i.t.Content,{ref:o,...r,side:e??c,align:t,className:l})});k.displayName=`Popover.Content`;var A=({popoverSide:e,popoverTriggerRef:t,children:n})=>{let r=(0,o.useMemo)(()=>({popoverSide:e,popoverTriggerRef:t}),[e,t]);return(0,s.jsx)(E,{value:r,children:n(Object.assign((e=>(0,s.jsx)(E,{value:r,children:(0,s.jsx)(i.t,{...e,children:e.children})})),i.t,{Content:k,Trigger:O}))})};A.displayName=`Popover`;var j=(0,a.cva)([`px-md`,`relative flex flex-none items-center`,`border-outline`,`hover:not-disabled:bg-surface-hovered`,`after:absolute`,`data-[active]:font-medium`,`not-data-[active]:not-disabled:cursor-pointer`,`data-[orientation=horizontal]:border-b-sm data-[orientation=horizontal]:after:inset-x-0 data-[orientation=horizontal]:after:bottom-[-1px] data-[orientation=horizontal]:after:h-sz-2`,`data-[orientation=vertical]:border-r-sm data-[orientation=vertical]:after:inset-y-0 data-[orientation=vertical]:after:right-[-1px] data-[orientation=vertical]:after:w-sz-2`,`focus-visible:border-none focus-visible:bg-surface-hovered focus-visible:u-outline-inset`,`disabled:cursor-not-allowed disabled:opacity-dim-3`,`gap-md [&>*:first-child]:ml-md [&>*:last-child]:mr-md`,`[&>svg:last-child:first-child]:mx-auto`],{variants:{intent:(0,c.makeVariants)({main:[`data-[active]:text-main data-[active]:after:bg-main`],support:[`data-[active]:text-support data-[active]:after:bg-support`]}),size:{xs:[`h-sz-32 min-w-sz-32 text-caption`],sm:[`h-sz-36 min-w-sz-36 text-body-2`],md:[`h-sz-40 min-w-sz-40 text-body-1`]},hasMenu:{true:`pr-3xl`},orientation:{horizontal:``,vertical:``}},compoundVariants:[{hasMenu:!0,orientation:`vertical`,class:`w-full`}],defaultVariants:{intent:`support`,size:`md`,hasMenu:!1,orientation:`horizontal`}}),M=({asChild:e=!1,value:t,disabled:n=!1,children:r,className:i,ref:a,onKeyDown:c,renderMenu:u,...d})=>{let{intent:p,size:m,orientation:g}=h(),v=(0,o.useRef)(null),y=(0,o.useRef)(null),b=_(e),x=(0,l.useMergeRefs)(a,y),S=e=>{e.key===`F10`&&e.shiftKey&&u&&v.current&&(e.preventDefault(),v.current.click()),c?.(e)},C=!!u,w=g===`vertical`?`right`:`bottom`,T=(0,s.jsx)(f.Tabs.Tab,{"data-spark-component":`tabs-trigger`,ref:x,className:j({intent:p,size:m,hasMenu:C,orientation:g??`horizontal`,className:i}),render:b,disabled:n,value:t,onFocus:({target:e})=>e.scrollIntoView({behavior:`smooth`,block:`nearest`,inline:`nearest`}),onKeyDown:S,"aria-haspopup":C?`true`:void 0,...d,children:r});return C?(0,s.jsxs)(`div`,{className:g===`vertical`?`relative w-full`:`relative`,children:[T,(0,s.jsx)(`div`,{className:`right-md mr-md pointer-events-auto absolute top-1/2 -translate-y-1/2`,children:(0,s.jsx)(A,{popoverSide:w,popoverTriggerRef:v,children:e=>u?.({Popover:e})})})]}):T};M.displayName=`Tabs.Trigger`;var N=Object.assign(v,{List:T,Trigger:M,Content:b});N.displayName=`Tabs`,T.displayName=`Tabs.List`,M.displayName=`Tabs.Trigger`,b.displayName=`Tabs.Content`,exports.Tabs=N;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/tabs/index.mjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { Slot as e } from "../slot/index.mjs";
|
|
2
2
|
import { t } from "../icon-D05Uqh8_.mjs";
|
|
3
|
-
import { t as n } from "../button-
|
|
4
|
-
import { t as r } from "../icon-button-
|
|
5
|
-
import { t as i } from "../popover-
|
|
3
|
+
import { t as n } from "../button-D49vse7F.mjs";
|
|
4
|
+
import { t as r } from "../icon-button-Bw0k4nKs.mjs";
|
|
5
|
+
import { t as i } from "../popover-B11eXklt.mjs";
|
|
6
6
|
import { cva as a, cx as o } from "class-variance-authority";
|
|
7
7
|
import { createContext as s, forwardRef as c, useContext as l, useEffect as u, useMemo as d, useRef as f, useState as p } from "react";
|
|
8
8
|
import { jsx as m, jsxs as h } from "react/jsx-runtime";
|
package/dist/toast/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../chunk-C91j1N6u.js`),t=require(`../slot/index.js`),n=require(`../icon-CRPcdgYp.js`),r=require(`../button-
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../chunk-C91j1N6u.js`),t=require(`../slot/index.js`),n=require(`../icon-CRPcdgYp.js`),r=require(`../button-pz6WB_vb.js`),i=require(`../icon-button-BKVPOP0K.js`);let a=require(`class-variance-authority`),o=require(`react`);o=e.t(o);let s=require(`react/jsx-runtime`),c=require(`@spark-ui/icons/Close`),l=require(`@base-ui/react/toast`),u=require(`@spark-ui/icons/AlertFill`),d=require(`@spark-ui/icons/InfoFill`),f=require(`@spark-ui/icons/ValidFill`),p=require(`@spark-ui/icons/WarningFill`);var m=(0,a.cva)([`gap-lg p-md flex w-max !w-[min(400px,calc(100vw-2rem))] flex-col rounded-lg border-md`,`absolute right-0 bottom-0 left-auto mr-0`,`bg-clip-padding shadow-md select-none`,`focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none`,`z-[calc(1000-var(--toast-index))]`,`after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']`,`[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]`,`ease-standard [transition-property:opacity,transform]`,`duration-400`,`data-[starting-style]:[transform:translateY(150%)]`,`data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]`,`data-[ending-style]:duration-250`,`data-[ending-style]:opacity-0`,`data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]`,`data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]`,`data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]`,`data-[limited]:opacity-0`],{variants:{design:{filled:``,tinted:``},intent:{success:``,alert:``,error:``,info:``,neutral:``,main:``,support:``,accent:``,surface:``,surfaceInverse:``}},compoundVariants:[{design:`filled`,intent:`success`,class:[`bg-success text-on-success border-success`]},{design:`filled`,intent:`alert`,class:[`bg-alert text-on-alert border-alert`]},{design:`filled`,intent:`error`,class:[`bg-error text-on-error border-error`]},{design:`filled`,intent:`info`,class:[`bg-info text-on-info border-info`]},{design:`filled`,intent:`neutral`,class:[`bg-neutral text-on-neutral border-neutral`]},{design:`filled`,intent:`main`,class:[`bg-main text-on-main border-main`]},{design:`filled`,intent:`support`,class:[`bg-support text-on-support border-support`]},{design:`filled`,intent:`accent`,class:[`bg-accent text-on-accent border-accent`]},{design:`filled`,intent:`surface`,class:[`bg-surface text-on-surface border-surface`]},{design:`filled`,intent:`surfaceInverse`,class:[`bg-surface-inverse text-on-surface-inverse border-surface-inverse`]},{design:`tinted`,intent:`success`,class:[`bg-success-container text-on-success-container border-success`]},{design:`tinted`,intent:`alert`,class:[`bg-alert-container text-on-alert-container border-alert`]},{design:`tinted`,intent:`error`,class:[`bg-error-container text-on-error-container border-error`]},{design:`tinted`,intent:`info`,class:[`bg-info-container text-on-info-container border-info`]},{design:`tinted`,intent:`neutral`,class:[`bg-neutral-container text-on-neutral-container border-neutral`]},{design:`tinted`,intent:`main`,class:[`bg-main-container text-on-main-container border-main`]},{design:`tinted`,intent:`support`,class:[`bg-support-container text-on-support-container border-support`]},{design:`tinted`,intent:`accent`,class:[`bg-accent-container text-on-accent-container border-accent`]},{design:`tinted`,intent:`surface`,class:[`bg-surface text-on-surface border-surface`]},{design:`tinted`,intent:`surfaceInverse`,class:[`bg-surface-inverse text-on-surface-inverse border-surface-inverse`]}],defaultVariants:{design:`filled`,intent:`neutral`}});function h(e){return e===`surfaceInverse`?`surface`:e===`surface`?`surfaceInverse`:e===`error`?`danger`:e}function g(e){return e===`surfaceInverse`?`surfaceInverse`:e===`surface`?`surface`:e===`error`?`danger`:e}var _=(e,{toastDesign:t,toastIntent:n})=>{if(!e)return{};let{design:r,intent:i,className:o,onClick:s,...c}=e;return{design:r??t,intent:i??h(n),className:(0,a.cx)(`ml-auto`,o),onClick:s,...c}},v=(e,t,n)=>({swipeDirection:[`down`,`right`],toast:e,className:(0,a.cx)(m({design:t,intent:n})),style:{"--gap":`var(--spacing-md)`,"--offset-y":`calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))`}});function y(e){switch(e){case`info`:return(0,s.jsx)(d.InfoFill,{});case`success`:return(0,s.jsx)(f.ValidFill,{});case`alert`:return(0,s.jsx)(p.WarningFill,{});case`error`:return(0,s.jsx)(u.AlertFill,{});default:return(0,s.jsx)(d.InfoFill,{})}}function b({toast:e}){let{icon:t,intent:o=`info`,design:u,action:d,isClosable:f,closeLabel:p=`Close`,compact:m=!1}=e.data??{},h=`tinted`,b=d?.close?l.Toast.Close:l.Toast.Action,x=_(d,{toastDesign:h,toastIntent:o}),S=v(e,h,o),C=t??y(o),w=e=>f?(0,s.jsx)(l.Toast.Close,{className:e,render:(0,s.jsx)(i.t,{"aria-label":p,design:h,intent:g(o),size:`md`}),children:(0,s.jsx)(n.t,{children:(0,s.jsx)(c.Close,{})})}):null,T=()=>{let t=e.data?.title??e.title,n=!!(e.data?.description??e.description);return typeof t!=`string`&&t!==void 0?(0,s.jsx)(l.Toast.Title,{className:n?`text-headline-2`:`text-body-1`,render:(0,s.jsx)(`div`,{}),children:t}):(0,s.jsx)(l.Toast.Title,{className:n?`text-headline-2`:`text-body-1`})},E=()=>{let t=e.data?.description??e.description;return t?typeof t==`string`?(0,s.jsx)(l.Toast.Description,{className:`text-body-1`}):(0,s.jsx)(l.Toast.Description,{className:`text-body-1`,render:(0,s.jsx)(`div`,{}),children:t}):null};return(0,s.jsx)(l.Toast.Root,{...S,children:(0,s.jsxs)(`div`,{className:(0,a.cx)(`flex`,m?`gap-lg items-center`:`gap-md flex-col`),children:[(0,s.jsxs)(`div`,{className:`gap-lg p-md flex grow items-center`,children:[(0,s.jsx)(n.t,{size:`md`,children:C}),(0,s.jsxs)(`div`,{className:(0,a.cx)(`gap-sm flex flex-col`,m&&`flex-1`,!m&&f&&`pr-3xl`),children:[T(),E()]})]}),(0,s.jsxs)(`div`,{className:(0,a.cx)(`flex`),children:[d&&(0,s.jsx)(b,{render:(0,s.jsx)(r.t,{...x}),children:d.label}),m&&w()]}),!m&&w(`top-md right-md absolute`)]})},e.id)}function x(){let e=l.Toast.useToastManager(),t=o.useCallback(()=>{e.toasts.forEach(({id:t})=>e.close(t))},[e]);return o.useMemo(()=>({...e,closeAll:t}),[e,t])}function S(){let{toasts:e}=x();return e.map(e=>(0,s.jsx)(b,{toast:e},e.id))}function C({children:e,limit:t=3,...n}){return(0,s.jsxs)(l.Toast.Provider,{limit:t,...n,children:[(0,s.jsx)(l.Toast.Portal,{children:(0,s.jsx)(l.Toast.Viewport,{className:(0,a.cx)(`z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end`),children:(0,s.jsx)(S,{})})}),e]})}function w({children:e,onClick:n,asChild:r=!1,title:i,description:a,timeout:o=5e3,design:c=`filled`,intent:l=`neutral`,isClosable:u=!0,icon:d,action:f,compact:p,priority:m=`low`}){let h=x(),g=r?t.Slot:`button`;function _(e){n?.(e),h.add({title:i,description:a,timeout:o,priority:m,data:{design:c,intent:l,isClosable:u,...d&&{icon:d},action:f,...p!==void 0&&{compact:p}}})}return(0,s.jsx)(g,{...!r&&{type:`button`},onClick:_,children:e})}var T=l.Toast.createToastManager;exports.ToastProvider=C,exports.ToastTrigger=w,exports.createToastManager=T,exports.useToastManager=x;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/toast/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../src/toast/Toast.styles.ts","../../src/toast/Toast.tsx","../../src/toast/useToastManager.ts","../../src/toast/index.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const toastStyles = cva(\n [\n 'gap-lg p-md flex w-max !w-[min(400px,calc(100vw-2rem))] flex-col rounded-lg border-md',\n 'absolute right-0 bottom-0 left-auto mr-0',\n 'bg-clip-padding shadow-md select-none',\n 'focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none',\n 'z-[calc(1000-var(--toast-index))]',\n \"after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']\",\n // Stack effect while not focused\n '[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]',\n // Scale and translate\n 'ease-standard [transition-property:opacity,transform]',\n 'duration-400',\n // Present when the toast is animating in.\n 'data-[starting-style]:[transform:translateY(150%)]',\n // Expanded: Present when the toast is expanded in the viewport.\n 'data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]',\n // Present when the toast is animating out.\n 'data-[ending-style]:duration-250',\n 'data-[ending-style]:opacity-0',\n 'data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]',\n 'data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n 'data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n // Limited: Present when the toast was removed due to exceeding the limit.\n 'data-[limited]:opacity-0',\n ],\n {\n variants: {\n design: {\n filled: '',\n tinted: '',\n },\n intent: {\n success: '',\n alert: '',\n error: '',\n info: '',\n neutral: '',\n main: '',\n support: '',\n accent: '',\n surface: '',\n surfaceInverse: '',\n },\n },\n compoundVariants: [\n // Filled variants\n {\n design: 'filled',\n intent: 'success',\n class: ['bg-success text-on-success border-success'],\n },\n {\n design: 'filled',\n intent: 'alert',\n class: ['bg-alert text-on-alert border-alert'],\n },\n {\n design: 'filled',\n intent: 'error',\n class: ['bg-error text-on-error border-error'],\n },\n {\n design: 'filled',\n intent: 'info',\n class: ['bg-info text-on-info border-info'],\n },\n {\n design: 'filled',\n intent: 'neutral',\n class: ['bg-neutral text-on-neutral border-neutral'],\n },\n {\n design: 'filled',\n intent: 'main',\n class: ['bg-main text-on-main border-main'],\n },\n {\n design: 'filled',\n intent: 'support',\n class: ['bg-support text-on-support border-support'],\n },\n {\n design: 'filled',\n intent: 'accent',\n class: ['bg-accent text-on-accent border-accent'],\n },\n {\n design: 'filled',\n intent: 'surface',\n class: ['bg-surface text-on-surface border-surface'],\n },\n {\n design: 'filled',\n intent: 'surfaceInverse',\n class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n },\n\n // Tinted variants\n {\n design: 'tinted',\n intent: 'success',\n class: ['bg-success-container text-on-success-container border-success'],\n },\n {\n design: 'tinted',\n intent: 'alert',\n class: ['bg-alert-container text-on-alert-container border-alert'],\n },\n {\n design: 'tinted',\n intent: 'error',\n class: ['bg-error-container text-on-error-container border-error'],\n },\n {\n design: 'tinted',\n intent: 'info',\n class: ['bg-info-container text-on-info-container border-info'],\n },\n {\n design: 'tinted',\n intent: 'neutral',\n class: ['bg-neutral-container text-on-neutral-container border-neutral'],\n },\n {\n design: 'tinted',\n intent: 'main',\n class: ['bg-main-container text-on-main-container border-main'],\n },\n {\n design: 'tinted',\n intent: 'support',\n class: ['bg-support-container text-on-support-container border-support'],\n },\n {\n design: 'tinted',\n intent: 'accent',\n class: ['bg-accent-container text-on-accent-container border-accent'],\n },\n {\n design: 'tinted',\n intent: 'surface',\n class: ['bg-surface text-on-surface border-surface'],\n },\n {\n design: 'tinted',\n intent: 'surfaceInverse',\n class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n },\n ],\n defaultVariants: {\n design: 'filled',\n intent: 'neutral',\n },\n }\n)\n\nexport type ToastVariantProps = VariantProps<typeof toastStyles>\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Button, ButtonProps } from '@spark-ui/components/button'\nimport { Icon } from '@spark-ui/components/icon'\nimport { IconButton } from '@spark-ui/components/icon-button'\nimport { AlertFill } from '@spark-ui/icons/AlertFill'\nimport { Close } from '@spark-ui/icons/Close'\nimport { InfoFill } from '@spark-ui/icons/InfoFill'\nimport { ValidFill } from '@spark-ui/icons/ValidFill'\nimport { WarningFill } from '@spark-ui/icons/WarningFill'\nimport { cx } from 'class-variance-authority'\n\nimport { toastStyles } from './Toast.styles'\nimport type { ToastData, ToastDesign, ToastIntent, ToastObject } from './types'\n\nfunction getButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n if (intent === 'surfaceInverse') return 'surface'\n if (intent === 'surface') return 'surfaceInverse'\n if (intent === 'error') return 'danger'\n\n return intent as ButtonProps['intent']\n}\n\nfunction getCloseButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n if (intent === 'surfaceInverse') return 'surfaceInverse'\n if (intent === 'surface') return 'surface'\n if (intent === 'error') return 'danger'\n\n return intent as ButtonProps['intent']\n}\n\nconst getActionProps = (\n action: ToastData['action'],\n { toastDesign, toastIntent }: { toastDesign?: ToastDesign; toastIntent?: ToastIntent }\n): ButtonProps => {\n if (!action) return {}\n\n const { design, intent, className, onClick, ...rest } = action\n\n return {\n design: design ?? toastDesign,\n intent: intent ?? getButtonIntent(toastIntent),\n className: cx('ml-auto', className),\n onClick,\n ...rest,\n }\n}\n\nconst getToastRootProps = (toast: ToastObject, design: ToastDesign, intent: ToastIntent) => ({\n swipeDirection: ['down', 'right'] as ['down', 'right'],\n toast,\n className: cx(toastStyles({ design, intent })),\n style: {\n ['--gap' as string]: 'var(--spacing-md)',\n ['--offset-y' as string]:\n 'calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))',\n },\n})\n\nfunction getDefaultIcon(intent: ToastIntent): React.ReactNode {\n switch (intent) {\n case 'info':\n return <InfoFill />\n case 'success':\n return <ValidFill />\n case 'alert':\n return <WarningFill />\n case 'error':\n return <AlertFill />\n case 'main':\n case 'support':\n case 'accent':\n case 'neutral':\n case 'surface':\n case 'surfaceInverse':\n default:\n return <InfoFill />\n }\n}\n\nexport function Toast({ toast }: { toast: ToastObject }) {\n const {\n icon: ToastIcon,\n intent = 'info',\n design: _design, // deprecated prop, ignored\n action,\n isClosable,\n closeLabel = 'Close',\n compact = false,\n } = toast.data ?? {}\n\n // Always use 'tinted' design regardless of prop value\n const design = 'tinted' as const\n\n const ActionButton = action?.close ? BaseToast.Close : BaseToast.Action\n const actionProps = getActionProps(action, { toastDesign: design, toastIntent: intent })\n const rootProps = getToastRootProps(toast, design, intent)\n\n // Use provided icon or default icon based on intent\n const icon = ToastIcon ?? getDefaultIcon(intent)\n\n const getCloseButton = (className?: string) => {\n if (!isClosable) return null\n\n return (\n <BaseToast.Close\n className={className}\n render={\n <IconButton\n aria-label={closeLabel}\n design={design}\n intent={getCloseButtonIntent(intent)}\n size=\"md\"\n />\n }\n >\n <Icon>\n <Close />\n </Icon>\n </BaseToast.Close>\n )\n }\n\n const renderTitle = () => {\n // Check ToastData first for JSX, then fallback to toast.title (string)\n const title = toast.data?.title ?? toast.title\n const hasDescription = !!(toast.data?.description ?? toast.description)\n\n if (typeof title !== 'string' && title !== undefined) {\n return (\n <BaseToast.Title\n className={hasDescription ? 'text-headline-2' : 'text-body-1'}\n render={<div />}\n >\n {title}\n </BaseToast.Title>\n )\n }\n\n return <BaseToast.Title className={hasDescription ? 'text-headline-2' : 'text-body-1'} />\n }\n\n const renderDescription = () => {\n // Check ToastData first for JSX, then fallback to toast.description (string)\n const description = toast.data?.description ?? toast.description\n\n if (!description) return null\n\n if (typeof description !== 'string') {\n return (\n <BaseToast.Description className=\"text-body-1\" render={<div />}>\n {description}\n </BaseToast.Description>\n )\n }\n\n return <BaseToast.Description className=\"text-body-1\" />\n }\n\n return (\n <BaseToast.Root key={toast.id} {...rootProps}>\n <div className={cx('flex', compact ? 'gap-lg items-center' : 'gap-md flex-col')}>\n <div className=\"gap-lg p-md flex grow items-center\">\n {/* Icon */}\n <Icon size=\"md\">{icon}</Icon>\n {/* Title and description */}\n <div\n className={cx(\n 'gap-sm flex flex-col',\n compact && 'flex-1',\n !compact && isClosable && 'pr-3xl'\n )}\n >\n {renderTitle()}\n {renderDescription()}\n </div>\n </div>\n\n <div className={cx('flex')}>\n {/* Action button */}\n {action && (\n <ActionButton render={<Button {...actionProps} />}>{action.label}</ActionButton>\n )}\n {/* Close button - compact layout only */}\n {compact && getCloseButton()}\n </div>\n\n {/* Close button - default layout only */}\n {!compact && getCloseButton('top-md right-md absolute')}\n </div>\n </BaseToast.Root>\n )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport * as React from 'react'\n\nimport type { UseToastManagerReturnValue } from './types'\n\nexport function useToastManager(): UseToastManagerReturnValue {\n const baseToastManager = BaseToast.useToastManager()\n\n const closeAll = React.useCallback((): void => {\n baseToastManager.toasts.forEach(({ id }) => baseToastManager.close(id))\n }, [baseToastManager])\n\n return {\n ...baseToastManager,\n closeAll,\n } as UseToastManagerReturnValue\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Slot } from '@spark-ui/components/slot'\nimport { cx } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { Toast } from './Toast'\nimport type { ToastData, ToastObject } from './types'\nimport { useToastManager } from './useToastManager'\n\nexport * from './types'\n\nfunction ToastList() {\n const { toasts } = useToastManager()\n\n return toasts.map(toast => <Toast key={toast.id} toast={toast} />)\n}\n\ninterface ToastProviderProps extends React.ComponentProps<typeof BaseToast.Provider> {\n children: React.ReactNode\n}\n\n/**\n * A provider component that manages and displays temporary notification messages to users.\n */\nexport function ToastProvider({ children, limit = 3, ...props }: ToastProviderProps) {\n return (\n <BaseToast.Provider limit={limit} {...props}>\n <BaseToast.Portal>\n <BaseToast.Viewport\n className={cx(\n 'z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end'\n )}\n >\n <ToastList />\n </BaseToast.Viewport>\n </BaseToast.Portal>\n {children}\n </BaseToast.Provider>\n )\n}\n\ninterface ToastTriggerProps\n extends\n Omit<React.ComponentPropsWithRef<'button'>, 'title'>,\n Pick<ToastObject, 'priority'>,\n Pick<ToastData, 'design' | 'intent' | 'icon' | 'isClosable' | 'action' | 'compact'> {\n children: React.ReactNode\n asChild?: boolean\n title: string | React.ReactNode\n description?: string | React.ReactNode\n timeout?: number\n}\n\nexport function ToastTrigger({\n children,\n onClick,\n asChild = false,\n title,\n description,\n timeout = 5000,\n design = 'filled',\n intent = 'neutral',\n isClosable = true,\n icon,\n action,\n compact,\n priority = 'low',\n}: ToastTriggerProps) {\n const toastManager = useToastManager()\n\n const Component = asChild ? Slot : 'button'\n\n function createToast(e: React.MouseEvent<HTMLButtonElement>) {\n onClick?.(e)\n toastManager.add({\n title,\n description,\n timeout,\n priority,\n data: {\n design,\n intent,\n isClosable,\n ...(icon && { icon }),\n action,\n ...(compact !== undefined && { compact }),\n },\n })\n }\n\n return (\n <Component {...(!asChild && { type: 'button' })} onClick={createToast}>\n {children}\n </Component>\n )\n}\n\nexport type ToastManager = ReturnType<typeof BaseToast.createToastManager>\n\nexport const createToastManager: () => ToastManager = BaseToast.createToastManager\n\nexport { useToastManager }\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../src/toast/Toast.styles.ts","../../src/toast/Toast.tsx","../../src/toast/useToastManager.ts","../../src/toast/index.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const toastStyles = cva(\n [\n 'gap-lg p-md flex w-max !w-[min(400px,calc(100vw-2rem))] flex-col rounded-lg border-md',\n 'absolute right-0 bottom-0 left-auto mr-0',\n 'bg-clip-padding shadow-md select-none',\n 'focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none',\n 'z-[calc(1000-var(--toast-index))]',\n \"after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']\",\n // Stack effect while not focused\n '[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]',\n // Scale and translate\n 'ease-standard [transition-property:opacity,transform]',\n 'duration-400',\n // Present when the toast is animating in.\n 'data-[starting-style]:[transform:translateY(150%)]',\n // Expanded: Present when the toast is expanded in the viewport.\n 'data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]',\n // Present when the toast is animating out.\n 'data-[ending-style]:duration-250',\n 'data-[ending-style]:opacity-0',\n 'data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]',\n 'data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n 'data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n // Limited: Present when the toast was removed due to exceeding the limit.\n 'data-[limited]:opacity-0',\n ],\n {\n variants: {\n design: {\n filled: '',\n tinted: '',\n },\n intent: {\n success: '',\n alert: '',\n error: '',\n info: '',\n neutral: '',\n main: '',\n support: '',\n accent: '',\n surface: '',\n surfaceInverse: '',\n },\n },\n compoundVariants: [\n // Filled variants\n {\n design: 'filled',\n intent: 'success',\n class: ['bg-success text-on-success border-success'],\n },\n {\n design: 'filled',\n intent: 'alert',\n class: ['bg-alert text-on-alert border-alert'],\n },\n {\n design: 'filled',\n intent: 'error',\n class: ['bg-error text-on-error border-error'],\n },\n {\n design: 'filled',\n intent: 'info',\n class: ['bg-info text-on-info border-info'],\n },\n {\n design: 'filled',\n intent: 'neutral',\n class: ['bg-neutral text-on-neutral border-neutral'],\n },\n {\n design: 'filled',\n intent: 'main',\n class: ['bg-main text-on-main border-main'],\n },\n {\n design: 'filled',\n intent: 'support',\n class: ['bg-support text-on-support border-support'],\n },\n {\n design: 'filled',\n intent: 'accent',\n class: ['bg-accent text-on-accent border-accent'],\n },\n {\n design: 'filled',\n intent: 'surface',\n class: ['bg-surface text-on-surface border-surface'],\n },\n {\n design: 'filled',\n intent: 'surfaceInverse',\n class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n },\n\n // Tinted variants\n {\n design: 'tinted',\n intent: 'success',\n class: ['bg-success-container text-on-success-container border-success'],\n },\n {\n design: 'tinted',\n intent: 'alert',\n class: ['bg-alert-container text-on-alert-container border-alert'],\n },\n {\n design: 'tinted',\n intent: 'error',\n class: ['bg-error-container text-on-error-container border-error'],\n },\n {\n design: 'tinted',\n intent: 'info',\n class: ['bg-info-container text-on-info-container border-info'],\n },\n {\n design: 'tinted',\n intent: 'neutral',\n class: ['bg-neutral-container text-on-neutral-container border-neutral'],\n },\n {\n design: 'tinted',\n intent: 'main',\n class: ['bg-main-container text-on-main-container border-main'],\n },\n {\n design: 'tinted',\n intent: 'support',\n class: ['bg-support-container text-on-support-container border-support'],\n },\n {\n design: 'tinted',\n intent: 'accent',\n class: ['bg-accent-container text-on-accent-container border-accent'],\n },\n {\n design: 'tinted',\n intent: 'surface',\n class: ['bg-surface text-on-surface border-surface'],\n },\n {\n design: 'tinted',\n intent: 'surfaceInverse',\n class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n },\n ],\n defaultVariants: {\n design: 'filled',\n intent: 'neutral',\n },\n }\n)\n\nexport type ToastVariantProps = VariantProps<typeof toastStyles>\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Button, ButtonProps } from '@spark-ui/components/button'\nimport { Icon } from '@spark-ui/components/icon'\nimport { IconButton } from '@spark-ui/components/icon-button'\nimport { AlertFill } from '@spark-ui/icons/AlertFill'\nimport { Close } from '@spark-ui/icons/Close'\nimport { InfoFill } from '@spark-ui/icons/InfoFill'\nimport { ValidFill } from '@spark-ui/icons/ValidFill'\nimport { WarningFill } from '@spark-ui/icons/WarningFill'\nimport { cx } from 'class-variance-authority'\n\nimport { toastStyles } from './Toast.styles'\nimport type { ToastData, ToastDesign, ToastIntent, ToastObject } from './types'\n\nfunction getButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n if (intent === 'surfaceInverse') return 'surface'\n if (intent === 'surface') return 'surfaceInverse'\n if (intent === 'error') return 'danger'\n\n return intent as ButtonProps['intent']\n}\n\nfunction getCloseButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n if (intent === 'surfaceInverse') return 'surfaceInverse'\n if (intent === 'surface') return 'surface'\n if (intent === 'error') return 'danger'\n\n return intent as ButtonProps['intent']\n}\n\nconst getActionProps = (\n action: ToastData['action'],\n { toastDesign, toastIntent }: { toastDesign?: ToastDesign; toastIntent?: ToastIntent }\n): ButtonProps => {\n if (!action) return {}\n\n const { design, intent, className, onClick, ...rest } = action\n\n return {\n design: design ?? toastDesign,\n intent: intent ?? getButtonIntent(toastIntent),\n className: cx('ml-auto', className),\n onClick,\n ...rest,\n }\n}\n\nconst getToastRootProps = (toast: ToastObject, design: ToastDesign, intent: ToastIntent) => ({\n swipeDirection: ['down', 'right'] as ['down', 'right'],\n toast,\n className: cx(toastStyles({ design, intent })),\n style: {\n ['--gap' as string]: 'var(--spacing-md)',\n ['--offset-y' as string]:\n 'calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))',\n },\n})\n\nfunction getDefaultIcon(intent: ToastIntent): React.ReactNode {\n switch (intent) {\n case 'info':\n return <InfoFill />\n case 'success':\n return <ValidFill />\n case 'alert':\n return <WarningFill />\n case 'error':\n return <AlertFill />\n case 'main':\n case 'support':\n case 'accent':\n case 'neutral':\n case 'surface':\n case 'surfaceInverse':\n default:\n return <InfoFill />\n }\n}\n\nexport function Toast({ toast }: { toast: ToastObject }) {\n const {\n icon: ToastIcon,\n intent = 'info',\n design: _design, // deprecated prop, ignored\n action,\n isClosable,\n closeLabel = 'Close',\n compact = false,\n } = toast.data ?? {}\n\n // Always use 'tinted' design regardless of prop value\n const design = 'tinted' as const\n\n const ActionButton = action?.close ? BaseToast.Close : BaseToast.Action\n const actionProps = getActionProps(action, { toastDesign: design, toastIntent: intent })\n const rootProps = getToastRootProps(toast, design, intent)\n\n // Use provided icon or default icon based on intent\n const icon = ToastIcon ?? getDefaultIcon(intent)\n\n const getCloseButton = (className?: string) => {\n if (!isClosable) return null\n\n return (\n <BaseToast.Close\n className={className}\n render={\n <IconButton\n aria-label={closeLabel}\n design={design}\n intent={getCloseButtonIntent(intent)}\n size=\"md\"\n />\n }\n >\n <Icon>\n <Close />\n </Icon>\n </BaseToast.Close>\n )\n }\n\n const renderTitle = () => {\n // Check ToastData first for JSX, then fallback to toast.title (string)\n const title = toast.data?.title ?? toast.title\n const hasDescription = !!(toast.data?.description ?? toast.description)\n\n if (typeof title !== 'string' && title !== undefined) {\n return (\n <BaseToast.Title\n className={hasDescription ? 'text-headline-2' : 'text-body-1'}\n render={<div />}\n >\n {title}\n </BaseToast.Title>\n )\n }\n\n return <BaseToast.Title className={hasDescription ? 'text-headline-2' : 'text-body-1'} />\n }\n\n const renderDescription = () => {\n // Check ToastData first for JSX, then fallback to toast.description (string)\n const description = toast.data?.description ?? toast.description\n\n if (!description) return null\n\n if (typeof description !== 'string') {\n return (\n <BaseToast.Description className=\"text-body-1\" render={<div />}>\n {description}\n </BaseToast.Description>\n )\n }\n\n return <BaseToast.Description className=\"text-body-1\" />\n }\n\n return (\n <BaseToast.Root key={toast.id} {...rootProps}>\n <div className={cx('flex', compact ? 'gap-lg items-center' : 'gap-md flex-col')}>\n <div className=\"gap-lg p-md flex grow items-center\">\n {/* Icon */}\n <Icon size=\"md\">{icon}</Icon>\n {/* Title and description */}\n <div\n className={cx(\n 'gap-sm flex flex-col',\n compact && 'flex-1',\n !compact && isClosable && 'pr-3xl'\n )}\n >\n {renderTitle()}\n {renderDescription()}\n </div>\n </div>\n\n <div className={cx('flex')}>\n {/* Action button */}\n {action && (\n <ActionButton render={<Button {...actionProps} />}>{action.label}</ActionButton>\n )}\n {/* Close button - compact layout only */}\n {compact && getCloseButton()}\n </div>\n\n {/* Close button - default layout only */}\n {!compact && getCloseButton('top-md right-md absolute')}\n </div>\n </BaseToast.Root>\n )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport * as React from 'react'\n\nimport type { UseToastManagerReturnValue } from './types'\n\nexport function useToastManager(): UseToastManagerReturnValue {\n const baseToastManager = BaseToast.useToastManager()\n\n const closeAll = React.useCallback((): void => {\n baseToastManager.toasts.forEach(({ id }) => baseToastManager.close(id))\n }, [baseToastManager])\n\n // Memoize the returned object so its reference is stable across renders,\n // preventing infinite loops when used as a useEffect dependency.\n return React.useMemo(\n () => ({ ...baseToastManager, closeAll }) as UseToastManagerReturnValue,\n [baseToastManager, closeAll]\n )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Slot } from '@spark-ui/components/slot'\nimport { cx } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { Toast } from './Toast'\nimport type { ToastData, ToastObject } from './types'\nimport { useToastManager } from './useToastManager'\n\nexport * from './types'\n\nfunction ToastList() {\n const { toasts } = useToastManager()\n\n return toasts.map(toast => <Toast key={toast.id} toast={toast} />)\n}\n\ninterface ToastProviderProps extends React.ComponentProps<typeof BaseToast.Provider> {\n children: React.ReactNode\n}\n\n/**\n * A provider component that manages and displays temporary notification messages to users.\n */\nexport function ToastProvider({ children, limit = 3, ...props }: ToastProviderProps) {\n return (\n <BaseToast.Provider limit={limit} {...props}>\n <BaseToast.Portal>\n <BaseToast.Viewport\n className={cx(\n 'z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end'\n )}\n >\n <ToastList />\n </BaseToast.Viewport>\n </BaseToast.Portal>\n {children}\n </BaseToast.Provider>\n )\n}\n\ninterface ToastTriggerProps\n extends\n Omit<React.ComponentPropsWithRef<'button'>, 'title'>,\n Pick<ToastObject, 'priority'>,\n Pick<ToastData, 'design' | 'intent' | 'icon' | 'isClosable' | 'action' | 'compact'> {\n children: React.ReactNode\n asChild?: boolean\n title: string | React.ReactNode\n description?: string | React.ReactNode\n timeout?: number\n}\n\nexport function ToastTrigger({\n children,\n onClick,\n asChild = false,\n title,\n description,\n timeout = 5000,\n design = 'filled',\n intent = 'neutral',\n isClosable = true,\n icon,\n action,\n compact,\n priority = 'low',\n}: ToastTriggerProps) {\n const toastManager = useToastManager()\n\n const Component = asChild ? Slot : 'button'\n\n function createToast(e: React.MouseEvent<HTMLButtonElement>) {\n onClick?.(e)\n toastManager.add({\n title,\n description,\n timeout,\n priority,\n data: {\n design,\n intent,\n isClosable,\n ...(icon && { icon }),\n action,\n ...(compact !== undefined && { compact }),\n },\n })\n }\n\n return (\n <Component {...(!asChild && { type: 'button' })} onClick={createToast}>\n {children}\n </Component>\n )\n}\n\nexport type ToastManager = ReturnType<typeof BaseToast.createToastManager>\n\nexport const createToastManager: () => ToastManager = BaseToast.createToastManager\n\nexport { useToastManager }\n"],"mappings":"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"}
|
package/dist/toast/index.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Slot as e } from "../slot/index.mjs";
|
|
2
2
|
import { t } from "../icon-D05Uqh8_.mjs";
|
|
3
|
-
import { t as n } from "../button-
|
|
4
|
-
import { t as r } from "../icon-button-
|
|
3
|
+
import { t as n } from "../button-D49vse7F.mjs";
|
|
4
|
+
import { t as r } from "../icon-button-Bw0k4nKs.mjs";
|
|
5
5
|
import { cva as i, cx as a } from "class-variance-authority";
|
|
6
6
|
import * as o from "react";
|
|
7
7
|
import { jsx as s, jsxs as c } from "react/jsx-runtime";
|
|
@@ -256,10 +256,10 @@ function S() {
|
|
|
256
256
|
let e = u.useToastManager(), t = o.useCallback(() => {
|
|
257
257
|
e.toasts.forEach(({ id: t }) => e.close(t));
|
|
258
258
|
}, [e]);
|
|
259
|
-
return {
|
|
259
|
+
return o.useMemo(() => ({
|
|
260
260
|
...e,
|
|
261
261
|
closeAll: t
|
|
262
|
-
};
|
|
262
|
+
}), [e, t]);
|
|
263
263
|
}
|
|
264
264
|
//#endregion
|
|
265
265
|
//#region src/toast/index.tsx
|
package/dist/toast/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","names":[],"sources":["../../src/toast/Toast.styles.ts","../../src/toast/Toast.tsx","../../src/toast/useToastManager.ts","../../src/toast/index.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const toastStyles = cva(\n [\n 'gap-lg p-md flex w-max !w-[min(400px,calc(100vw-2rem))] flex-col rounded-lg border-md',\n 'absolute right-0 bottom-0 left-auto mr-0',\n 'bg-clip-padding shadow-md select-none',\n 'focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none',\n 'z-[calc(1000-var(--toast-index))]',\n \"after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']\",\n // Stack effect while not focused\n '[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]',\n // Scale and translate\n 'ease-standard [transition-property:opacity,transform]',\n 'duration-400',\n // Present when the toast is animating in.\n 'data-[starting-style]:[transform:translateY(150%)]',\n // Expanded: Present when the toast is expanded in the viewport.\n 'data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]',\n // Present when the toast is animating out.\n 'data-[ending-style]:duration-250',\n 'data-[ending-style]:opacity-0',\n 'data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]',\n 'data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n 'data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n // Limited: Present when the toast was removed due to exceeding the limit.\n 'data-[limited]:opacity-0',\n ],\n {\n variants: {\n design: {\n filled: '',\n tinted: '',\n },\n intent: {\n success: '',\n alert: '',\n error: '',\n info: '',\n neutral: '',\n main: '',\n support: '',\n accent: '',\n surface: '',\n surfaceInverse: '',\n },\n },\n compoundVariants: [\n // Filled variants\n {\n design: 'filled',\n intent: 'success',\n class: ['bg-success text-on-success border-success'],\n },\n {\n design: 'filled',\n intent: 'alert',\n class: ['bg-alert text-on-alert border-alert'],\n },\n {\n design: 'filled',\n intent: 'error',\n class: ['bg-error text-on-error border-error'],\n },\n {\n design: 'filled',\n intent: 'info',\n class: ['bg-info text-on-info border-info'],\n },\n {\n design: 'filled',\n intent: 'neutral',\n class: ['bg-neutral text-on-neutral border-neutral'],\n },\n {\n design: 'filled',\n intent: 'main',\n class: ['bg-main text-on-main border-main'],\n },\n {\n design: 'filled',\n intent: 'support',\n class: ['bg-support text-on-support border-support'],\n },\n {\n design: 'filled',\n intent: 'accent',\n class: ['bg-accent text-on-accent border-accent'],\n },\n {\n design: 'filled',\n intent: 'surface',\n class: ['bg-surface text-on-surface border-surface'],\n },\n {\n design: 'filled',\n intent: 'surfaceInverse',\n class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n },\n\n // Tinted variants\n {\n design: 'tinted',\n intent: 'success',\n class: ['bg-success-container text-on-success-container border-success'],\n },\n {\n design: 'tinted',\n intent: 'alert',\n class: ['bg-alert-container text-on-alert-container border-alert'],\n },\n {\n design: 'tinted',\n intent: 'error',\n class: ['bg-error-container text-on-error-container border-error'],\n },\n {\n design: 'tinted',\n intent: 'info',\n class: ['bg-info-container text-on-info-container border-info'],\n },\n {\n design: 'tinted',\n intent: 'neutral',\n class: ['bg-neutral-container text-on-neutral-container border-neutral'],\n },\n {\n design: 'tinted',\n intent: 'main',\n class: ['bg-main-container text-on-main-container border-main'],\n },\n {\n design: 'tinted',\n intent: 'support',\n class: ['bg-support-container text-on-support-container border-support'],\n },\n {\n design: 'tinted',\n intent: 'accent',\n class: ['bg-accent-container text-on-accent-container border-accent'],\n },\n {\n design: 'tinted',\n intent: 'surface',\n class: ['bg-surface text-on-surface border-surface'],\n },\n {\n design: 'tinted',\n intent: 'surfaceInverse',\n class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n },\n ],\n defaultVariants: {\n design: 'filled',\n intent: 'neutral',\n },\n }\n)\n\nexport type ToastVariantProps = VariantProps<typeof toastStyles>\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Button, ButtonProps } from '@spark-ui/components/button'\nimport { Icon } from '@spark-ui/components/icon'\nimport { IconButton } from '@spark-ui/components/icon-button'\nimport { AlertFill } from '@spark-ui/icons/AlertFill'\nimport { Close } from '@spark-ui/icons/Close'\nimport { InfoFill } from '@spark-ui/icons/InfoFill'\nimport { ValidFill } from '@spark-ui/icons/ValidFill'\nimport { WarningFill } from '@spark-ui/icons/WarningFill'\nimport { cx } from 'class-variance-authority'\n\nimport { toastStyles } from './Toast.styles'\nimport type { ToastData, ToastDesign, ToastIntent, ToastObject } from './types'\n\nfunction getButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n if (intent === 'surfaceInverse') return 'surface'\n if (intent === 'surface') return 'surfaceInverse'\n if (intent === 'error') return 'danger'\n\n return intent as ButtonProps['intent']\n}\n\nfunction getCloseButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n if (intent === 'surfaceInverse') return 'surfaceInverse'\n if (intent === 'surface') return 'surface'\n if (intent === 'error') return 'danger'\n\n return intent as ButtonProps['intent']\n}\n\nconst getActionProps = (\n action: ToastData['action'],\n { toastDesign, toastIntent }: { toastDesign?: ToastDesign; toastIntent?: ToastIntent }\n): ButtonProps => {\n if (!action) return {}\n\n const { design, intent, className, onClick, ...rest } = action\n\n return {\n design: design ?? toastDesign,\n intent: intent ?? getButtonIntent(toastIntent),\n className: cx('ml-auto', className),\n onClick,\n ...rest,\n }\n}\n\nconst getToastRootProps = (toast: ToastObject, design: ToastDesign, intent: ToastIntent) => ({\n swipeDirection: ['down', 'right'] as ['down', 'right'],\n toast,\n className: cx(toastStyles({ design, intent })),\n style: {\n ['--gap' as string]: 'var(--spacing-md)',\n ['--offset-y' as string]:\n 'calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))',\n },\n})\n\nfunction getDefaultIcon(intent: ToastIntent): React.ReactNode {\n switch (intent) {\n case 'info':\n return <InfoFill />\n case 'success':\n return <ValidFill />\n case 'alert':\n return <WarningFill />\n case 'error':\n return <AlertFill />\n case 'main':\n case 'support':\n case 'accent':\n case 'neutral':\n case 'surface':\n case 'surfaceInverse':\n default:\n return <InfoFill />\n }\n}\n\nexport function Toast({ toast }: { toast: ToastObject }) {\n const {\n icon: ToastIcon,\n intent = 'info',\n design: _design, // deprecated prop, ignored\n action,\n isClosable,\n closeLabel = 'Close',\n compact = false,\n } = toast.data ?? {}\n\n // Always use 'tinted' design regardless of prop value\n const design = 'tinted' as const\n\n const ActionButton = action?.close ? BaseToast.Close : BaseToast.Action\n const actionProps = getActionProps(action, { toastDesign: design, toastIntent: intent })\n const rootProps = getToastRootProps(toast, design, intent)\n\n // Use provided icon or default icon based on intent\n const icon = ToastIcon ?? getDefaultIcon(intent)\n\n const getCloseButton = (className?: string) => {\n if (!isClosable) return null\n\n return (\n <BaseToast.Close\n className={className}\n render={\n <IconButton\n aria-label={closeLabel}\n design={design}\n intent={getCloseButtonIntent(intent)}\n size=\"md\"\n />\n }\n >\n <Icon>\n <Close />\n </Icon>\n </BaseToast.Close>\n )\n }\n\n const renderTitle = () => {\n // Check ToastData first for JSX, then fallback to toast.title (string)\n const title = toast.data?.title ?? toast.title\n const hasDescription = !!(toast.data?.description ?? toast.description)\n\n if (typeof title !== 'string' && title !== undefined) {\n return (\n <BaseToast.Title\n className={hasDescription ? 'text-headline-2' : 'text-body-1'}\n render={<div />}\n >\n {title}\n </BaseToast.Title>\n )\n }\n\n return <BaseToast.Title className={hasDescription ? 'text-headline-2' : 'text-body-1'} />\n }\n\n const renderDescription = () => {\n // Check ToastData first for JSX, then fallback to toast.description (string)\n const description = toast.data?.description ?? toast.description\n\n if (!description) return null\n\n if (typeof description !== 'string') {\n return (\n <BaseToast.Description className=\"text-body-1\" render={<div />}>\n {description}\n </BaseToast.Description>\n )\n }\n\n return <BaseToast.Description className=\"text-body-1\" />\n }\n\n return (\n <BaseToast.Root key={toast.id} {...rootProps}>\n <div className={cx('flex', compact ? 'gap-lg items-center' : 'gap-md flex-col')}>\n <div className=\"gap-lg p-md flex grow items-center\">\n {/* Icon */}\n <Icon size=\"md\">{icon}</Icon>\n {/* Title and description */}\n <div\n className={cx(\n 'gap-sm flex flex-col',\n compact && 'flex-1',\n !compact && isClosable && 'pr-3xl'\n )}\n >\n {renderTitle()}\n {renderDescription()}\n </div>\n </div>\n\n <div className={cx('flex')}>\n {/* Action button */}\n {action && (\n <ActionButton render={<Button {...actionProps} />}>{action.label}</ActionButton>\n )}\n {/* Close button - compact layout only */}\n {compact && getCloseButton()}\n </div>\n\n {/* Close button - default layout only */}\n {!compact && getCloseButton('top-md right-md absolute')}\n </div>\n </BaseToast.Root>\n )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport * as React from 'react'\n\nimport type { UseToastManagerReturnValue } from './types'\n\nexport function useToastManager(): UseToastManagerReturnValue {\n const baseToastManager = BaseToast.useToastManager()\n\n const closeAll = React.useCallback((): void => {\n baseToastManager.toasts.forEach(({ id }) => baseToastManager.close(id))\n }, [baseToastManager])\n\n return {\n ...baseToastManager,\n closeAll,\n } as UseToastManagerReturnValue\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Slot } from '@spark-ui/components/slot'\nimport { cx } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { Toast } from './Toast'\nimport type { ToastData, ToastObject } from './types'\nimport { useToastManager } from './useToastManager'\n\nexport * from './types'\n\nfunction ToastList() {\n const { toasts } = useToastManager()\n\n return toasts.map(toast => <Toast key={toast.id} toast={toast} />)\n}\n\ninterface ToastProviderProps extends React.ComponentProps<typeof BaseToast.Provider> {\n children: React.ReactNode\n}\n\n/**\n * A provider component that manages and displays temporary notification messages to users.\n */\nexport function ToastProvider({ children, limit = 3, ...props }: ToastProviderProps) {\n return (\n <BaseToast.Provider limit={limit} {...props}>\n <BaseToast.Portal>\n <BaseToast.Viewport\n className={cx(\n 'z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end'\n )}\n >\n <ToastList />\n </BaseToast.Viewport>\n </BaseToast.Portal>\n {children}\n </BaseToast.Provider>\n )\n}\n\ninterface ToastTriggerProps\n extends\n Omit<React.ComponentPropsWithRef<'button'>, 'title'>,\n Pick<ToastObject, 'priority'>,\n Pick<ToastData, 'design' | 'intent' | 'icon' | 'isClosable' | 'action' | 'compact'> {\n children: React.ReactNode\n asChild?: boolean\n title: string | React.ReactNode\n description?: string | React.ReactNode\n timeout?: number\n}\n\nexport function ToastTrigger({\n children,\n onClick,\n asChild = false,\n title,\n description,\n timeout = 5000,\n design = 'filled',\n intent = 'neutral',\n isClosable = true,\n icon,\n action,\n compact,\n priority = 'low',\n}: ToastTriggerProps) {\n const toastManager = useToastManager()\n\n const Component = asChild ? Slot : 'button'\n\n function createToast(e: React.MouseEvent<HTMLButtonElement>) {\n onClick?.(e)\n toastManager.add({\n title,\n description,\n timeout,\n priority,\n data: {\n design,\n intent,\n isClosable,\n ...(icon && { icon }),\n action,\n ...(compact !== undefined && { compact }),\n },\n })\n }\n\n return (\n <Component {...(!asChild && { type: 'button' })} onClick={createToast}>\n {children}\n </Component>\n )\n}\n\nexport type ToastManager = ReturnType<typeof BaseToast.createToastManager>\n\nexport const createToastManager: () => ToastManager = BaseToast.createToastManager\n\nexport { useToastManager }\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.mjs","names":[],"sources":["../../src/toast/Toast.styles.ts","../../src/toast/Toast.tsx","../../src/toast/useToastManager.ts","../../src/toast/index.tsx"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority'\n\nexport const toastStyles = cva(\n [\n 'gap-lg p-md flex w-max !w-[min(400px,calc(100vw-2rem))] flex-col rounded-lg border-md',\n 'absolute right-0 bottom-0 left-auto mr-0',\n 'bg-clip-padding shadow-md select-none',\n 'focus-visible:ring-focus focus-visible:ring-2 focus-visible:outline-none',\n 'z-[calc(1000-var(--toast-index))]',\n \"after:absolute after:bottom-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']\",\n // Stack effect while not focused\n '[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)+calc(min(var(--toast-index),10)*-16px)))_scale(calc(max(0,1-(var(--toast-index)*0.1))))]',\n // Scale and translate\n 'ease-standard [transition-property:opacity,transform]',\n 'duration-400',\n // Present when the toast is animating in.\n 'data-[starting-style]:[transform:translateY(150%)]',\n // Expanded: Present when the toast is expanded in the viewport.\n 'data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y)))]',\n // Present when the toast is animating out.\n 'data-[ending-style]:duration-250',\n 'data-[ending-style]:opacity-0',\n 'data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]',\n 'data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n 'data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]',\n // Limited: Present when the toast was removed due to exceeding the limit.\n 'data-[limited]:opacity-0',\n ],\n {\n variants: {\n design: {\n filled: '',\n tinted: '',\n },\n intent: {\n success: '',\n alert: '',\n error: '',\n info: '',\n neutral: '',\n main: '',\n support: '',\n accent: '',\n surface: '',\n surfaceInverse: '',\n },\n },\n compoundVariants: [\n // Filled variants\n {\n design: 'filled',\n intent: 'success',\n class: ['bg-success text-on-success border-success'],\n },\n {\n design: 'filled',\n intent: 'alert',\n class: ['bg-alert text-on-alert border-alert'],\n },\n {\n design: 'filled',\n intent: 'error',\n class: ['bg-error text-on-error border-error'],\n },\n {\n design: 'filled',\n intent: 'info',\n class: ['bg-info text-on-info border-info'],\n },\n {\n design: 'filled',\n intent: 'neutral',\n class: ['bg-neutral text-on-neutral border-neutral'],\n },\n {\n design: 'filled',\n intent: 'main',\n class: ['bg-main text-on-main border-main'],\n },\n {\n design: 'filled',\n intent: 'support',\n class: ['bg-support text-on-support border-support'],\n },\n {\n design: 'filled',\n intent: 'accent',\n class: ['bg-accent text-on-accent border-accent'],\n },\n {\n design: 'filled',\n intent: 'surface',\n class: ['bg-surface text-on-surface border-surface'],\n },\n {\n design: 'filled',\n intent: 'surfaceInverse',\n class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n },\n\n // Tinted variants\n {\n design: 'tinted',\n intent: 'success',\n class: ['bg-success-container text-on-success-container border-success'],\n },\n {\n design: 'tinted',\n intent: 'alert',\n class: ['bg-alert-container text-on-alert-container border-alert'],\n },\n {\n design: 'tinted',\n intent: 'error',\n class: ['bg-error-container text-on-error-container border-error'],\n },\n {\n design: 'tinted',\n intent: 'info',\n class: ['bg-info-container text-on-info-container border-info'],\n },\n {\n design: 'tinted',\n intent: 'neutral',\n class: ['bg-neutral-container text-on-neutral-container border-neutral'],\n },\n {\n design: 'tinted',\n intent: 'main',\n class: ['bg-main-container text-on-main-container border-main'],\n },\n {\n design: 'tinted',\n intent: 'support',\n class: ['bg-support-container text-on-support-container border-support'],\n },\n {\n design: 'tinted',\n intent: 'accent',\n class: ['bg-accent-container text-on-accent-container border-accent'],\n },\n {\n design: 'tinted',\n intent: 'surface',\n class: ['bg-surface text-on-surface border-surface'],\n },\n {\n design: 'tinted',\n intent: 'surfaceInverse',\n class: ['bg-surface-inverse text-on-surface-inverse border-surface-inverse'],\n },\n ],\n defaultVariants: {\n design: 'filled',\n intent: 'neutral',\n },\n }\n)\n\nexport type ToastVariantProps = VariantProps<typeof toastStyles>\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Button, ButtonProps } from '@spark-ui/components/button'\nimport { Icon } from '@spark-ui/components/icon'\nimport { IconButton } from '@spark-ui/components/icon-button'\nimport { AlertFill } from '@spark-ui/icons/AlertFill'\nimport { Close } from '@spark-ui/icons/Close'\nimport { InfoFill } from '@spark-ui/icons/InfoFill'\nimport { ValidFill } from '@spark-ui/icons/ValidFill'\nimport { WarningFill } from '@spark-ui/icons/WarningFill'\nimport { cx } from 'class-variance-authority'\n\nimport { toastStyles } from './Toast.styles'\nimport type { ToastData, ToastDesign, ToastIntent, ToastObject } from './types'\n\nfunction getButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n if (intent === 'surfaceInverse') return 'surface'\n if (intent === 'surface') return 'surfaceInverse'\n if (intent === 'error') return 'danger'\n\n return intent as ButtonProps['intent']\n}\n\nfunction getCloseButtonIntent(intent?: ToastIntent): ButtonProps['intent'] {\n if (intent === 'surfaceInverse') return 'surfaceInverse'\n if (intent === 'surface') return 'surface'\n if (intent === 'error') return 'danger'\n\n return intent as ButtonProps['intent']\n}\n\nconst getActionProps = (\n action: ToastData['action'],\n { toastDesign, toastIntent }: { toastDesign?: ToastDesign; toastIntent?: ToastIntent }\n): ButtonProps => {\n if (!action) return {}\n\n const { design, intent, className, onClick, ...rest } = action\n\n return {\n design: design ?? toastDesign,\n intent: intent ?? getButtonIntent(toastIntent),\n className: cx('ml-auto', className),\n onClick,\n ...rest,\n }\n}\n\nconst getToastRootProps = (toast: ToastObject, design: ToastDesign, intent: ToastIntent) => ({\n swipeDirection: ['down', 'right'] as ['down', 'right'],\n toast,\n className: cx(toastStyles({ design, intent })),\n style: {\n ['--gap' as string]: 'var(--spacing-md)',\n ['--offset-y' as string]:\n 'calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y))',\n },\n})\n\nfunction getDefaultIcon(intent: ToastIntent): React.ReactNode {\n switch (intent) {\n case 'info':\n return <InfoFill />\n case 'success':\n return <ValidFill />\n case 'alert':\n return <WarningFill />\n case 'error':\n return <AlertFill />\n case 'main':\n case 'support':\n case 'accent':\n case 'neutral':\n case 'surface':\n case 'surfaceInverse':\n default:\n return <InfoFill />\n }\n}\n\nexport function Toast({ toast }: { toast: ToastObject }) {\n const {\n icon: ToastIcon,\n intent = 'info',\n design: _design, // deprecated prop, ignored\n action,\n isClosable,\n closeLabel = 'Close',\n compact = false,\n } = toast.data ?? {}\n\n // Always use 'tinted' design regardless of prop value\n const design = 'tinted' as const\n\n const ActionButton = action?.close ? BaseToast.Close : BaseToast.Action\n const actionProps = getActionProps(action, { toastDesign: design, toastIntent: intent })\n const rootProps = getToastRootProps(toast, design, intent)\n\n // Use provided icon or default icon based on intent\n const icon = ToastIcon ?? getDefaultIcon(intent)\n\n const getCloseButton = (className?: string) => {\n if (!isClosable) return null\n\n return (\n <BaseToast.Close\n className={className}\n render={\n <IconButton\n aria-label={closeLabel}\n design={design}\n intent={getCloseButtonIntent(intent)}\n size=\"md\"\n />\n }\n >\n <Icon>\n <Close />\n </Icon>\n </BaseToast.Close>\n )\n }\n\n const renderTitle = () => {\n // Check ToastData first for JSX, then fallback to toast.title (string)\n const title = toast.data?.title ?? toast.title\n const hasDescription = !!(toast.data?.description ?? toast.description)\n\n if (typeof title !== 'string' && title !== undefined) {\n return (\n <BaseToast.Title\n className={hasDescription ? 'text-headline-2' : 'text-body-1'}\n render={<div />}\n >\n {title}\n </BaseToast.Title>\n )\n }\n\n return <BaseToast.Title className={hasDescription ? 'text-headline-2' : 'text-body-1'} />\n }\n\n const renderDescription = () => {\n // Check ToastData first for JSX, then fallback to toast.description (string)\n const description = toast.data?.description ?? toast.description\n\n if (!description) return null\n\n if (typeof description !== 'string') {\n return (\n <BaseToast.Description className=\"text-body-1\" render={<div />}>\n {description}\n </BaseToast.Description>\n )\n }\n\n return <BaseToast.Description className=\"text-body-1\" />\n }\n\n return (\n <BaseToast.Root key={toast.id} {...rootProps}>\n <div className={cx('flex', compact ? 'gap-lg items-center' : 'gap-md flex-col')}>\n <div className=\"gap-lg p-md flex grow items-center\">\n {/* Icon */}\n <Icon size=\"md\">{icon}</Icon>\n {/* Title and description */}\n <div\n className={cx(\n 'gap-sm flex flex-col',\n compact && 'flex-1',\n !compact && isClosable && 'pr-3xl'\n )}\n >\n {renderTitle()}\n {renderDescription()}\n </div>\n </div>\n\n <div className={cx('flex')}>\n {/* Action button */}\n {action && (\n <ActionButton render={<Button {...actionProps} />}>{action.label}</ActionButton>\n )}\n {/* Close button - compact layout only */}\n {compact && getCloseButton()}\n </div>\n\n {/* Close button - default layout only */}\n {!compact && getCloseButton('top-md right-md absolute')}\n </div>\n </BaseToast.Root>\n )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport * as React from 'react'\n\nimport type { UseToastManagerReturnValue } from './types'\n\nexport function useToastManager(): UseToastManagerReturnValue {\n const baseToastManager = BaseToast.useToastManager()\n\n const closeAll = React.useCallback((): void => {\n baseToastManager.toasts.forEach(({ id }) => baseToastManager.close(id))\n }, [baseToastManager])\n\n // Memoize the returned object so its reference is stable across renders,\n // preventing infinite loops when used as a useEffect dependency.\n return React.useMemo(\n () => ({ ...baseToastManager, closeAll }) as UseToastManagerReturnValue,\n [baseToastManager, closeAll]\n )\n}\n","import { Toast as BaseToast } from '@base-ui/react/toast'\nimport { Slot } from '@spark-ui/components/slot'\nimport { cx } from 'class-variance-authority'\nimport * as React from 'react'\n\nimport { Toast } from './Toast'\nimport type { ToastData, ToastObject } from './types'\nimport { useToastManager } from './useToastManager'\n\nexport * from './types'\n\nfunction ToastList() {\n const { toasts } = useToastManager()\n\n return toasts.map(toast => <Toast key={toast.id} toast={toast} />)\n}\n\ninterface ToastProviderProps extends React.ComponentProps<typeof BaseToast.Provider> {\n children: React.ReactNode\n}\n\n/**\n * A provider component that manages and displays temporary notification messages to users.\n */\nexport function ToastProvider({ children, limit = 3, ...props }: ToastProviderProps) {\n return (\n <BaseToast.Provider limit={limit} {...props}>\n <BaseToast.Portal>\n <BaseToast.Viewport\n className={cx(\n 'z-toast right-lg bottom-lg text-on-surfa- fixed top-auto mx-auto flex w-fit flex-col items-end'\n )}\n >\n <ToastList />\n </BaseToast.Viewport>\n </BaseToast.Portal>\n {children}\n </BaseToast.Provider>\n )\n}\n\ninterface ToastTriggerProps\n extends\n Omit<React.ComponentPropsWithRef<'button'>, 'title'>,\n Pick<ToastObject, 'priority'>,\n Pick<ToastData, 'design' | 'intent' | 'icon' | 'isClosable' | 'action' | 'compact'> {\n children: React.ReactNode\n asChild?: boolean\n title: string | React.ReactNode\n description?: string | React.ReactNode\n timeout?: number\n}\n\nexport function ToastTrigger({\n children,\n onClick,\n asChild = false,\n title,\n description,\n timeout = 5000,\n design = 'filled',\n intent = 'neutral',\n isClosable = true,\n icon,\n action,\n compact,\n priority = 'low',\n}: ToastTriggerProps) {\n const toastManager = useToastManager()\n\n const Component = asChild ? Slot : 'button'\n\n function createToast(e: React.MouseEvent<HTMLButtonElement>) {\n onClick?.(e)\n toastManager.add({\n title,\n description,\n timeout,\n priority,\n data: {\n design,\n intent,\n isClosable,\n ...(icon && { icon }),\n action,\n ...(compact !== undefined && { compact }),\n },\n })\n }\n\n return (\n <Component {...(!asChild && { type: 'button' })} onClick={createToast}>\n {children}\n </Component>\n )\n}\n\nexport type ToastManager = ReturnType<typeof BaseToast.createToastManager>\n\nexport const createToastManager: () => ToastManager = BaseToast.createToastManager\n\nexport { useToastManager }\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spark-ui/components",
|
|
3
|
-
"version": "17.14.
|
|
3
|
+
"version": "17.14.2",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "Spark (Leboncoin design system) components.",
|
|
6
6
|
"exports": {
|
|
@@ -48,9 +48,9 @@
|
|
|
48
48
|
},
|
|
49
49
|
"dependencies": {
|
|
50
50
|
"@base-ui/react": "^1.5.0",
|
|
51
|
-
"@spark-ui/hooks": "17.14.
|
|
52
|
-
"@spark-ui/icons": "17.14.
|
|
53
|
-
"@spark-ui/internal-utils": "17.14.
|
|
51
|
+
"@spark-ui/hooks": "17.14.2",
|
|
52
|
+
"@spark-ui/icons": "17.14.2",
|
|
53
|
+
"@spark-ui/internal-utils": "17.14.2",
|
|
54
54
|
"@zag-js/pagination": "1.30.0",
|
|
55
55
|
"@zag-js/react": "1.30.0",
|
|
56
56
|
"class-variance-authority": "0.7.1",
|
|
@@ -62,7 +62,7 @@
|
|
|
62
62
|
"react-snap-carousel": "0.5.1"
|
|
63
63
|
},
|
|
64
64
|
"peerDependencies": {
|
|
65
|
-
"@spark-ui/theme-utils": "17.14.
|
|
65
|
+
"@spark-ui/theme-utils": "17.14.2",
|
|
66
66
|
"react": "19.2.4",
|
|
67
67
|
"react-dom": "19.2.4",
|
|
68
68
|
"tailwindcss": "4.1.18"
|