@ngrok/mantle 0.83.4 → 0.83.6
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/agent.json +1 -1
- package/dist/{alert-Br9DAAuo.d.ts → alert-BQdon-PF.d.ts} +2 -2
- package/dist/alert-center.d.ts +1 -1
- package/dist/alert-center.js +1 -1
- package/dist/{alert-qJqF7CzB.js → alert-cszhDIVl.js} +1 -1
- package/dist/alert-dialog.d.ts +1 -2
- package/dist/alert-dialog.js +1 -1
- package/dist/alert.d.ts +1 -1
- package/dist/alert.js +1 -1
- package/dist/area-chart.js +1 -1
- package/dist/bar-chart.js +1 -1
- package/dist/breadcrumb.d.ts +333 -7
- package/dist/breadcrumb.js +1 -1
- package/dist/{button-dgVCHb8N.js → button-Bc0lEOJ2.js} +1 -1
- package/dist/{button-CXW1RQoo.d.ts → button-BsfLZ42S.d.ts} +2 -2
- package/dist/{button-CCkGqE1t.js → button-CNg69RsV.js} +1 -1
- package/dist/button-DiDlvAOp.js +1 -0
- package/dist/{button-DRr-6YHc.d.ts → button-DjsmeoJ2.d.ts} +30 -2
- package/dist/{button-DJ7AAgII.d.ts → button-DkUUma3k.d.ts} +35 -20
- package/dist/button.d.ts +4 -5
- package/dist/button.js +1 -1
- package/dist/calendar.js +1 -1
- package/dist/{chart-DorYMICt.js → chart-G2pIR4uW.js} +1 -1
- package/dist/{code-block-CZWPrV4k.d.ts → code-block-D5eDP379.d.ts} +1 -1
- package/dist/{code-block-CIE0F2fu.js → code-block-Dj9otiLi.js} +2 -2
- package/dist/code-block.d.ts +1 -1
- package/dist/code-block.js +1 -1
- package/dist/code-block_highlight-utils.d.ts +1 -1
- package/dist/code-block_highlight-utils.js +1 -1
- package/dist/command.d.ts +1 -1
- package/dist/command.js +1 -1
- package/dist/data-table.d.ts +5 -5
- package/dist/data-table.js +1 -1
- package/dist/{dialog-32Hq6w6P.js → dialog-BYILOABg.js} +1 -1
- package/dist/{dialog-B6h1BCDL.d.ts → dialog-DJ6jSRyj.d.ts} +4 -4
- package/dist/dialog.d.ts +1 -1
- package/dist/dialog.js +1 -1
- package/dist/field.d.ts +3 -4
- package/dist/field.js +1 -1
- package/dist/line-chart.js +1 -1
- package/dist/llms.txt +1 -1
- package/dist/pagination.d.ts +1 -1
- package/dist/pagination.js +1 -1
- package/dist/sandbar.d.ts +1 -1
- package/dist/sandbar.js +1 -1
- package/dist/scatter-plot.js +1 -1
- package/dist/{sheet-BOSknSN9.js → sheet-CfFXVAzz.js} +1 -1
- package/dist/sheet.d.ts +4 -4
- package/dist/sheet.js +1 -1
- package/dist/sidebar.d.ts +5 -5
- package/dist/sidebar.js +1 -1
- package/dist/split-button.d.ts +2 -2
- package/dist/split-button.js +1 -1
- package/dist/text-area.js +1 -1
- package/dist/theme-switcher.d.ts +1 -1
- package/dist/theme-switcher.js +1 -1
- package/package.json +1 -1
- package/dist/button-BLDjW1u9.js +0 -1
- package/dist/button-DdSKSj1c.d.ts +0 -28
package/dist/agent.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { n as WithAsChild } from "./as-child-D23mGo4f.js";
|
|
2
2
|
import { t as SvgAttributes } from "./icon-D1RY5Tcj.js";
|
|
3
|
-
import { r as ButtonProps } from "./button-
|
|
4
|
-
import { n as IconButtonProps, r as IconButtonAppearance } from "./button-
|
|
3
|
+
import { r as ButtonProps } from "./button-DjsmeoJ2.js";
|
|
4
|
+
import { n as IconButtonProps, r as IconButtonAppearance } from "./button-DkUUma3k.js";
|
|
5
5
|
import { ComponentProps, ReactNode } from "react";
|
|
6
6
|
//#region src/components/alert/alert.d.ts
|
|
7
7
|
declare const intents: readonly ["danger", "important", "info", "success", "warning"];
|
package/dist/alert-center.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { t as WithDataSlot } from "./data-slot-CChfb_cv.js";
|
|
2
|
-
import { t as Alert } from "./alert-
|
|
2
|
+
import { t as Alert } from "./alert-BQdon-PF.js";
|
|
3
3
|
import { ComponentProps, ReactNode } from "react";
|
|
4
4
|
//#region src/components/alert-center/alert-center.d.ts
|
|
5
5
|
/**
|
package/dist/alert-center.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./use-isomorphic-layout-effect-DdTRtMY-.js";import{n as t}from"./compose-refs-BdBMM9ga.js";import{t as n}from"./cx-IiQEAKf5.js";import{t as r}from"./data-slot-EM6s2WEU.js";import{n as i,t as a}from"./alert-qJqF7CzB.js";import{createContext as o,useCallback as s,useContext as c,useEffect as l,useId as u,useMemo as d,useReducer as f,useRef as p,useState as m,useSyncExternalStore as h}from"react";import g from"tiny-invariant";import{jsx as _,jsxs as v}from"react/jsx-runtime";import{createPortal as y}from"react-dom";const b={danger:5,warning:4,important:3,info:2,success:1};function x(e,t){if(t.parentElement===e)return!1;if(typeof e.moveBefore==`function`&&t.isConnected&&e.isConnected)try{return e.moveBefore(t,null),!0}catch{}return e.appendChild(t),!0}function S(e){return e.replace(/\s+/g,` `).trim()}function C(e){let t=e.querySelector(`[data-slot="alert-title"]`);if(t==null)return``;let n=t.cloneNode(!0);if(!(n instanceof Element))return S(t.textContent??``);for(let e of n.querySelectorAll(`button`))e.remove();let r=S(n.textContent??``);for(let e of n.querySelectorAll(`a`))e.remove();let i=S(n.textContent??``);return i===``?r:i}function w(e){return e.toSorted((e,t)=>b[t.intent]-b[e.intent]||e.sequence-t.sequence)}function T(e,t){if(t===0)return``;if(e===``)return`${t} alert${t===1?``:`s`}`;let n=t-1;return n===0?e:`${e}, and ${n} more alert${n===1?``:`s`}`}const E=[];var D=class{#e=new Set;#t=new Map;#n=new Map;#r=new Map;#i=0;#a=E;#o=``;#s=!1;getHost(e){let t=this.#r.get(e);if(t!=null)return t;let n=document.createElement(`div`);return n.style.display=`contents`,n.setAttribute(`data-slot`,`alert-center-item-host`),n.setAttribute(`data-alert-host`,e),this.#r.set(e,n),n}#c=null;captureHostSnapshot(e){if(e!==this.#a[0]?.id)return;let t=this.#r.get(e);t!=null&&t.hasChildNodes()&&(this.#c={id:e,content:t.cloneNode(!0)})}getHostSnapshot=e=>this.#c?.id===e?this.#c.content:null;subscribe=e=>(this.#e.add(e),()=>{this.#e.delete(e)});getSnapshot=()=>this.#a;hasAlert=e=>this.#t.has(e);getTopLabel=()=>this.#o;setTopLabel(e){this.#o!==e&&(this.#o=e,this.#p())}#l=null;requestFocusRestore(e){this.#l=e}flushFocusRestore(){let e=this.#l;e==null||!e.isConnected||(this.#l=null,document.activeElement!==e&&e.focus({preventScroll:!0}))}#u=null;#d=0;getPlacementVersion=()=>this.#d;notifyPlacementChange(){this.#d++,this.#p()}setBarElement(e){this.#u=e}getBarElement=()=>this.#u;getContentMounted=()=>this.#s;setContentMounted(e){this.#s!==e&&(this.#s=e,this.#p())}register(e){g(!this.#t.has(e.id),`AlertCenter.Item id "${e.id}" is already registered by another mounted item — ids must be unique under one <AlertCenter.Root>. Render one item per id, or give each alert its own id.`);let t=this.#n.get(e.id)??this.#i++;this.#n.set(e.id,t);let n={...e,sequence:t};return this.#t.set(e.id,n),this.#f(),()=>{this.#t.get(e.id)===n&&(this.#t.delete(e.id),this.#f())}}#f(){this.#a=w([...this.#t.values()]),this.#p()}#p(){for(let e of this.#e)e()}};const O=o(null),k=o(null);function A(e){let t=c(O);return g(t,`${e} must be rendered inside <AlertCenter.Root>.`),t}function j(e){let t=c(k);return g(t,`${e} must be rendered inside <AlertCenter.Root>.`),t}const M=e=>h(e.subscribe,e.getSnapshot,e.getSnapshot),N=o(!1);function P({store:e}){let t=M(e),n=h(e.subscribe,e.getTopLabel,e.getTopLabel);return _(`div`,{"data-slot":`alert-center-announcer`,className:`sr-only`,role:`status`,"aria-live":`polite`,children:T(n,t.length)})}const F=({children:e,defaultOpen:t,onOpenChange:n,open:r})=>{let[i]=m(()=>new D),a=u(),[o,c]=m(t??!1),l=r??o,f=s(e=>{r??c(e),n?.(e)},[r,n]),p=d(()=>({store:i,contentId:a}),[i,a]),h=d(()=>({isExpanded:l,setExpanded:f}),[l,f]);return v(O.Provider,{value:p,children:[_(k.Provider,{value:h,children:e}),_(P,{store:i})]})},I=({children:t,className:n,id:r,intent:a})=>{let{store:o}=A(`AlertCenter.Item`),s=c(N);g(!s,`AlertCenter.Item cannot be rendered inside another item's children.`);let[l,u]=m(null);return e(()=>{u(o.getHost(r))},[o,r]),e(()=>o.register({id:r,intent:a,className:n}),[o,r,a,n]),e(()=>{o.captureHostSnapshot(r)}),l==null?null:y(_(i,{intent:a,children:_(N.Provider,{value:!0,children:t})}),l)},L=({"data-slot":n,label:i,ref:o,...s})=>{let l=c(N);g(l,`AlertCenter.DismissIconButton must be composed inside an <AlertCenter.Item>'s children.`);let{store:u}=A(`AlertCenter.DismissIconButton`);h(u.subscribe,u.getPlacementVersion,u.getPlacementVersion);let d=p(null),f=t(d,o),[v,y]=m(null);return e(()=>{if(i!=null)return;let e=d.current?.closest(`[data-alert-id]`),t=e==null?``:C(e);y(t===``?null:`Dismiss ${t}`)}),_(a.DismissIconButton,{ref:f,label:i??v??void 0,...s,"data-slot":r(n,`alert-center-dismiss-icon-button`)})};function R(e,t){switch(t){case`show`:return`open`;case`hide`:return e===`closed`?`closed`:`closing`;case`exited`:return e===`closing`?`closed`:e}}function z({present:t}){let[n,r]=f(R,t?`open`:`closed`);e(()=>{r(t?`show`:`hide`)},[t]),l(()=>{if(n!==`closing`)return;let e=window.setTimeout(()=>r(`exited`),200);return()=>window.clearTimeout(e)},[n]);let i=s(e=>{e.target===e.currentTarget&&e.propertyName===`height`&&r(`exited`)},[]);return{isMounted:n!==`closed`,dataState:n===`open`?`open`:`closed`,onExitTransitionEnd:i}}function B({containerRef:t,isAttached:n}){let r=p(null);return e(()=>{let e=t.current;if(!n||e==null)return;let i=e=>{e.target instanceof Element&&(r.current=e.target)},a=t=>{t.relatedTarget instanceof Node&&!e.contains(t.relatedTarget)&&(r.current=null)};return e.addEventListener(`focusin`,i),e.addEventListener(`focusout`,a),()=>{e.removeEventListener(`focusin`,i),e.removeEventListener(`focusout`,a)}},[t,n]),{lastFocusedWithinRef:r}}function V(){let e=document.querySelector(`main, [role="main"]`);e!=null&&(e.hasAttribute(`tabindex`)||(e.tabIndex=-1),e.focus({preventScroll:!0}))}function H({isMounted:t,store:n,topId:r}){let i=p(null),{lastFocusedWithinRef:a}=B({containerRef:i,isAttached:t}),o=p(r);return e(()=>{let e=o.current;if(o.current=r,e==null||r===e)return;let t=a.current;if(n.hasAlert(e)){t instanceof HTMLElement&&document.activeElement!==t&&n.requestFocusRestore(t);return}if(t==null||t.isConnected)return;a.current=null;let s=i.current;if(r==null){V();return}s!=null&&(s.querySelector(`[data-alert-dismiss], [data-alert-expand]`)??s).focus()},[n,r]),{wrapperRef:i}}const U=`gap-2 py-2 pr-2 [&_[data-slot=alert-icon]]:shrink-0`,W={Root:F,Bar:({className:t,"data-slot":i,ref:o,...s})=>{let{store:c,contentId:l}=A(`AlertCenter.Bar`),{isExpanded:u,setExpanded:d}=j(`AlertCenter.Bar`),f=M(c),m=h(c.subscribe,c.getContentMounted,c.getContentMounted),g=f[0]??null,y=g!=null,{isMounted:b,dataState:S,onExitTransitionEnd:w}=z({present:y}),T=p(g);e(()=>{g!=null&&(T.current=g)},[g]);let E=g??T.current,D=p(null);e(()=>{let e=D.current;if(e==null)return;if(g!=null){let t=c.getHost(g.id);t.parentElement!==e&&e.childNodes.length>0&&e.replaceChildren(),x(e,t)&&c.notifyPlacementChange(),c.flushFocusRestore();return}let t=E==null?null:c.getHostSnapshot(E.id);t!=null&&t.parentNode!==e&&e.replaceChildren(t)});let{wrapperRef:O}=H({isMounted:b,store:c,topId:g?.id});if(e(()=>{let e=O.current;c.setTopLabel(y&&e!=null?C(e):``)}),e(()=>{let e=O.current;if(e==null)return;let t=new MutationObserver(()=>{c.setTopLabel(y?C(e):``)});return t.observe(e,{subtree:!0,childList:!0,characterData:!0}),()=>{t.disconnect()}},[c,y,b]),e(()=>()=>{c.setTopLabel(``)},[c]),e(()=>{c.setBarElement(O.current)}),e(()=>()=>{c.setBarElement(null)},[c]),!b||E==null)return null;let k=y?f.length-1:0;return _(`div`,{ref:O,"data-slot":`alert-center-bar-wrapper`,tabIndex:-1,inert:!y,className:`shrink-0 overflow-hidden transition-[height,opacity] duration-200 ease-out [interpolate-size:allow-keywords] starting:h-0 starting:opacity-0 data-state-closed:h-0 data-state-closed:opacity-0 data-state-closed:duration-150 motion-reduce:transition-none`,"data-state":S,onTransitionEnd:w,children:v(a.Root,{ref:o,appearance:`banner`,intent:E.intent,className:n(U,`not-has-data-[slot=alert-description]:[&_[data-alert-dismiss],&_[data-alert-expand]]:top-1/2 not-has-data-[slot=alert-description]:[&_[data-alert-dismiss],&_[data-alert-expand]]:-translate-y-1/2`,`has-data-alert-expand:[&_[data-alert-dismiss]]:right-16 md:has-data-alert-expand:[&_[data-alert-dismiss]]:right-24`,t,E.className),...s,"data-slot":r(i,`alert-center-bar`),"data-placement":`bar`,"data-alert-id":E.id,children:[_(`div`,{ref:D,className:`contents`,"data-slot":`alert-center-bar-mount`}),k>0&&m&&_(a.ExpandButton,{count:k,expanded:u,"aria-controls":l,onClick:()=>d(!u)})]})})},Content:({"aria-label":i=`More alerts`,"aria-labelledby":o,className:s,"data-slot":c,ref:l,...u})=>{let{store:d,contentId:f}=A(`AlertCenter.Content`),{isExpanded:m,setExpanded:h}=j(`AlertCenter.Content`),g=M(d).slice(1),v=g.length>0;e(()=>(d.setContentMounted(!0),()=>{d.setContentMounted(!1)}),[d]);let y=p(v);e(()=>{let e=y.current&&!v;y.current=v,e&&m&&h(!1)},[v,m,h]);let b=p(null),S=t(b,l),{lastFocusedWithinRef:C}=B({containerRef:b,isAttached:v}),w=g.map(e=>e.id).join(` `);return e(()=>{let e=b.current;if(e==null)return;let t=!1;for(let n of e.querySelectorAll(`[data-alert-mount]`)){let e=n.getAttribute(`data-alert-mount`);e!=null&&x(n,d.getHost(e))&&(t=!0)}t&&d.notifyPlacementChange(),d.flushFocusRestore()},[d,w]),e(()=>{let e=C.current;if(e==null)return;if(e.isConnected){let t=b.current;e instanceof HTMLElement&&document.activeElement!==e&&(t==null||!t.contains(e))&&(C.current=null,e.focus({preventScroll:!0}));return}C.current=null;let t=b.current?.querySelector(`[data-alert-dismiss]`);if(t!=null){t.focus();return}let n=d.getBarElement()?.querySelector(`[data-alert-dismiss], [data-alert-expand]`);if(n!=null){n.focus();return}V()},[d,w]),g.length===0?null:_(`div`,{...u,ref:S,"data-slot":r(c,`alert-center-content`),id:f,"data-state":m?`open`:`closed`,className:n(`h-0 overflow-hidden invisible [content-visibility:hidden] transition-[height,visibility,content-visibility] transition-discrete duration-200 ease-out [interpolate-size:allow-keywords] data-state-open:h-auto data-state-open:visible data-state-open:[content-visibility:visible] motion-reduce:transition-none`,s),children:_(`ul`,{"aria-label":o==null?i:void 0,"aria-labelledby":o,className:`flex w-full flex-col`,children:g.map(e=>_(`li`,{children:_(a.Root,{appearance:`banner`,intent:e.intent,className:n(U,e.className),"data-slot":`alert-center-item`,"data-placement":`list`,"data-alert-id":e.id,children:_(`div`,{className:`contents`,"data-alert-mount":e.id})})},e.id))})})},Item:I,DismissIconButton:L};export{W as AlertCenter};
|
|
1
|
+
import{t as e}from"./use-isomorphic-layout-effect-DdTRtMY-.js";import{n as t}from"./compose-refs-BdBMM9ga.js";import{t as n}from"./cx-IiQEAKf5.js";import{t as r}from"./data-slot-EM6s2WEU.js";import{n as i,t as a}from"./alert-cszhDIVl.js";import{createContext as o,useCallback as s,useContext as c,useEffect as l,useId as u,useMemo as d,useReducer as f,useRef as p,useState as m,useSyncExternalStore as h}from"react";import g from"tiny-invariant";import{jsx as _,jsxs as v}from"react/jsx-runtime";import{createPortal as y}from"react-dom";const b={danger:5,warning:4,important:3,info:2,success:1};function x(e,t){if(t.parentElement===e)return!1;if(typeof e.moveBefore==`function`&&t.isConnected&&e.isConnected)try{return e.moveBefore(t,null),!0}catch{}return e.appendChild(t),!0}function S(e){return e.replace(/\s+/g,` `).trim()}function C(e){let t=e.querySelector(`[data-slot="alert-title"]`);if(t==null)return``;let n=t.cloneNode(!0);if(!(n instanceof Element))return S(t.textContent??``);for(let e of n.querySelectorAll(`button`))e.remove();let r=S(n.textContent??``);for(let e of n.querySelectorAll(`a`))e.remove();let i=S(n.textContent??``);return i===``?r:i}function w(e){return e.toSorted((e,t)=>b[t.intent]-b[e.intent]||e.sequence-t.sequence)}function T(e,t){if(t===0)return``;if(e===``)return`${t} alert${t===1?``:`s`}`;let n=t-1;return n===0?e:`${e}, and ${n} more alert${n===1?``:`s`}`}const E=[];var D=class{#e=new Set;#t=new Map;#n=new Map;#r=new Map;#i=0;#a=E;#o=``;#s=!1;getHost(e){let t=this.#r.get(e);if(t!=null)return t;let n=document.createElement(`div`);return n.style.display=`contents`,n.setAttribute(`data-slot`,`alert-center-item-host`),n.setAttribute(`data-alert-host`,e),this.#r.set(e,n),n}#c=null;captureHostSnapshot(e){if(e!==this.#a[0]?.id)return;let t=this.#r.get(e);t!=null&&t.hasChildNodes()&&(this.#c={id:e,content:t.cloneNode(!0)})}getHostSnapshot=e=>this.#c?.id===e?this.#c.content:null;subscribe=e=>(this.#e.add(e),()=>{this.#e.delete(e)});getSnapshot=()=>this.#a;hasAlert=e=>this.#t.has(e);getTopLabel=()=>this.#o;setTopLabel(e){this.#o!==e&&(this.#o=e,this.#p())}#l=null;requestFocusRestore(e){this.#l=e}flushFocusRestore(){let e=this.#l;e==null||!e.isConnected||(this.#l=null,document.activeElement!==e&&e.focus({preventScroll:!0}))}#u=null;#d=0;getPlacementVersion=()=>this.#d;notifyPlacementChange(){this.#d++,this.#p()}setBarElement(e){this.#u=e}getBarElement=()=>this.#u;getContentMounted=()=>this.#s;setContentMounted(e){this.#s!==e&&(this.#s=e,this.#p())}register(e){g(!this.#t.has(e.id),`AlertCenter.Item id "${e.id}" is already registered by another mounted item — ids must be unique under one <AlertCenter.Root>. Render one item per id, or give each alert its own id.`);let t=this.#n.get(e.id)??this.#i++;this.#n.set(e.id,t);let n={...e,sequence:t};return this.#t.set(e.id,n),this.#f(),()=>{this.#t.get(e.id)===n&&(this.#t.delete(e.id),this.#f())}}#f(){this.#a=w([...this.#t.values()]),this.#p()}#p(){for(let e of this.#e)e()}};const O=o(null),k=o(null);function A(e){let t=c(O);return g(t,`${e} must be rendered inside <AlertCenter.Root>.`),t}function j(e){let t=c(k);return g(t,`${e} must be rendered inside <AlertCenter.Root>.`),t}const M=e=>h(e.subscribe,e.getSnapshot,e.getSnapshot),N=o(!1);function P({store:e}){let t=M(e),n=h(e.subscribe,e.getTopLabel,e.getTopLabel);return _(`div`,{"data-slot":`alert-center-announcer`,className:`sr-only`,role:`status`,"aria-live":`polite`,children:T(n,t.length)})}const F=({children:e,defaultOpen:t,onOpenChange:n,open:r})=>{let[i]=m(()=>new D),a=u(),[o,c]=m(t??!1),l=r??o,f=s(e=>{r??c(e),n?.(e)},[r,n]),p=d(()=>({store:i,contentId:a}),[i,a]),h=d(()=>({isExpanded:l,setExpanded:f}),[l,f]);return v(O.Provider,{value:p,children:[_(k.Provider,{value:h,children:e}),_(P,{store:i})]})},I=({children:t,className:n,id:r,intent:a})=>{let{store:o}=A(`AlertCenter.Item`),s=c(N);g(!s,`AlertCenter.Item cannot be rendered inside another item's children.`);let[l,u]=m(null);return e(()=>{u(o.getHost(r))},[o,r]),e(()=>o.register({id:r,intent:a,className:n}),[o,r,a,n]),e(()=>{o.captureHostSnapshot(r)}),l==null?null:y(_(i,{intent:a,children:_(N.Provider,{value:!0,children:t})}),l)},L=({"data-slot":n,label:i,ref:o,...s})=>{let l=c(N);g(l,`AlertCenter.DismissIconButton must be composed inside an <AlertCenter.Item>'s children.`);let{store:u}=A(`AlertCenter.DismissIconButton`);h(u.subscribe,u.getPlacementVersion,u.getPlacementVersion);let d=p(null),f=t(d,o),[v,y]=m(null);return e(()=>{if(i!=null)return;let e=d.current?.closest(`[data-alert-id]`),t=e==null?``:C(e);y(t===``?null:`Dismiss ${t}`)}),_(a.DismissIconButton,{ref:f,label:i??v??void 0,...s,"data-slot":r(n,`alert-center-dismiss-icon-button`)})};function R(e,t){switch(t){case`show`:return`open`;case`hide`:return e===`closed`?`closed`:`closing`;case`exited`:return e===`closing`?`closed`:e}}function z({present:t}){let[n,r]=f(R,t?`open`:`closed`);e(()=>{r(t?`show`:`hide`)},[t]),l(()=>{if(n!==`closing`)return;let e=window.setTimeout(()=>r(`exited`),200);return()=>window.clearTimeout(e)},[n]);let i=s(e=>{e.target===e.currentTarget&&e.propertyName===`height`&&r(`exited`)},[]);return{isMounted:n!==`closed`,dataState:n===`open`?`open`:`closed`,onExitTransitionEnd:i}}function B({containerRef:t,isAttached:n}){let r=p(null);return e(()=>{let e=t.current;if(!n||e==null)return;let i=e=>{e.target instanceof Element&&(r.current=e.target)},a=t=>{t.relatedTarget instanceof Node&&!e.contains(t.relatedTarget)&&(r.current=null)};return e.addEventListener(`focusin`,i),e.addEventListener(`focusout`,a),()=>{e.removeEventListener(`focusin`,i),e.removeEventListener(`focusout`,a)}},[t,n]),{lastFocusedWithinRef:r}}function V(){let e=document.querySelector(`main, [role="main"]`);e!=null&&(e.hasAttribute(`tabindex`)||(e.tabIndex=-1),e.focus({preventScroll:!0}))}function H({isMounted:t,store:n,topId:r}){let i=p(null),{lastFocusedWithinRef:a}=B({containerRef:i,isAttached:t}),o=p(r);return e(()=>{let e=o.current;if(o.current=r,e==null||r===e)return;let t=a.current;if(n.hasAlert(e)){t instanceof HTMLElement&&document.activeElement!==t&&n.requestFocusRestore(t);return}if(t==null||t.isConnected)return;a.current=null;let s=i.current;if(r==null){V();return}s!=null&&(s.querySelector(`[data-alert-dismiss], [data-alert-expand]`)??s).focus()},[n,r]),{wrapperRef:i}}const U=`gap-2 py-2 pr-2 [&_[data-slot=alert-icon]]:shrink-0`,W={Root:F,Bar:({className:t,"data-slot":i,ref:o,...s})=>{let{store:c,contentId:l}=A(`AlertCenter.Bar`),{isExpanded:u,setExpanded:d}=j(`AlertCenter.Bar`),f=M(c),m=h(c.subscribe,c.getContentMounted,c.getContentMounted),g=f[0]??null,y=g!=null,{isMounted:b,dataState:S,onExitTransitionEnd:w}=z({present:y}),T=p(g);e(()=>{g!=null&&(T.current=g)},[g]);let E=g??T.current,D=p(null);e(()=>{let e=D.current;if(e==null)return;if(g!=null){let t=c.getHost(g.id);t.parentElement!==e&&e.childNodes.length>0&&e.replaceChildren(),x(e,t)&&c.notifyPlacementChange(),c.flushFocusRestore();return}let t=E==null?null:c.getHostSnapshot(E.id);t!=null&&t.parentNode!==e&&e.replaceChildren(t)});let{wrapperRef:O}=H({isMounted:b,store:c,topId:g?.id});if(e(()=>{let e=O.current;c.setTopLabel(y&&e!=null?C(e):``)}),e(()=>{let e=O.current;if(e==null)return;let t=new MutationObserver(()=>{c.setTopLabel(y?C(e):``)});return t.observe(e,{subtree:!0,childList:!0,characterData:!0}),()=>{t.disconnect()}},[c,y,b]),e(()=>()=>{c.setTopLabel(``)},[c]),e(()=>{c.setBarElement(O.current)}),e(()=>()=>{c.setBarElement(null)},[c]),!b||E==null)return null;let k=y?f.length-1:0;return _(`div`,{ref:O,"data-slot":`alert-center-bar-wrapper`,tabIndex:-1,inert:!y,className:`shrink-0 overflow-hidden transition-[height,opacity] duration-200 ease-out [interpolate-size:allow-keywords] starting:h-0 starting:opacity-0 data-state-closed:h-0 data-state-closed:opacity-0 data-state-closed:duration-150 motion-reduce:transition-none`,"data-state":S,onTransitionEnd:w,children:v(a.Root,{ref:o,appearance:`banner`,intent:E.intent,className:n(U,`not-has-data-[slot=alert-description]:[&_[data-alert-dismiss],&_[data-alert-expand]]:top-1/2 not-has-data-[slot=alert-description]:[&_[data-alert-dismiss],&_[data-alert-expand]]:-translate-y-1/2`,`has-data-alert-expand:[&_[data-alert-dismiss]]:right-16 md:has-data-alert-expand:[&_[data-alert-dismiss]]:right-24`,t,E.className),...s,"data-slot":r(i,`alert-center-bar`),"data-placement":`bar`,"data-alert-id":E.id,children:[_(`div`,{ref:D,className:`contents`,"data-slot":`alert-center-bar-mount`}),k>0&&m&&_(a.ExpandButton,{count:k,expanded:u,"aria-controls":l,onClick:()=>d(!u)})]})})},Content:({"aria-label":i=`More alerts`,"aria-labelledby":o,className:s,"data-slot":c,ref:l,...u})=>{let{store:d,contentId:f}=A(`AlertCenter.Content`),{isExpanded:m,setExpanded:h}=j(`AlertCenter.Content`),g=M(d).slice(1),v=g.length>0;e(()=>(d.setContentMounted(!0),()=>{d.setContentMounted(!1)}),[d]);let y=p(v);e(()=>{let e=y.current&&!v;y.current=v,e&&m&&h(!1)},[v,m,h]);let b=p(null),S=t(b,l),{lastFocusedWithinRef:C}=B({containerRef:b,isAttached:v}),w=g.map(e=>e.id).join(` `);return e(()=>{let e=b.current;if(e==null)return;let t=!1;for(let n of e.querySelectorAll(`[data-alert-mount]`)){let e=n.getAttribute(`data-alert-mount`);e!=null&&x(n,d.getHost(e))&&(t=!0)}t&&d.notifyPlacementChange(),d.flushFocusRestore()},[d,w]),e(()=>{let e=C.current;if(e==null)return;if(e.isConnected){let t=b.current;e instanceof HTMLElement&&document.activeElement!==e&&(t==null||!t.contains(e))&&(C.current=null,e.focus({preventScroll:!0}));return}C.current=null;let t=b.current?.querySelector(`[data-alert-dismiss]`);if(t!=null){t.focus();return}let n=d.getBarElement()?.querySelector(`[data-alert-dismiss], [data-alert-expand]`);if(n!=null){n.focus();return}V()},[d,w]),g.length===0?null:_(`div`,{...u,ref:S,"data-slot":r(c,`alert-center-content`),id:f,"data-state":m?`open`:`closed`,className:n(`h-0 overflow-hidden invisible [content-visibility:hidden] transition-[height,visibility,content-visibility] transition-discrete duration-200 ease-out [interpolate-size:allow-keywords] data-state-open:h-auto data-state-open:visible data-state-open:[content-visibility:visible] motion-reduce:transition-none`,s),children:_(`ul`,{"aria-label":o==null?i:void 0,"aria-labelledby":o,className:`flex w-full flex-col`,children:g.map(e=>_(`li`,{children:_(a.Root,{appearance:`banner`,intent:e.intent,className:n(U,e.className),"data-slot":`alert-center-item`,"data-placement":`list`,"data-alert-id":e.id,children:_(`div`,{className:`contents`,"data-alert-mount":e.id})})},e.id))})})},Item:I,DismissIconButton:L};export{W as AlertCenter};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-d-nMCfAI.js";import{t as n}from"./slot-DpNWVci8.js";import{t as r}from"./types-D85fCNV3.js";import{t as i}from"./button-
|
|
1
|
+
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-d-nMCfAI.js";import{t as n}from"./slot-DpNWVci8.js";import{t as r}from"./types-D85fCNV3.js";import{t as i}from"./button-Bc0lEOJ2.js";import{t as a}from"./button-CNg69RsV.js";import{CaretDownIcon as o}from"@phosphor-icons/react/CaretDown";import{createContext as s,useContext as c,useMemo as l}from"react";import u from"tiny-invariant";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{CheckCircleIcon as p}from"@phosphor-icons/react/CheckCircle";import{InfoIcon as m}from"@phosphor-icons/react/Info";import{MegaphoneIcon as h}from"@phosphor-icons/react/Megaphone";import{WarningIcon as g}from"@phosphor-icons/react/Warning";import{WarningDiamondIcon as _}from"@phosphor-icons/react/WarningDiamond";import{XIcon as v}from"@phosphor-icons/react/X";import{cva as y}from"class-variance-authority";const b=s(null),x=d(v,{});function S(){let e=c(b);return u(e,`useAlertContext hook used outside of Alert parent!`),e}const C=({children:e,intent:t})=>{let n=l(()=>({intent:t}),[t]);return d(b.Provider,{value:n,children:e})},w=y(`relative flex w-full gap-1.5 rounded-md border p-2.5 text-sm font-sans`,{variants:{intent:{danger:`border-danger-500/50 bg-danger-500/10 text-danger-700 [&_code]:bg-danger-500/10 [&_code]:border-danger-500/20 [&_code]:text-danger-900 [&_a:not([data-slot=button])]:text-danger-700 [&_a:not([data-slot=button])]:underline`,important:`border-important-500/50 bg-important-500/10 text-important-700 [&_code]:bg-important-500/10 [&_code]:border-important-500/20 [&_code]:text-important-900 [&_a:not([data-slot=button])]:text-important-700 [&_a:not([data-slot=button])]:underline`,info:`border-info-500/50 bg-info-500/10 text-info-700 [&_code]:bg-info-500/10 [&_code]:border-info-500/20 [&_code]:text-info-900 [&_a:not([data-slot=button])]:text-info-700 [&_a:not([data-slot=button])]:underline`,success:`border-success-500/50 bg-success-500/10 text-success-700 [&_code]:bg-success-500/10 [&_code]:border-success-500/20 [&_code]:text-success-900 [&_a:not([data-slot=button])]:text-success-700 [&_a:not([data-slot=button])]:underline`,warning:`border-warning-500/50 bg-warning-500/10 text-warning-700 [&_code]:bg-warning-500/10 [&_code]:border-warning-500/20 [&_code]:text-warning-900 [&_a:not([data-slot=button])]:text-warning-700 [&_a:not([data-slot=button])]:underline`},appearance:{banner:`border-x-0 border-t-0 rounded-none z-50 sticky`,default:``}}}),T=({appearance:t=`default`,className:n,intent:i,ref:a,style:o,...s})=>d(C,{intent:i,children:d(`div`,{ref:a,"data-slot":`alert`,className:e(w({appearance:t,intent:i}),`has-data-alert-dismiss:pr-10`,`has-data-alert-expand:[&_[data-slot=alert-dismiss-icon-button]]:right-16`,`md:has-data-alert-expand:[&_[data-slot=alert-dismiss-icon-button]]:right-24`,`has-data-alert-expand:[&_[data-slot=alert-content]]:pr-12`,`md:has-data-alert-expand:[&_[data-slot=alert-content]]:pr-[5.5rem]`,n),style:r({"--alert-control-color":j(i),"--alert-control-hover-color":M(i),"--alert-control-hover-bg":N(i),...o}),...s})}),E={danger:d(g,{}),important:d(h,{mirrored:!0}),info:d(m,{}),success:d(p,{}),warning:d(_,{})},D=({className:n,ref:r,svg:i,...a})=>{let o=S(),s=E[o.intent];return d(t,{ref:r,"data-slot":`alert-icon`,className:e(`size-5`,n),svg:i??s,...a})},O=({className:t,ref:n,...r})=>d(`div`,{ref:n,"data-slot":`alert-content`,className:e(`min-w-0 flex-1 has-data-alert-dismiss:pr-6`,t),...r}),k=({asChild:t=!1,className:r,ref:i,...a})=>d(t?n:`h5`,{ref:i,"data-slot":`alert-title`,className:e(`font-medium`,r),...a}),A=({asChild:t=!1,className:r,ref:i,...a})=>d(t?n:`div`,{ref:i,"data-slot":`alert-description`,className:e(`text-sm`,r),...a}),j=e=>`var(--color-${e}-700)`,M=e=>`var(--color-${e}-800)`,N=e=>`color-mix(in oklab, var(--color-${e}-500) 10%, transparent)`,P={Root:T,Content:O,ExpandButton:({count:t,expanded:n,className:r,...a})=>f(i,{type:`button`,appearance:`ghost`,intent:`neutral`,size:`sm`,"aria-expanded":n,"aria-label":n?`Collapse additional alerts`:`Show ${t} more ${t===1?`alert`:`alerts`}`,"data-slot":`alert-expand-button`,"data-alert-expand":!0,icon:d(o,{weight:`bold`,className:e(`size-4 transition-transform ease-out duration-150`,n&&`-rotate-180`)}),iconPlacement:`end`,className:e(`right-1.5 top-1.5 absolute gap-1 ps-1.5 pe-1`,`text-[var(--alert-control-color,currentColor)]`,`not-disabled:hover:bg-[var(--alert-control-hover-bg,transparent)] not-disabled:hover:text-[var(--alert-control-hover-color,currentColor)]`,r),...a,children:[f(`span`,{className:`min-w-[2ch] text-center tabular-nums`,children:[`+`,t]}),d(`span`,{className:`hidden md:inline`,children:`more`})]}),Description:A,DismissIconButton:({size:t=`sm`,type:n=`button`,label:r=`Dismiss Alert`,appearance:i=`ghost`,className:o,icon:s=x,...c})=>d(a,{appearance:i,icon:s,intent:`neutral`,label:r,size:t,"data-slot":`alert-dismiss-icon-button`,"data-alert-dismiss":!0,className:e(`right-1.5 top-1.5 absolute`,`text-[var(--alert-control-color,currentColor)]`,`not-disabled:hover:bg-[var(--alert-control-hover-bg,transparent)] not-disabled:hover:text-[var(--alert-control-hover-color,currentColor)]`,o),type:n,...c}),Icon:D,Title:k};export{C as n,P as t};
|
package/dist/alert-dialog.d.ts
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { n as WithAsChild } from "./as-child-D23mGo4f.js";
|
|
2
2
|
import { t as SvgAttributes } from "./icon-D1RY5Tcj.js";
|
|
3
|
-
import {
|
|
4
|
-
import { n as ButtonAppearance, r as ButtonProps } from "./button-DRr-6YHc.js";
|
|
3
|
+
import { i as ButtonIntent, n as ButtonAppearance, r as ButtonProps } from "./button-DjsmeoJ2.js";
|
|
5
4
|
import { a as Root$1, n as Content$1, o as Title$1, r as Description$1, s as Trigger$1, t as Close$1 } from "./dialog-BM4wPCft.js";
|
|
6
5
|
import { ComponentProps, ReactNode } from "react";
|
|
7
6
|
//#region src/components/alert-dialog/alert-dialog.d.ts
|
package/dist/alert-dialog.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-d-nMCfAI.js";import{t as n}from"./slot-DpNWVci8.js";import{t as r}from"./button-
|
|
1
|
+
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-d-nMCfAI.js";import{t as n}from"./slot-DpNWVci8.js";import{t as r}from"./button-Bc0lEOJ2.js";import{a as i,c as a,i as o,n as s,o as c,r as l,s as u,t as d}from"./primitive-D-9GIFWb.js";import{createContext as f,useContext as p,useMemo as m}from"react";import h from"tiny-invariant";import{jsx as g,jsxs as _}from"react/jsx-runtime";import{InfoIcon as v}from"@phosphor-icons/react/Info";import{WarningIcon as y}from"@phosphor-icons/react/Warning";const b=f(null);function x(){let e=p(b);return h(e,`AlertDialog child component used outside of AlertDialog parent!`),e}function S({intent:e,...t}){let n=m(()=>({intent:e}),[e]);return g(b.Provider,{value:n,children:g(c,{...t})})}const C=({ref:e,...t})=>g(a,{ref:e,"data-slot":`alert-dialog-trigger`,...t}),w=i,T=({className:t,ref:n,...r})=>g(o,{"data-slot":`alert-dialog-overlay`,className:e(`data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 bg-overlay fixed inset-0 z-50 backdrop-blur-xs`,t),...r,ref:n}),E=({className:t,preferredWidth:n=`max-w-md`,ref:r,...i})=>_(w,{children:[g(T,{}),g(`div`,{className:`fixed inset-4 z-50 flex items-center justify-center`,children:g(s,{"data-slot":`alert-dialog-content`,"data-mantle-modal-content":!0,ref:r,className:e(`flex w-full flex-1 flex-col items-center gap-4 sm:flex-row sm:items-start`,`outline-hidden focus-within:outline-hidden`,`p-6`,`border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200`,`data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95`,n,t),...i})})]}),D=({asChild:t=!1,className:r,ref:i,...a})=>g(t?n:`div`,{"data-slot":`alert-dialog-body`,className:e(`flex-1 space-y-4`,r),ref:i,...a}),O=({asChild:t=!1,className:r,ref:i,...a})=>g(t?n:`div`,{"data-slot":`alert-dialog-header`,className:e(`flex flex-col space-y-2 text-center sm:text-start`,r),ref:i,...a}),k=({asChild:t=!1,className:r,ref:i,...a})=>g(t?n:`div`,{"data-slot":`alert-dialog-footer`,className:e(`flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2`,r),ref:i,...a}),A=({className:t,ref:n,...r})=>g(u,{ref:n,"data-slot":`alert-dialog-title`,className:e(`text-strong text-center text-lg font-medium sm:text-start`,t),...r}),j=({className:t,ref:n,...r})=>g(l,{ref:n,"data-slot":`alert-dialog-description`,className:e(`text-body text-center text-sm font-normal sm:text-start`,t),...r}),M={danger:`danger`,info:`neutral`},N=({appearance:e=`filled`,intent:t,ref:n,...i})=>{let a=x(),o=M[a.intent];return g(r,{appearance:e,"data-slot":`alert-dialog-action`,intent:t??o,ref:n,...i})},P=({appearance:t=`outlined`,className:n,intent:i=`neutral`,ref:a,...o})=>g(d,{asChild:!0,children:g(r,{appearance:t,"data-slot":`alert-dialog-cancel`,className:e(`mt-2 sm:mt-0`,n),intent:i,ref:a,...o})}),F={danger:g(y,{}),info:g(v,{})},I={danger:`text-danger-600`,info:`text-accent-600`},L={Root:S,Action:N,Body:D,Cancel:P,Close:({ref:e,...t})=>g(d,{ref:e,"data-slot":`alert-dialog-close`,...t}),Content:E,Description:j,Footer:k,Header:O,Icon:({className:n,ref:r,svg:i,...a})=>{let o=x(),s=I[o.intent],c=F[o.intent];return g(t,{ref:r,"data-slot":`alert-dialog-icon`,className:e(`size-12 sm:size-7`,s,n),svg:i??c,...a})},Title:A,Trigger:C};export{L as AlertDialog};
|
package/dist/alert.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as Alert } from "./alert-
|
|
1
|
+
import { t as Alert } from "./alert-BQdon-PF.js";
|
|
2
2
|
export { Alert };
|
package/dist/alert.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./alert-
|
|
1
|
+
import{t as e}from"./alert-cszhDIVl.js";export{e as Alert};
|
package/dist/area-chart.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as e,c as t,i as n,l as r,n as i,o as a,r as o,s,t as c}from"./chart-
|
|
1
|
+
import{a as e,c as t,i as n,l as r,n as i,o as a,r as o,s,t as c}from"./chart-G2pIR4uW.js";import{jsx as l}from"react/jsx-runtime";const u={Root:e=>l(o,{kind:`area`,componentName:`AreaChart`,slotName:`area-chart`,...e}),Area:e=>a(`AreaChart.Area`,`area`,e),Grid:e=>n(`AreaChart.Grid`,e),XAxis:e=>t(`AreaChart.XAxis`,e),YAxis:e=>r(`AreaChart.YAxis`,e),ReferenceLine:t=>e(`AreaChart.ReferenceLine`,t),Tooltip:e=>s(`AreaChart.Tooltip`,e),Legend:e=>l(i,{partName:`AreaChart.Legend`,slotName:`area-chart`,...e}),CopyButton:e=>l(c,{partName:`AreaChart.CopyButton`,slotName:`area-chart`,...e})};export{u as AreaChart};
|
package/dist/bar-chart.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{a as e,c as t,i as n,l as r,n as i,o as a,r as o,s,t as c}from"./chart-
|
|
1
|
+
import{a as e,c as t,i as n,l as r,n as i,o as a,r as o,s,t as c}from"./chart-G2pIR4uW.js";import{jsx as l}from"react/jsx-runtime";const u={Root:e=>l(o,{kind:`bar`,componentName:`BarChart`,slotName:`bar-chart`,...e}),Bar:e=>a(`BarChart.Bar`,`bar`,e),Grid:e=>n(`BarChart.Grid`,e),XAxis:e=>t(`BarChart.XAxis`,e),YAxis:e=>r(`BarChart.YAxis`,e),ReferenceLine:t=>e(`BarChart.ReferenceLine`,t),Tooltip:e=>s(`BarChart.Tooltip`,e),Legend:e=>l(i,{partName:`BarChart.Legend`,slotName:`bar-chart`,...e}),CopyButton:e=>l(c,{partName:`BarChart.CopyButton`,slotName:`bar-chart`,...e})};export{u as BarChart};
|
package/dist/breadcrumb.d.ts
CHANGED
|
@@ -79,7 +79,8 @@ declare const Root: ({ asChild, children, className, "data-slot": dataSlot, ref,
|
|
|
79
79
|
declare const List: ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: ComponentProps<"ol"> & WithAsChild & WithDataSlot) => import("react").JSX.Element;
|
|
80
80
|
/**
|
|
81
81
|
* A single crumb. Renders an `<li>` (`role="listitem"`) that lays out its
|
|
82
|
-
* content — a `Breadcrumb.Link` or `Breadcrumb.Page`
|
|
82
|
+
* content — a `Breadcrumb.Link`, a `Breadcrumb.Label`, or a `Breadcrumb.Page`
|
|
83
|
+
* — inline.
|
|
83
84
|
*
|
|
84
85
|
* The crumb never shrinks (`shrink-0`). A squeezed crumb would break its own
|
|
85
86
|
* label across two lines, so a trail too wide for its container scrolls in
|
|
@@ -142,6 +143,32 @@ declare const Item: ({ asChild, children, className, "data-slot": dataSlot, ref,
|
|
|
142
143
|
* ```
|
|
143
144
|
*/
|
|
144
145
|
declare const Link: ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: ComponentProps<"a"> & WithAsChild & WithDataSlot) => import("react").JSX.Element;
|
|
146
|
+
/**
|
|
147
|
+
* A crumb that is not a link — a level with no page of its own, such as a
|
|
148
|
+
* section whose index URL only redirects (`Settings` in `Settings > General`).
|
|
149
|
+
* Renders a `<span>` with no `aria-current` and no link semantics, so the
|
|
150
|
+
* trail shows the level without offering it as a destination. Use
|
|
151
|
+
* `Breadcrumb.Link` for an ancestor a user can visit and `Breadcrumb.Page`
|
|
152
|
+
* for the current page.
|
|
153
|
+
*
|
|
154
|
+
* @see https://mantle.ngrok.com/components/navigation/breadcrumb#breadcrumblabel
|
|
155
|
+
*
|
|
156
|
+
* @example
|
|
157
|
+
* ```tsx
|
|
158
|
+
* <Breadcrumb.Root>
|
|
159
|
+
* <Breadcrumb.List>
|
|
160
|
+
* <Breadcrumb.Item>
|
|
161
|
+
* <Breadcrumb.Label>Settings</Breadcrumb.Label>
|
|
162
|
+
* </Breadcrumb.Item>
|
|
163
|
+
* <Breadcrumb.Separator />
|
|
164
|
+
* <Breadcrumb.Item>
|
|
165
|
+
* <Breadcrumb.Page>General</Breadcrumb.Page>
|
|
166
|
+
* </Breadcrumb.Item>
|
|
167
|
+
* </Breadcrumb.List>
|
|
168
|
+
* </Breadcrumb.Root>
|
|
169
|
+
* ```
|
|
170
|
+
*/
|
|
171
|
+
declare const Label: ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: ComponentProps<"span"> & WithAsChild & WithDataSlot) => import("react").JSX.Element;
|
|
145
172
|
/**
|
|
146
173
|
* The current page — the last crumb in the trail. Renders a `<span>` (not a
|
|
147
174
|
* link; the user is already here) with `aria-current="page"`. The ARIA is the
|
|
@@ -217,6 +244,43 @@ type BreadcrumbSeparatorProps = Omit<ComponentProps<"li">, "children"> & ({
|
|
|
217
244
|
* ```
|
|
218
245
|
*/
|
|
219
246
|
declare const Separator: ({ asChild, children, className, "data-slot": dataSlot, ref, ...props }: BreadcrumbSeparatorProps & WithDataSlot) => import("react").JSX.Element;
|
|
247
|
+
/**
|
|
248
|
+
* The props for `Breadcrumb.Skeleton`. `children` is omitted on purpose: the
|
|
249
|
+
* part owns its placeholder content.
|
|
250
|
+
*/
|
|
251
|
+
type BreadcrumbSkeletonProps = Omit<ComponentProps<"li">, "children"> & {
|
|
252
|
+
/**
|
|
253
|
+
* The screen-reader status announcement while the crumb loads. Set it for
|
|
254
|
+
* localization.
|
|
255
|
+
*
|
|
256
|
+
* @default "Loading breadcrumbs…"
|
|
257
|
+
*/
|
|
258
|
+
label?: string;
|
|
259
|
+
};
|
|
260
|
+
/**
|
|
261
|
+
* A placeholder crumb for a label that is still loading. Renders one `<li>`
|
|
262
|
+
* as a crumb-sized pulsing bar carrying a screen-reader-only `role="status"`
|
|
263
|
+
* announcement. The bar is `w-24` by default — pass a `w-*` utility for your
|
|
264
|
+
* best-guess width, so the row's shape holds when the real crumb replaces it.
|
|
265
|
+
* One skeleton usually stands in for a whole pending segment; compose several
|
|
266
|
+
* with `Breadcrumb.Separator` when the segment's shape matters.
|
|
267
|
+
*
|
|
268
|
+
* @see https://mantle.ngrok.com/components/navigation/breadcrumb#breadcrumbskeleton
|
|
269
|
+
*
|
|
270
|
+
* @example
|
|
271
|
+
* ```tsx
|
|
272
|
+
* <Breadcrumb.Root>
|
|
273
|
+
* <Breadcrumb.List>
|
|
274
|
+
* <Breadcrumb.Item>
|
|
275
|
+
* <Breadcrumb.Link href="/apps">Apps</Breadcrumb.Link>
|
|
276
|
+
* </Breadcrumb.Item>
|
|
277
|
+
* <Breadcrumb.Separator />
|
|
278
|
+
* <Breadcrumb.Skeleton className="w-40" />
|
|
279
|
+
* </Breadcrumb.List>
|
|
280
|
+
* </Breadcrumb.Root>
|
|
281
|
+
* ```
|
|
282
|
+
*/
|
|
283
|
+
declare const BreadcrumbSkeleton: ({ className, "data-slot": dataSlot, label, ref, ...props }: BreadcrumbSkeletonProps & WithDataSlot) => import("react").JSX.Element;
|
|
220
284
|
/**
|
|
221
285
|
* Compound component for WAI-ARIA breadcrumb navigation — the path from a
|
|
222
286
|
* root to the current page as an ordered list of links inside a labeled
|
|
@@ -234,8 +298,12 @@ declare const Separator: ({ asChild, children, className, "data-slot": dataSlot,
|
|
|
234
298
|
* ├── Breadcrumb.Item
|
|
235
299
|
* │ └── Breadcrumb.Link
|
|
236
300
|
* ├── Breadcrumb.Separator
|
|
237
|
-
*
|
|
238
|
-
*
|
|
301
|
+
* ├── Breadcrumb.Item
|
|
302
|
+
* │ └── Breadcrumb.Label
|
|
303
|
+
* ├── Breadcrumb.Separator
|
|
304
|
+
* ├── Breadcrumb.Item
|
|
305
|
+
* │ └── Breadcrumb.Page
|
|
306
|
+
* └── Breadcrumb.Skeleton
|
|
239
307
|
* ```
|
|
240
308
|
*
|
|
241
309
|
* @example
|
|
@@ -315,9 +383,9 @@ declare const Breadcrumb: {
|
|
|
315
383
|
*/
|
|
316
384
|
readonly List: typeof List;
|
|
317
385
|
/**
|
|
318
|
-
* A single crumb. Renders an `<li>` containing a `Breadcrumb.Link
|
|
319
|
-
* `Breadcrumb.Page`. The crumb never shrinks, so a
|
|
320
|
-
* instead of breaking a label across two lines.
|
|
386
|
+
* A single crumb. Renders an `<li>` containing a `Breadcrumb.Link`, a
|
|
387
|
+
* `Breadcrumb.Label`, or a `Breadcrumb.Page`. The crumb never shrinks, so a
|
|
388
|
+
* wide trail scrolls instead of breaking a label across two lines.
|
|
321
389
|
*
|
|
322
390
|
* @see https://mantle.ngrok.com/components/navigation/breadcrumb#breadcrumbitem
|
|
323
391
|
*
|
|
@@ -367,6 +435,29 @@ declare const Breadcrumb: {
|
|
|
367
435
|
* ```
|
|
368
436
|
*/
|
|
369
437
|
readonly Link: typeof Link;
|
|
438
|
+
/**
|
|
439
|
+
* A crumb that is not a link — a level with no page of its own, such as a
|
|
440
|
+
* section whose index URL only redirects. Renders a `<span>` with no
|
|
441
|
+
* `aria-current` and no link semantics.
|
|
442
|
+
*
|
|
443
|
+
* @see https://mantle.ngrok.com/components/navigation/breadcrumb#breadcrumblabel
|
|
444
|
+
*
|
|
445
|
+
* @example
|
|
446
|
+
* ```tsx
|
|
447
|
+
* <Breadcrumb.Root>
|
|
448
|
+
* <Breadcrumb.List>
|
|
449
|
+
* <Breadcrumb.Item>
|
|
450
|
+
* <Breadcrumb.Label>Settings</Breadcrumb.Label>
|
|
451
|
+
* </Breadcrumb.Item>
|
|
452
|
+
* <Breadcrumb.Separator />
|
|
453
|
+
* <Breadcrumb.Item>
|
|
454
|
+
* <Breadcrumb.Page>General</Breadcrumb.Page>
|
|
455
|
+
* </Breadcrumb.Item>
|
|
456
|
+
* </Breadcrumb.List>
|
|
457
|
+
* </Breadcrumb.Root>
|
|
458
|
+
* ```
|
|
459
|
+
*/
|
|
460
|
+
readonly Label: typeof Label;
|
|
370
461
|
/**
|
|
371
462
|
* The current page — the last crumb. Renders a `<span>` (not a link) with
|
|
372
463
|
* `aria-current="page"`; the ARIA is the part's whole contract and is not
|
|
@@ -422,6 +513,241 @@ declare const Breadcrumb: {
|
|
|
422
513
|
* ```
|
|
423
514
|
*/
|
|
424
515
|
readonly Separator: typeof Separator;
|
|
516
|
+
/**
|
|
517
|
+
* A placeholder crumb for a label that is still loading: one `<li>` as a
|
|
518
|
+
* crumb-sized pulsing bar, plus a screen-reader-only `role="status"`
|
|
519
|
+
* announcement. `w-24` by default — pass a `w-*` utility for your
|
|
520
|
+
* best-guess width, so the row's shape holds when the real crumb arrives.
|
|
521
|
+
*
|
|
522
|
+
* @see https://mantle.ngrok.com/components/navigation/breadcrumb#breadcrumbskeleton
|
|
523
|
+
*
|
|
524
|
+
* @example
|
|
525
|
+
* ```tsx
|
|
526
|
+
* <Breadcrumb.Root>
|
|
527
|
+
* <Breadcrumb.List>
|
|
528
|
+
* <Breadcrumb.Item>
|
|
529
|
+
* <Breadcrumb.Link href="/apps">Apps</Breadcrumb.Link>
|
|
530
|
+
* </Breadcrumb.Item>
|
|
531
|
+
* <Breadcrumb.Separator />
|
|
532
|
+
* <Breadcrumb.Skeleton className="w-40" />
|
|
533
|
+
* </Breadcrumb.List>
|
|
534
|
+
* </Breadcrumb.Root>
|
|
535
|
+
* ```
|
|
536
|
+
*/
|
|
537
|
+
readonly Skeleton: typeof BreadcrumbSkeleton;
|
|
538
|
+
};
|
|
539
|
+
//#endregion
|
|
540
|
+
//#region src/components/breadcrumb/route-breadcrumb.d.ts
|
|
541
|
+
/**
|
|
542
|
+
* One crumb a route contributes — a discriminated union on `kind`. Create
|
|
543
|
+
* these with {@link routeBreadcrumb}; the factory stamps the discriminant, so
|
|
544
|
+
* no call site hand-writes one.
|
|
545
|
+
*
|
|
546
|
+
* @see https://mantle.ngrok.com/components/navigation/breadcrumb#routebreadcrumb
|
|
547
|
+
*
|
|
548
|
+
* @example
|
|
549
|
+
* ```ts
|
|
550
|
+
* const link: Crumb = routeBreadcrumb("Endpoints", { to: "/endpoints" });
|
|
551
|
+
* const prefix: Crumb = routeBreadcrumb.label("Settings");
|
|
552
|
+
* ```
|
|
553
|
+
*/
|
|
554
|
+
type Crumb = {
|
|
555
|
+
kind: "link";
|
|
556
|
+
/** What the crumb says. */
|
|
557
|
+
label: ReactNode;
|
|
558
|
+
/**
|
|
559
|
+
* Where it links. When omitted, resolves to the contributing route's own
|
|
560
|
+
* `pathname`, which is right whenever the crumb *is* that route.
|
|
561
|
+
*/
|
|
562
|
+
to?: string;
|
|
563
|
+
} | {
|
|
564
|
+
/**
|
|
565
|
+
* A prefix crumb: it names a level with no page of its own — a section
|
|
566
|
+
* whose index URL only redirects — so the renderer draws it as a
|
|
567
|
+
* non-link `Breadcrumb.Label`.
|
|
568
|
+
*/
|
|
569
|
+
kind: "label";
|
|
570
|
+
/** What the crumb says. */
|
|
571
|
+
label: ReactNode;
|
|
572
|
+
} | {
|
|
573
|
+
/**
|
|
574
|
+
* A content crumb: a complete rendered trail segment, for labels and
|
|
575
|
+
* links that only exist in fetched data. The node renders its own
|
|
576
|
+
* `Breadcrumb.Item`s and `Breadcrumb.Separator`s, and falls back to
|
|
577
|
+
* `Breadcrumb.Skeleton` while its data loads.
|
|
578
|
+
*/
|
|
579
|
+
kind: "content";
|
|
580
|
+
content: ReactNode;
|
|
581
|
+
};
|
|
582
|
+
/**
|
|
583
|
+
* Creates the crumb a route contributes: a link crumb, whose omitted `to`
|
|
584
|
+
* resolves to the contributing route's own `pathname`. Two members cover the
|
|
585
|
+
* crumbs that are not plain links — `routeBreadcrumb.label` for a section
|
|
586
|
+
* prefix that never links, and `routeBreadcrumb.content` for a trail segment
|
|
587
|
+
* that renders itself from fetched data.
|
|
588
|
+
*
|
|
589
|
+
* There is no page variant on purpose. Page-ness is positional, not declared:
|
|
590
|
+
* the deepest crumb renders as `Breadcrumb.Page`, because the same route's
|
|
591
|
+
* crumb is the current page at its own URL and a link when the trail goes
|
|
592
|
+
* deeper.
|
|
593
|
+
*
|
|
594
|
+
* @see https://mantle.ngrok.com/components/navigation/breadcrumb#routebreadcrumb
|
|
595
|
+
*
|
|
596
|
+
* @example
|
|
597
|
+
* ```tsx
|
|
598
|
+
* routeBreadcrumb("Endpoints"); // links to the contributing route's pathname
|
|
599
|
+
* routeBreadcrumb("Endpoints", { to: "/endpoints" }); // links to an explicit path
|
|
600
|
+
* routeBreadcrumb.label("Settings"); // never links — renders as Breadcrumb.Label
|
|
601
|
+
* routeBreadcrumb.content(<AppTrail appId="app_123" />); // renders its own items from query data
|
|
602
|
+
* ```
|
|
603
|
+
*/
|
|
604
|
+
declare const routeBreadcrumb: ((label: ReactNode, options?: {
|
|
605
|
+
to?: string;
|
|
606
|
+
}) => Crumb) & {
|
|
607
|
+
/**
|
|
608
|
+
* Creates a prefix crumb — one that never links. The renderer draws it as
|
|
609
|
+
* a non-link `Breadcrumb.Label`.
|
|
610
|
+
*
|
|
611
|
+
* @example
|
|
612
|
+
* ```ts
|
|
613
|
+
* const handle = { breadcrumb: () => [routeBreadcrumb.label("Settings")] };
|
|
614
|
+
* ```
|
|
615
|
+
*/
|
|
616
|
+
label: (label: ReactNode) => Crumb;
|
|
617
|
+
/**
|
|
618
|
+
* Creates a content crumb — a complete rendered trail segment, for labels
|
|
619
|
+
* and links that only exist in fetched data. The node decides link vs
|
|
620
|
+
* current page itself, because the trail builder cannot see inside it.
|
|
621
|
+
*
|
|
622
|
+
* @example
|
|
623
|
+
* ```tsx
|
|
624
|
+
* const handle = { breadcrumb: () => [routeBreadcrumb.content(<AppTrail appId="app_123" />)] };
|
|
625
|
+
* ```
|
|
626
|
+
*/
|
|
627
|
+
content: (content: ReactNode) => Crumb;
|
|
425
628
|
};
|
|
629
|
+
/**
|
|
630
|
+
* What a route names itself in the trail: a static string, or a function of
|
|
631
|
+
* the router's match returning every crumb this route contributes.
|
|
632
|
+
*
|
|
633
|
+
* The function form covers the label derived from the match (its params or
|
|
634
|
+
* loader data), the route that names an ancestor it is not nested under, the
|
|
635
|
+
* section prefix that is not a destination, and the query-backed segment that
|
|
636
|
+
* renders its own content.
|
|
637
|
+
*
|
|
638
|
+
* A string or crumb label must resolve **synchronously**: it runs during
|
|
639
|
+
* render, on the server too, so the trail is correct in the initial HTML. A
|
|
640
|
+
* name that only exists in fetched data goes in a content crumb instead.
|
|
641
|
+
*
|
|
642
|
+
* @see https://mantle.ngrok.com/components/navigation/breadcrumb#routebreadcrumb
|
|
643
|
+
*
|
|
644
|
+
* @example
|
|
645
|
+
* ```ts
|
|
646
|
+
* // TMatch is your router's match type, e.g. react-router's UIMatch.
|
|
647
|
+
* const staticLabel: RouteBreadcrumb<UIMatch> = "Endpoints";
|
|
648
|
+
* const fromParams: RouteBreadcrumb<UIMatch> = (match) => [routeBreadcrumb(match.params.endpointId)];
|
|
649
|
+
* const sectionPrefix: RouteBreadcrumb<UIMatch> = () => [routeBreadcrumb.label("Settings")];
|
|
650
|
+
* ```
|
|
651
|
+
*/
|
|
652
|
+
type RouteBreadcrumb<TMatch = unknown> = string | ((match: TMatch) => ReadonlyArray<Crumb>);
|
|
653
|
+
/**
|
|
654
|
+
* The `handle` shape a route exports to appear in the trail. Omitting `handle`
|
|
655
|
+
* entirely is the opt-out — no filter list to maintain.
|
|
656
|
+
*
|
|
657
|
+
* @see https://mantle.ngrok.com/components/navigation/breadcrumb#routebreadcrumb
|
|
658
|
+
*
|
|
659
|
+
* @example
|
|
660
|
+
* ```ts
|
|
661
|
+
* // app/routes/endpoints.tsx
|
|
662
|
+
* export const handle = { breadcrumb: "Endpoints" } satisfies BreadcrumbHandle<UIMatch>;
|
|
663
|
+
* ```
|
|
664
|
+
*/
|
|
665
|
+
type BreadcrumbHandle<TMatch = unknown> = {
|
|
666
|
+
breadcrumb: RouteBreadcrumb<TMatch>;
|
|
667
|
+
};
|
|
668
|
+
/**
|
|
669
|
+
* The fields {@link buildCrumbs} reads off a route match. Router-agnostic on
|
|
670
|
+
* purpose: react-router's `UIMatch` satisfies it structurally, and so does any
|
|
671
|
+
* object carrying these three fields.
|
|
672
|
+
*
|
|
673
|
+
* @see https://mantle.ngrok.com/components/navigation/breadcrumb#buildcrumbs
|
|
674
|
+
*
|
|
675
|
+
* @example
|
|
676
|
+
* ```ts
|
|
677
|
+
* const match: BreadcrumbMatch = { id: "endpoints", pathname: "/endpoints", handle: { breadcrumb: "Endpoints" } };
|
|
678
|
+
* ```
|
|
679
|
+
*/
|
|
680
|
+
type BreadcrumbMatch = {
|
|
681
|
+
/** The route's stable id in the matched chain. */
|
|
682
|
+
id: string;
|
|
683
|
+
/** The URL portion this route matched. */
|
|
684
|
+
pathname: string;
|
|
685
|
+
/** The route module's `handle` export — `unknown` until narrowed. */
|
|
686
|
+
handle: unknown;
|
|
687
|
+
};
|
|
688
|
+
/**
|
|
689
|
+
* A crumb with its link and React key resolved — what a trail renderer
|
|
690
|
+
* consumes. Link crumbs carry a definite `to`; label crumbs carry none, which
|
|
691
|
+
* is what makes an unlinked link crumb unrepresentable.
|
|
692
|
+
*
|
|
693
|
+
* @see https://mantle.ngrok.com/components/navigation/breadcrumb#buildcrumbs
|
|
694
|
+
*
|
|
695
|
+
* @example
|
|
696
|
+
* ```ts
|
|
697
|
+
* const resolved: ResolvedCrumb = { kind: "link", key: "endpoints:0", label: "Endpoints", to: "/endpoints" };
|
|
698
|
+
* ```
|
|
699
|
+
*/
|
|
700
|
+
type ResolvedCrumb = {
|
|
701
|
+
kind: "link";
|
|
702
|
+
/** Stable React key. One route may contribute several crumbs, so the match id alone is not unique. */
|
|
703
|
+
key: string;
|
|
704
|
+
label: ReactNode;
|
|
705
|
+
to: string;
|
|
706
|
+
} | {
|
|
707
|
+
kind: "label";
|
|
708
|
+
/** Stable React key. One route may contribute several crumbs, so the match id alone is not unique. */
|
|
709
|
+
key: string;
|
|
710
|
+
label: ReactNode;
|
|
711
|
+
} | {
|
|
712
|
+
kind: "content";
|
|
713
|
+
/** Stable React key. One route may contribute several crumbs, so the match id alone is not unique. */
|
|
714
|
+
key: string;
|
|
715
|
+
content: ReactNode;
|
|
716
|
+
};
|
|
717
|
+
/**
|
|
718
|
+
* Whether a route match named itself in the trail. A real type guard, not a
|
|
719
|
+
* cast: routers type `handle` as `unknown`, and the narrowing is what lets
|
|
720
|
+
* {@link buildCrumbs} read `match.handle` without an assertion.
|
|
721
|
+
*
|
|
722
|
+
* @see https://mantle.ngrok.com/components/navigation/breadcrumb#hasbreadcrumb
|
|
723
|
+
*
|
|
724
|
+
* @example
|
|
725
|
+
* ```ts
|
|
726
|
+
* useMatches().filter(hasBreadcrumb);
|
|
727
|
+
* ```
|
|
728
|
+
*/
|
|
729
|
+
declare function hasBreadcrumb<TMatch extends BreadcrumbMatch>(match: TMatch): match is TMatch & {
|
|
730
|
+
handle: BreadcrumbHandle<TMatch>;
|
|
731
|
+
};
|
|
732
|
+
/**
|
|
733
|
+
* Derives the breadcrumb trail from a matched route chain. Matches without a
|
|
734
|
+
* `breadcrumb` handle contribute nothing, so pathless layouts and gate routes
|
|
735
|
+
* stay out of the trail.
|
|
736
|
+
*
|
|
737
|
+
* Pure: no hooks, no browser APIs, no clock. It runs identically on the
|
|
738
|
+
* server and the client, which is the whole reason the trail needs no state
|
|
739
|
+
* and no effects — and it means you can assert the trail as a plain value.
|
|
740
|
+
* Router-agnostic: it reads only {@link BreadcrumbMatch}'s three fields, which
|
|
741
|
+
* react-router's `UIMatch` satisfies structurally.
|
|
742
|
+
*
|
|
743
|
+
* @see https://mantle.ngrok.com/components/navigation/breadcrumb#buildcrumbs
|
|
744
|
+
*
|
|
745
|
+
* @example
|
|
746
|
+
* ```ts
|
|
747
|
+
* buildCrumbs(useMatches());
|
|
748
|
+
* // [{ kind: "link", key: "endpoints:0", label: "Endpoints", to: "/endpoints" }, …]
|
|
749
|
+
* ```
|
|
750
|
+
*/
|
|
751
|
+
declare function buildCrumbs<TMatch extends BreadcrumbMatch>(matches: ReadonlyArray<TMatch>): ReadonlyArray<ResolvedCrumb>;
|
|
426
752
|
//#endregion
|
|
427
|
-
export { Breadcrumb };
|
|
753
|
+
export { Breadcrumb, type BreadcrumbHandle, type BreadcrumbMatch, type Crumb, type ResolvedCrumb, type RouteBreadcrumb, buildCrumbs, hasBreadcrumb, routeBreadcrumb };
|
package/dist/breadcrumb.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./use-isomorphic-layout-effect-DdTRtMY-.js";import{n as t}from"./compose-refs-BdBMM9ga.js";import{t as n}from"./cx-IiQEAKf5.js";import{t as r}from"./icon-lZ48P8Nn.js";import{t as i}from"./data-slot-EM6s2WEU.js";import{t as a}from"./slot-DpNWVci8.js";import{cloneElement as
|
|
1
|
+
import{t as e}from"./use-isomorphic-layout-effect-DdTRtMY-.js";import{n as t}from"./compose-refs-BdBMM9ga.js";import{t as n}from"./cx-IiQEAKf5.js";import{t as r}from"./icon-lZ48P8Nn.js";import{t as i}from"./data-slot-EM6s2WEU.js";import{t as a}from"./slot-DpNWVci8.js";import{t as o}from"./skeleton-BhcJMpem.js";import{cloneElement as s,isValidElement as c,useEffect as l,useRef as u}from"react";import{jsx as d}from"react/jsx-runtime";import{CaretRightIcon as f}from"@phosphor-icons/react/CaretRight";const p=({asChild:e,children:t,className:r,"data-slot":o,ref:s,...c})=>d(e?a:`nav`,{ref:s,"data-slot":i(o,`breadcrumb`),"aria-label":`Breadcrumb`,className:n(`min-w-0`,r),...c,children:t});function m(e,t){let n=e.scrollWidth-e.clientWidth;return n===t||e.contains(document.activeElement)?t:(e.scrollLeft=n,n)}const h={Root:p,List:({asChild:r,children:o,className:s,"data-slot":c,ref:f,...p})=>{let h=r?a:`ol`,g=u(null),_=t(g,f),v=u(void 0);return e(()=>{let e=g.current;e!=null&&(v.current=m(e,v.current))}),l(()=>{let e=g.current;if(e==null)return;let t=new ResizeObserver(()=>{v.current=m(e,v.current)});return t.observe(e),()=>{t.disconnect()}},[]),d(h,{ref:_,"data-slot":i(c,`breadcrumb-list`),className:n(`text-muted flex items-center gap-1.5 text-sm`,`scroll-fade-x min-w-0 overflow-x-auto overscroll-x-none`,`-m-1 p-1`,`scroll-px-10`,s),...p,children:o})},Item:({asChild:e,children:t,className:r,"data-slot":o,ref:s,...c})=>d(e?a:`li`,{ref:s,"data-slot":i(o,`breadcrumb-item`),className:n(`inline-flex shrink-0 items-center gap-1.5`,r),...c,children:t}),Link:({asChild:e,children:t,className:r,"data-slot":o,ref:s,...c})=>d(e?a:`a`,{ref:s,"data-slot":i(o,`breadcrumb-link`),className:n(`hover:text-strong transition-colors`,r),...c,children:t}),Label:({asChild:e,children:t,className:r,"data-slot":o,ref:s,...c})=>d(e?a:`span`,{ref:s,"data-slot":i(o,`breadcrumb-label`),className:n(`text-muted`,r),...c,children:t}),Page:({asChild:e,children:t,className:r,"data-slot":o,ref:l,...u})=>{let f=e?a:`span`,p=e&&c(t)?s(t,{"aria-current":`page`}):t;return d(f,{ref:l,"data-slot":i(o,`breadcrumb-page`),className:n(`text-muted`,r),...u,"aria-current":`page`,children:p})},Separator:({asChild:e,children:t,className:o,"data-slot":l,ref:u,...p})=>{let m=e?a:`li`,h=e&&c(t)?s(t,{role:`presentation`,"aria-hidden":`true`}):t??d(r,{svg:d(f,{}),className:`size-3.5`});return d(m,{ref:u,"data-slot":i(l,`breadcrumb-separator`),className:n(`shrink-0`,o),...p,role:`presentation`,"aria-hidden":`true`,children:h})},Skeleton:({className:e,"data-slot":t,label:r=`Loading breadcrumbs…`,ref:a,...s})=>d(o,{asChild:!0,children:d(`li`,{ref:a,"data-slot":i(t,`breadcrumb-skeleton`),className:n(`w-24 shrink-0`,e),...s,children:d(`span`,{role:`status`,className:`sr-only`,children:r})})})},g=Object.assign((e,t={})=>({kind:`link`,label:e,...t}),{label:e=>({kind:`label`,label:e}),content:e=>({kind:`content`,content:e})});function _(e){let{handle:t}=e;if(typeof t!=`object`||!t||!(`breadcrumb`in t))return!1;let{breadcrumb:n}=t;return typeof n==`string`||typeof n==`function`}function v(e){return e.filter(_).flatMap(e=>{let{breadcrumb:t}=e.handle;return(typeof t==`string`?[g(t)]:t(e)).map((t,n)=>{let r=`${e.id}:${n}`;return t.kind===`content`?{kind:`content`,key:r,content:t.content}:t.kind===`label`?{kind:`label`,key:r,label:t.label}:{kind:`link`,key:r,label:t.label,to:t.to??e.pathname}})})}export{h as Breadcrumb,v as buildCrumbs,_ as hasBreadcrumb,g as routeBreadcrumb};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-lZ48P8Nn.js";import{t as n}from"./slot-DpNWVci8.js";import{t as r}from"./booleanish-BfvnW6vy.js";import{t as i}from"./clsx-DUGZgXfJ.js";import{Children as a,cloneElement as o,isValidElement as s}from"react";import c from"tiny-invariant";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{cva as f}from"class-variance-authority";import{CircleNotchIcon as p}from"@phosphor-icons/react/CircleNotch";const m=f(``,{variants:{appearance:{filled:`bg-filled-accent text-white focus-visible:ring-focus-accent not-disabled:hover:bg-filled-accent-hover border border-transparent text-sm font-medium`,ghost:`text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 border border-transparent text-sm font-medium`,outlined:`border-accent-600 bg-form text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-accent-700 not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 border text-sm font-medium`,link:`text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:underline group/button-link border-transparent`},isLoading:{false:``,true:`opacity-50`},intent:{accent:``,danger:``,neutral:``},size:{xs:``,sm:``,md:``,lg:``,xl:``}},defaultVariants:{isLoading:!1,size:`md`},compoundVariants:[{appearance:[`filled`,`ghost`,`outlined`],size:`xs`,class:`h-6 px-2`},{appearance:[`filled`,`ghost`,`outlined`],size:`sm`,class:`h-7 px-2.5`},{appearance:[`filled`,`ghost`,`outlined`],size:`md`,class:`h-9 px-3`},{appearance:[`filled`,`ghost`,`outlined`],size:`lg`,class:`h-10 px-3.5`},{appearance:[`filled`,`ghost`,`outlined`],size:`xl`,class:`h-12 px-4`},{appearance:`ghost`,intent:`danger`,class:`text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700 border-transparent`},{appearance:`outlined`,intent:`danger`,class:`border-danger-600 bg-form text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:border-danger-700 not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700`},{appearance:`filled`,intent:`danger`,class:`bg-filled-danger focus-visible:ring-focus-danger not-disabled:hover:bg-filled-danger-hover border-transparent`},{appearance:`link`,intent:`danger`,class:`text-danger-600 focus-visible:ring-focus-danger`},{appearance:`ghost`,intent:`neutral`,class:`text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong border-transparent`},{appearance:`outlined`,intent:`neutral`,class:`border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong focus-visible:not-disabled:hover:border-accent-600`},{appearance:`filled`,intent:`neutral`,class:`bg-filled-neutral not-disabled:hover:bg-filled-neutral-hover border-transparent focus-visible:border-transparent text-neutral-50`},{appearance:`link`,intent:`neutral`,class:`text-strong focus-visible:ring-focus-accent`}]}),h={xs:`ps-1.5`,sm:`ps-2`,md:`ps-2.5`,lg:`ps-3`,xl:`ps-3.5`},g={xs:`pe-1.5`,sm:`pe-2`,md:`pe-2.5`,lg:`pe-3`,xl:`pe-3.5`},_=({"aria-disabled":f,appearance:_,asChild:v,children:y,className:b,disabled:x,icon:S,iconPlacement:C=`start`,intent:w,isLoading:T=!1,ref:E,size:D=`md`,type:O,...k})=>{let A=r(f??x??T),j=T?u(p,{className:`animate-spin`}):S,M=j&&_!==`link`,N={"aria-disabled":A,"data-slot":`button`,className:e(`inline-flex items-center justify-center gap-1.5 whitespace-nowrap rounded-md`,`focus:outline-hidden focus-visible:ring-4`,`disabled:cursor-default disabled:opacity-50`,`not-disabled:active:scale-97 ease-out transition-transform duration-150`,m({appearance:_,intent:w,isLoading:T,size:D}),_!==`link`&&`font-sans`,M&&C===`start`&&h[D],M&&C===`end`&&g[D],b),"data-appearance":_,"data-disabled":A,"data-intent":w,"data-loading":T,"data-size":_===`link`?void 0:D,disabled:A,ref:E,...k};return v?(c(s(y)&&a.only(y),"When using `asChild`, Button must be passed a single child as a JSX tag."),u(n,{...N,children:o(y,{},d(l,{children:[j&&u(t,{svg:j,className:i(C===`end`&&`order-last`)}),u(`span`,{"data-slot":`button-label`,className:`contents`,children:y.props.children})]}))})):d(`button`,{...N,type:O??`button`,children:[j&&u(t,{svg:j,className:i(C===`end`&&`order-last`)}),u(`span`,{"data-slot":`button-label`,className:`contents`,children:y})]})};export{_ as t};
|
|
1
|
+
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-lZ48P8Nn.js";import{t as n}from"./slot-DpNWVci8.js";import{t as r}from"./booleanish-BfvnW6vy.js";import{t as i}from"./clsx-DUGZgXfJ.js";import{Children as a,cloneElement as o,isValidElement as s}from"react";import c from"tiny-invariant";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{cva as f}from"class-variance-authority";import{CircleNotchIcon as p}from"@phosphor-icons/react/CircleNotch";const m=f(``,{variants:{appearance:{filled:`bg-filled-accent text-white focus-visible:ring-focus-accent not-disabled:hover:bg-filled-accent-hover border border-transparent text-sm font-medium`,ghost:`text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 border border-transparent text-sm font-medium`,outlined:`border-accent-600 bg-form text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-accent-700 not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 border text-sm font-medium`,link:`text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:underline group/button-link border-transparent`},isLoading:{false:``,true:`opacity-50`},intent:{accent:``,danger:``,neutral:``},size:{xs:``,sm:``,md:``,lg:``,xl:``}},defaultVariants:{isLoading:!1,size:`md`},compoundVariants:[{appearance:[`filled`,`ghost`,`outlined`],size:`xs`,class:`h-6 px-2`},{appearance:[`filled`,`ghost`,`outlined`],size:`sm`,class:`h-7 px-2.5`},{appearance:[`filled`,`ghost`,`outlined`],size:`md`,class:`h-9 px-3`},{appearance:[`filled`,`ghost`,`outlined`],size:`lg`,class:`h-10 px-3.5`},{appearance:[`filled`,`ghost`,`outlined`],size:`xl`,class:`h-12 px-4`},{appearance:`ghost`,intent:`danger`,class:`text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700 border-transparent`},{appearance:`outlined`,intent:`danger`,class:`border-danger-600 bg-form text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:border-danger-700 not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700`},{appearance:`filled`,intent:`danger`,class:`bg-filled-danger focus-visible:ring-focus-danger not-disabled:hover:bg-filled-danger-hover border-transparent`},{appearance:`link`,intent:`danger`,class:`text-danger-600 focus-visible:ring-focus-danger`},{appearance:`ghost`,intent:`neutral`,class:`text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong border-transparent`},{appearance:`outlined`,intent:`neutral`,class:`border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong focus-visible:not-disabled:hover:border-accent-600 focus-visible:not-disabled:active:border-accent-600`},{appearance:`filled`,intent:`neutral`,class:`bg-filled-neutral not-disabled:hover:bg-filled-neutral-hover border-transparent focus-visible:border-transparent text-neutral-50`},{appearance:`link`,intent:`neutral`,class:`text-strong focus-visible:ring-focus-accent`}]}),h={xs:`ps-1.5`,sm:`ps-2`,md:`ps-2.5`,lg:`ps-3`,xl:`ps-3.5`},g={xs:`pe-1.5`,sm:`pe-2`,md:`pe-2.5`,lg:`pe-3`,xl:`pe-3.5`},_=({"aria-disabled":f,appearance:_,asChild:v,children:y,className:b,disabled:x,icon:S,iconPlacement:C=`start`,intent:w,isLoading:T=!1,ref:E,size:D=`md`,type:O,...k})=>{let A=r(f??x??T),j=T?u(p,{className:`animate-spin`}):S,M=j&&_!==`link`,N={"aria-disabled":A,"data-slot":`button`,className:e(`inline-flex items-center justify-center gap-1.5 whitespace-nowrap rounded-md`,`focus:outline-hidden focus-visible:ring-4`,`disabled:cursor-default disabled:opacity-50`,`not-disabled:active:scale-97 ease-out transition-transform duration-150`,m({appearance:_,intent:w,isLoading:T,size:D}),_!==`link`&&`font-sans`,M&&C===`start`&&h[D],M&&C===`end`&&g[D],b),"data-appearance":_,"data-disabled":A,"data-intent":w,"data-loading":T,"data-size":_===`link`?void 0:D,disabled:A,ref:E,...k};return v?(c(s(y)&&a.only(y),"When using `asChild`, Button must be passed a single child as a JSX tag."),u(n,{...N,children:o(y,{},d(l,{children:[j&&u(t,{svg:j,className:i(C===`end`&&`order-last`)}),u(`span`,{"data-slot":`button-label`,className:`contents`,children:y.props.children})]}))})):d(`button`,{...N,type:O??`button`,children:[j&&u(t,{svg:j,className:i(C===`end`&&`order-last`)}),u(`span`,{"data-slot":`button-label`,className:`contents`,children:y})]})};export{_ as t};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { n as WithAsChild } from "./as-child-D23mGo4f.js";
|
|
2
2
|
import { r as VariantProps } from "./index-DA4ig3gj.js";
|
|
3
|
-
import "./button-
|
|
4
|
-
import "./button-
|
|
3
|
+
import "./button-DjsmeoJ2.js";
|
|
4
|
+
import "./button-DkUUma3k.js";
|
|
5
5
|
import { ComponentProps } from "react";
|
|
6
6
|
//#region src/components/button/button-group.d.ts
|
|
7
7
|
declare const buttonGroupVariants: (props?: ({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-lZ48P8Nn.js";import{t as n}from"./slot-DpNWVci8.js";import{t as r}from"./booleanish-BfvnW6vy.js";import{t as i}from"./button-
|
|
1
|
+
import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-lZ48P8Nn.js";import{t as n}from"./slot-DpNWVci8.js";import{t as r}from"./booleanish-BfvnW6vy.js";import{t as i}from"./button-DiDlvAOp.js";import{Children as a,cloneElement as o,isValidElement as s}from"react";import c from"tiny-invariant";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{CircleNotchIcon as f}from"@phosphor-icons/react/CircleNotch";const p=({"aria-disabled":p,appearance:m,asChild:h=!1,children:g,className:_,disabled:v,icon:y,intent:b,isLoading:x=!1,label:S,ref:C,size:w=`md`,type:T,...E})=>{let D=r(p??v??x),O=x?u(f,{className:`animate-spin`}):y,k={"aria-disabled":D,"data-slot":`icon-button`,className:e(i({appearance:m,intent:b,isLoading:x,size:w}),_),"data-appearance":m,"data-disabled":D,"data-icon-button":!0,"data-intent":b,"data-loading":x,"data-size":w,disabled:D,ref:C,...E},A=d(l,{children:[u(`span`,{className:`sr-only`,children:S}),u(t,{svg:O})]});return h?(c(s(g)&&a.only(g),"When using `asChild`, IconButton must be passed a single child as a JSX tag."),u(n,{...k,children:o(g,{},A)})):u(`button`,{...k,type:T??`button`,children:A})};export{p as t};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{t as e}from"./cx-IiQEAKf5.js";import{cva as t}from"class-variance-authority";const n=e(`icon-button`,`inline-flex shrink-0 items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] border`,`focus:outline-hidden focus-visible:ring-4`,`disabled:cursor-default disabled:opacity-50`,`not-disabled:active:scale-97 ease-out transition-transform duration-150`),r=t(n,{variants:{appearance:{filled:`bg-filled-neutral text-neutral-50 focus-visible:ring-focus-accent focus-visible:border-transparent not-disabled:hover:bg-filled-neutral-hover border-transparent`,ghost:`text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong border-transparent`,outlined:`border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong focus-visible:not-disabled:hover:border-accent-600 focus-visible:not-disabled:active:border-accent-600`},intent:{neutral:``},isLoading:{false:``,true:`opacity-50`},size:{xs:`size-6`,sm:`size-7`,md:`size-9`,lg:`size-10`,xl:`size-12`}},defaultVariants:{intent:`neutral`,size:`md`}});export{r as t};
|