neba 1.12.0 → 1.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +1 -1
- package/README.md +43 -41
- package/dist/components/accordion/Accordion.d.ts +18 -0
- package/dist/components/accordion/Accordion.js +1 -1
- package/dist/components/anchor/Anchor.js +1 -1
- package/dist/components/animate-marquee/AnimateMarquee.d.ts +5 -3
- package/dist/components/animate-marquee/AnimateMarquee.js +1 -1
- package/dist/components/animate-scramble/AnimateScramble.js +1 -1
- package/dist/components/app-logo/AppLogo.js +1 -1
- package/dist/components/bottom-navigation/BottomNavigation.d.ts +10 -0
- package/dist/components/bottom-navigation/BottomNavigation.js +1 -1
- package/dist/components/button/Button.js +1 -1
- package/dist/components/calendar/Calendar.js +1 -1
- package/dist/components/carousel/Carousel.d.ts +13 -0
- package/dist/components/carousel/Carousel.js +1 -1
- package/dist/components/code-block/CodeBlock.js +1 -1
- package/dist/components/color-picker/ColorPicker.js +1 -1
- package/dist/components/combobox/Combobox.d.ts +18 -0
- package/dist/components/combobox/Combobox.js +1 -1
- package/dist/components/command-palette/CommandPalette.js +1 -1
- package/dist/components/data-table/DataTable.js +1 -1
- package/dist/components/date-picker/DatePicker.js +1 -1
- package/dist/components/date-range-picker/DateRangePicker.js +1 -1
- package/dist/components/date-time-picker/DateTimePicker.js +1 -1
- package/dist/components/dialog/Dialog.js +1 -1
- package/dist/components/drawer/Drawer.js +1 -1
- package/dist/components/gauge-chart/GaugeChart.js +1 -1
- package/dist/components/grid/Grid.d.ts +11 -1
- package/dist/components/grid/Grid.js +1 -1
- package/dist/components/hover-card/HoverCard.js +1 -1
- package/dist/components/image/Image.d.ts +32 -4
- package/dist/components/image/Image.js +1 -1
- package/dist/components/menu/Menu.js +1 -1
- package/dist/components/meter/Meter.d.ts +7 -0
- package/dist/components/meter/Meter.js +1 -1
- package/dist/components/navigation-menu/NavigationMenu.js +1 -1
- package/dist/components/number-field/NumberField.js +1 -1
- package/dist/components/otp-field/OtpField.js +1 -1
- package/dist/components/overlay/Overlay.js +1 -1
- package/dist/components/panes/Panes.js +1 -1
- package/dist/components/popover/Popover.js +1 -1
- package/dist/components/progress-circular/ProgressCircular.d.ts +10 -1
- package/dist/components/progress-circular/ProgressCircular.js +1 -1
- package/dist/components/progress-linear/ProgressLinear.d.ts +7 -1
- package/dist/components/progress-linear/ProgressLinear.js +1 -1
- package/dist/components/provider/NebaProvider.js +1 -1
- package/dist/components/scatter-chart/ScatterChart.js +1 -1
- package/dist/components/scroll-area/ScrollArea.js +1 -1
- package/dist/components/scroll-zone/ScrollZone.d.ts +8 -7
- package/dist/components/scroll-zone/ScrollZone.js +1 -1
- package/dist/components/select/Select.d.ts +13 -0
- package/dist/components/select/Select.js +1 -1
- package/dist/components/slider/Slider.d.ts +37 -2
- package/dist/components/slider/Slider.js +1 -1
- package/dist/components/tabs/Tabs.d.ts +18 -0
- package/dist/components/tabs/Tabs.js +1 -1
- package/dist/components/text-field/TextField.js +1 -1
- package/dist/components/time-picker/TimePicker.js +1 -1
- package/dist/components/timeline-chart/TimelineChart.js +1 -1
- package/dist/components/toast/Toast.js +1 -1
- package/dist/components/tooltip/Tooltip.js +1 -1
- package/dist/components/tour/Tour.js +1 -1
- package/dist/components/transfer/Transfer.js +1 -1
- package/dist/components/tree-select/TreeSelect.d.ts +2 -0
- package/dist/components/tree-select/TreeSelect.js +1 -1
- package/dist/components/typography/Typography.js +1 -1
- package/dist/internal/cache.d.ts +24 -0
- package/dist/internal/cache.js +1 -0
- package/dist/internal/calendar.d.ts +15 -42
- package/dist/internal/calendar.js +1 -1
- package/dist/internal/chart-frame.d.ts +16 -3
- package/dist/internal/chart-frame.js +1 -1
- package/dist/internal/date.js +1 -1
- package/dist/internal/drag.d.ts +8 -6
- package/dist/internal/drag.js +1 -1
- package/dist/internal/format.d.ts +21 -7
- package/dist/internal/format.js +1 -1
- package/dist/internal/grid.d.ts +16 -0
- package/dist/internal/grid.js +1 -1
- package/dist/internal/i18n.d.ts +72 -0
- package/dist/internal/i18n.js +1 -1
- package/dist/internal/icons.d.ts +25 -0
- package/dist/internal/icons.js +1 -1
- package/dist/internal/link.d.ts +5 -4
- package/dist/internal/media.js +1 -1
- package/dist/internal/observe.js +1 -1
- package/dist/internal/picker.d.ts +8 -3
- package/dist/internal/picker.js +1 -1
- package/dist/internal/progress.d.ts +24 -1
- package/dist/internal/progress.js +1 -1
- package/dist/internal/styles.d.ts +73 -3
- package/dist/internal/styles.js +1 -1
- package/dist/internal/text.d.ts +0 -10
- package/dist/internal/text.js +1 -1
- package/dist/internal/wheel.d.ts +38 -0
- package/dist/internal/wheel.js +1 -0
- package/dist/locales/ar.js +1 -1
- package/dist/locales/de.js +1 -1
- package/dist/locales/es.js +1 -1
- package/dist/locales/fr.js +1 -1
- package/dist/locales/hi.js +1 -1
- package/dist/locales/id.js +1 -1
- package/dist/locales/it.js +1 -1
- package/dist/locales/ja.js +1 -1
- package/dist/locales/ko.js +1 -1
- package/dist/locales/nl.js +1 -1
- package/dist/locales/pl.js +1 -1
- package/dist/locales/pt.js +1 -1
- package/dist/locales/ru.js +1 -1
- package/dist/locales/th.js +1 -1
- package/dist/locales/tr.js +1 -1
- package/dist/locales/vi.js +1 -1
- package/dist/locales/zh-hans.js +1 -1
- package/dist/locales/zh-hant.js +1 -1
- package/dist/styles.css +1 -1
- package/dist/tailwind.css +131 -6
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,Fragment as t,jsxs as n}from"react/jsx-runtime";import*as a from"react";import{Box as l}from"../components/box/Box.js";import{bandScale as i,categoryAt as r,categoryCount as s,categoryExtent as o,chartFontSizes as c,compactNumber as d,extentOf as u,fitsLast as h,formatCategory as m,markerRadii as f,plotHeights as x,seriesColor as p,showsTick as g,textWidth as b,tickStride as v,toValues as y,truncate as k,valueScale as w}from"./chart.js";import{numberFormatter as M}from"./format.js";import{observeResize as N}from"./observe.js";import{chartMessages as z,emptyMessages as S,useMessages as C}from"./i18n.js";import{cx as A,hasContent as P,metaTextClasses as j,srOnlyClasses as _,transitionClasses as W}from"./styles.js";const B="undefined"==typeof document?a.useEffect:a.useLayoutEffect,F=[];function E(e){const[t,n]=a.useState(0);return B(()=>{const t=e.current;if(!t)return;const a=()=>n(t.clientWidth);return a(),N(t,a)},[e]),t}export const markTransitionClasses=["[transition:opacity_var(--neba-duration)_var(--neba-ease),","r_var(--neba-duration)_var(--neba-ease),","scale_var(--neba-duration)_var(--neba-ease)]"].join("");function I(e){const[t,n]=a.useState(()=>{const t=new Set;return e.forEach((e,n)=>{e.hidden&&t.add(n)}),t}),[l,i]=a.useState(null),r=a.useCallback(e=>{n(t=>{const n=new Set(t);return n.has(e)?n.delete(e):n.add(e),n})},[]);return{visible:e.map((e,n)=>!t.has(n)),hovered:l,toggle:r,setHovered:i}}const R={top:"flex-col-reverse",bottom:"flex-col",left:"flex-row-reverse",right:"flex-row"},$={start:"justify-start",center:"justify-center",end:"justify-end"};function H({series:a,colors:l,options:i,visibility:r,size:s,values:o,swatch:c}){const d=!1!==i.interactive,u="left"===i.side||"right"===i.side;return e("ul",{className:A("flex list-none flex-wrap items-center gap-x-3 gap-y-1 p-0",u?"min-w-0 flex-col items-start":"",$[i.align??"center"],j[s]),children:a.map((a,i)=>{const s=r.visible[i],u=null!==r.hovered&&r.hovered!==i,h=a.name??`${i+1}`,m=s?l[i]:"var(--neba-disabled-fg)",f=n(t,{children:[e("span",c?{"aria-hidden":"true",className:"flex size-2.5 shrink-0 items-center justify-center",children:c(i,m)}:{"aria-hidden":"true",className:`size-2.5 shrink-0 rounded-[0.1875rem] ${W}`,style:{backgroundColor:m}}),e("span",{className:"min-w-0 truncate",children:h}),o?.[i]?e("span",{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:o[i]}):null]});return e("li",{className:"min-w-0",children:d?e("button",{type:"button","aria-pressed":s,onClick:()=>r.toggle(i),onPointerEnter:()=>r.setHovered(i),onPointerLeave:()=>r.setHovered(null),onFocus:()=>r.setHovered(i),onBlur:()=>r.setHovered(null),className:A("flex min-w-0 cursor-pointer items-center gap-1.5 rounded-(--neba-radius-xs)","px-1 py-0.5 text-(--neba-fg)","[transition-property:background-color,color,opacity]","[transition-duration:var(--neba-duration)]","[transition-timing-function:var(--neba-ease)]","hover:bg-(--n-soft)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1",s?"":"text-(--neba-disabled-fg)",u?"opacity-55":""),children:f}):e("span",{className:A("flex min-w-0 items-center gap-1.5 px-1 py-0.5 text-(--neba-fg)",s?"":"text-(--neba-disabled-fg)"),children:f})},a.name??i)})})}function T({steps:a,from:l,to:i,middle:r,align:s,vertical:o,size:c}){return e("div",{className:A("flex",o?"":$[s]),children:n("div",{className:A("grid grid-cols-[auto_auto_auto] items-center gap-x-2",j[c]),children:[e("span",{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:l}),e("span",{"aria-hidden":"true",className:A("flex h-2.5 overflow-hidden rounded-[0.1875rem]",o?"w-20":"w-24"),children:a.map(t=>e("span",{className:"h-full flex-1",style:{backgroundColor:t}},t))}),e("span",{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:i}),r?n(t,{children:[e("span",{}),e("span",{className:"text-center tabular-nums text-(--neba-muted-fg)",children:r}),e("span",{})]}):null]})})}function L({heading:t,items:a,x:l,y:i,flip:r,size:s}){return n("div",{"data-neba-tooltip":"",className:A("pointer-events-none absolute z-10 max-w-56 min-w-24","rounded-(--neba-radius-sm) border p-2","[background-image:var(--neba-grain),var(--neba-sheen)]","[background-blend-mode:overlay,normal] [backdrop-filter:var(--neba-blur)]","bg-(--neba-panel-press) [border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-2),var(--neba-plate-glass)]",j[s]),style:r?{right:`calc(100% - ${l}px + 10px)`,top:i}:{left:l+10,top:i},children:[e("div",{className:"mb-1 font-medium text-(--neba-fg)",children:t}),e("ul",{className:"flex list-none flex-col gap-0.5 p-0",children:a.map(t=>n("li",{className:"flex items-center gap-1.5",children:[e("span",{"aria-hidden":"true",className:"size-2 shrink-0 rounded-[0.125rem]",style:{backgroundColor:t.color}}),t.name?e("span",{className:"min-w-0 flex-1 truncate text-(--neba-muted-fg)",children:t.name}):null,e("span",{className:"ms-auto shrink-0 font-medium tabular-nums text-(--neba-fg)",children:t.label??t.formatted})]},t.seriesIndex))})]})}function V({heading:l,items:i}){return e("span",{role:"status","aria-live":"polite",className:_,children:0===i.length?null:n(t,{children:[P(l)?n(t,{children:[l,", "]}):null,i.map((e,t)=>n(a.Fragment,{children:[t>0?", ":null,e.name?`${e.name}: `:null,e.label??e.formatted]},e.seriesIndex))]})})}function D({id:t,caption:a,corner:l,categories:i,series:r,values:s,format:o,locale:c}){return n("table",{id:t,className:_,children:[a?e("caption",{children:a}):null,e("thead",{children:n("tr",{children:[e("th",{scope:"col",children:l??""}),r.map((t,n)=>e("th",{scope:"col",children:t.name??n+1},t.name??n))]})}),e("tbody",{children:i.map((t,a)=>n("tr",{children:[e("th",{scope:"row",children:m(t,c)}),r.map((t,n)=>{const l=s[n]?.[a];return e("td",void 0!==l?.label?{children:l.label}:{children:null==l?.value?"":o(l.value)},t.name??n)})]},a))})]})}function X({legend:t,legendSide:a,children:i,table:r,className:s,...o}){return n(l,{...o,className:A("relative flex gap-3",R[a],s??void 0),children:[e("div",{className:"relative min-w-0 flex-1",children:i}),t,r]})}export function CartesianChart({series:t,categories:l,xAxis:h,yAxis:g,horizontal:v=!1,stacked:N=!1,includeZero:P=!0,bandRatio:_=1,inset:W=!1,headroom:B=0,markInset:R=0,xScale:$="band",marks:T,markRadius:Z=24,table:K,swatch:U,scale:q,markTooltip:G,height:J,format:O,locale:Q,label:ee,legend:te,tooltip:ne,empty:ae,size:le="md",variant:ie="text",padded:re=!1,className:se,children:oe,...ce}){const de=a.useRef(null),ue=E(de),he=C(S,Q),me=C(z,Q),fe=a.useId(),xe=I(t),[pe,ge]=a.useState(null),[be,ve]=a.useState(null),[ye,ke]=a.useState(null),we=a.useCallback(e=>O?M(Q,O).format(e):d(e,Q),[O,Q]),Me=a.useMemo(()=>y(t),[t]),Ne=a.useMemo(()=>t.map((e,t)=>p(e,t)),[t]),ze=s(t),Se=a.useMemo(()=>Array.from({length:ze},(e,t)=>r(t,l,Me)),[ze,l,Me]),Ce=Me.filter((e,t)=>xe.visible[t]),Ae=u(Ce,N),Pe="number"==typeof J?J:void 0===J?x[le]:null,je=c[le],_e=g,We=h,Be=q??w(Ae,{min:_e?.min,max:_e?.max,tickCount:_e?.tickCount,includeZero:P}),Fe="value"===$?o(Ce,l):null,Ee="value"===$?w(Fe,{min:We?.min,max:We?.max,tickCount:We?.tickCount,includeZero:!1}):null,Ie=Be.ticks.map((e,t)=>_e?.tickFormat?String(_e.tickFormat(e,t)):we(e)),Re=Ee?Ee.ticks.map((e,t)=>We?.tickFormat?String(We.tickFormat(e,t)):d(e,Q)):Se.map((e,t)=>We?.tickFormat?String(We.tickFormat(e,t)):m(e,Q)),$e=Ie.reduce((e,t)=>Math.max(e,b(t,je)),0),He=je+6,Te=_e?.hidden?0:$e+10+(_e?.label?He:0),Le=(ue-(v?0:Te)-16)/Math.max(1,ze),Ve=Ee?Re:v||Le-6>=2.4*je?Re.map(e=>k(e,v?150:Le-6,je)):Re,De=Ve.reduce((e,t)=>Math.max(e,b(t,je)),0),Xe=v?We?.hidden?0:De+10+(We?.label?He:0):Te,Ye=v?_e?.hidden?0:je+12+(_e?.label?He:0):We?.hidden?0:je+12+(We?.label?He:0),Ze=(v?We:_e)?.thickness??Xe,Ke=(v?_e:We)?.thickness??Ye,Ue=(v||Ee?12:Math.max(8,Ve.length?De/2:8))+R,qe=f[le]+4+B+R,Ge=Pe??0,Je={left:Ze+R,top:qe,width:Math.max(0,ue-Ze-R-Ue),height:Math.max(0,Ge-qe-Ke-R)},Oe=v?Je.height:Je.width,Qe=i(W?Math.max(1,ze-1):ze,Oe,_),et=a.useCallback(e=>W?ze<=1?Oe/2:Oe*e/(ze-1):Qe.centre(e),[W,ze,Oe,Qe]),tt=a.useCallback(e=>v?Je.left+Be.fraction(e)*Je.width:Je.top+(1-Be.fraction(e))*Je.height,[v,Je.left,Je.top,Je.width,Je.height,Be]),nt=a.useCallback((e,t)=>v?{x:tt(t),y:Je.top+et(e)}:{x:Je.left+et(e),y:tt(t)},[v,tt,et,Je.left,Je.top]),at=a.useCallback(e=>v?Je.top+(1-(Ee?.fraction(e)??0))*Je.height:Je.left+(Ee?.fraction(e)??0)*Je.width,[v,Je.left,Je.top,Je.width,Je.height,Ee]),lt=tt(Math.min(Math.max(0,Be.min),Be.max)),it={plot:Je,values:Me,visible:xe.visible,colors:Ne,scale:Be,band:Qe,horizontal:v,valuePx:tt,categoryPx:et,point:nt,categoryScale:Ee,categoryValuePx:at,zeroPx:lt,categories:Se,format:we,size:le},rt=T?T(it):F,st=!1===ne?{mode:"none"}:!0===ne||void 0===ne?{}:ne,ot=st.mode??(T?"item":"index"),ct=null===be?null:rt[be]??null,dt=T?ct?ct.index:null:pe,ut=T?rt.length:ze,ht=()=>{ge(null),ve(null),ke(null)},mt=e=>{const t=null===e?null:Math.min(ut-1,Math.max(0,e));T?ve(t):ge(t)},ft=e=>{ke(null);mt(((T?be:pe)??(e>0?-1:ut))+e)},xt=null===dt?[]:t.flatMap((e,t)=>{if(!xe.visible[t]||ct&&ct.series!==t)return[];const n=Me[t]?.[dt];return n&&null!==n.value?[{seriesIndex:t,name:e.name,color:n.color??Ne[t],value:n.value,formatted:we(n.value),label:n.label}]:[]}),pt=ct&&G?G(ct):null,gt=pt?pt.items:"item"===ot&&xt.length>1&&null!==ye?[xt.reduce((e,t)=>Math.abs(tt(t.value??0)-ye)<Math.abs(tt(e.value??0)-ye)?t:e)]:xt,bt=ct?Me[ct.series]?.[ct.index]?.x??l?.[ct.index]??ct.index:void 0,vt=ct?ct.x:v?tt(gt[0]?.value??0):Je.left+et(dt??0),yt=ct?ct.y:v?Je.top+et(dt??0):Je.top,kt=ct?(ct.x-Je.left)/Math.max(1,Je.width)>.6:(v?Be.fraction(gt[0]?.value??0):et(dt??0)/Math.max(1,Oe))>.6,wt=!1===te?{interactive:!1}:!0===te||void 0===te?{}:te,Mt=!0===te||!1!==te&&t.length>1,Nt=wt.side??"bottom",zt={...it,hovered:xe.hovered,activeIndex:dt,marks:rt,activeMark:ct},St=0===ze||null===Ae||"value"===$&&null===Fe;return n(X,{...ce,size:le,variant:ie,padded:re,className:se,legendSide:Nt,legend:Mt?e(H,{series:t,colors:Ne,options:wt,visibility:xe,size:le,swatch:U,values:wt.showValue&&null!==dt?t.map((e,t)=>{const n=Me[t]?.[dt]?.value;return null==n?void 0:we(n)}):void 0}):null,table:St?null:K?.(fe)??e(D,{id:fe,caption:ee,corner:We?.label,categories:Se,series:t,values:Me,format:we,locale:Q}),children:[n("div",{ref:de,role:"img",tabIndex:St?void 0:0,"aria-label":ee??me.label,"aria-describedby":St?void 0:fe,onPointerMove:e=>{"none"!==ot&&(T?ve(((e,t)=>{const n=de.current;if(!n||0===rt.length)return null;const a=n.getBoundingClientRect(),l=e-a.left,i=t-a.top;let r=null,s=1/0,o=1/0;return rt.forEach((e,t)=>{const n=Math.hypot(e.x-l,e.y-i),a=void 0===e.rx?Math.max(0,n-e.r):Math.hypot(Math.max(0,Math.abs(e.x-l)-e.rx),Math.max(0,Math.abs(e.y-i)-(e.ry??e.rx)));a<=Z&&(a<s||a===s&&n<o)&&(s=a,o=n,r=t)}),r})(e.clientX,e.clientY)):ge(((e,t)=>{const n=de.current;if(!n||0===ze)return null;const a=n.getBoundingClientRect(),l=v?t-a.top-Je.top:e-a.left-Je.left;if(l<-Qe.step||l>Oe+Qe.step)return null;const i=W?ze<=1?0:Math.round(l/Oe*(ze-1)):Math.floor(l/Qe.step);return Math.min(ze-1,Math.max(0,i))})(e.clientX,e.clientY)),"item"===ot&&ke(((e,t)=>{const n=de.current;if(!n)return null;const a=n.getBoundingClientRect();return v?e-a.left:t-a.top})(e.clientX,e.clientY)))},onPointerLeave:ht,onKeyDown:"none"===ot?void 0:e=>{const t=v?"ArrowDown":"ArrowRight",n=v?"ArrowUp":"ArrowLeft";if(e.key===t)ft(1);else if(e.key===n)ft(-1);else if("Home"===e.key)mt(0);else if("End"===e.key)mt(ut-1);else{if("Escape"!==e.key)return;ht()}e.preventDefault()},onBlur:ht,className:A("relative w-full","rounded-(--neba-radius-xs)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"),style:{height:Pe??J},children:[St?e("div",{className:A("flex h-full items-center justify-center text-(--neba-muted-fg)",j[le]),children:ae??he.title}):ue>0?n("svg",{width:ue,height:Ge||"100%",viewBox:`0 0 ${ue} ${Ge}`,"aria-hidden":"true",className:"block overflow-visible",children:[e(Y,{plot:Je,scale:Be,band:Qe,horizontal:v,inset:W,categoryPx:et,valuePx:tt,tickTexts:Ie,categoryTexts:Ve,categoryScale:Ee,categoryValuePx:at,valueAxis:_e,categoryAxis:We,fontSize:je,zeroPx:lt}),null===dt||T||"index"!==ot||!1===st.crosshair?null:(()=>{const t=et(dt);return e("line",v?{x1:Je.left,x2:Je.left+Je.width,y1:Je.top+t,y2:Je.top+t,stroke:"var(--neba-chart-baseline)",strokeWidth:1}:{x1:Je.left+t,x2:Je.left+t,y1:Je.top,y2:Je.top+Je.height,stroke:"var(--neba-chart-baseline)",strokeWidth:1})})(),oe(zt)]}):null,null!==dt&>.length>0&&"none"!==ot?st.render?e("div",{className:"pointer-events-none absolute z-10",style:kt?{right:`calc(100% - ${vt}px + 10px)`,top:yt}:{left:vt+10,top:yt},children:st.render({index:dt,category:bt??Se[dt],items:gt})}):e(L,{heading:pt?pt.heading:m(bt??Se[dt],Q),items:gt,x:vt,y:yt,flip:kt,size:le}):null]}),"none"===ot?null:e(V,{heading:null===dt?void 0:pt?.heading??m(bt??Se[dt],Q),items:gt})]})}function Y({plot:a,scale:l,horizontal:i,categoryPx:r,valuePx:s,tickTexts:o,categoryTexts:c,categoryScale:d,categoryValuePx:u,valueAxis:m,categoryAxis:f,fontSize:x,zeroPx:p}){const y=!1!==m?.grid&&!m?.hidden,k=!f?.hidden&&(f?.grid??null!==d),w=e=>d?u(d.ticks[e]):(i?a.top:a.left)+r(e),M=v(c.length,i?a.height:a.width,i?1.8*x:Math.max(...c.map(e=>b(e,x)),1)+12),N=v(l.ticks.length,i?a.width:a.height,i?Math.max(...o.map(e=>b(e,x)),1)+16:2*x),z=c.length>1?Math.abs(w(1)-w(0)):a.width,S=l.ticks.length>1?Math.abs(s(l.ticks[1])-s(l.ticks[0])):a.height,C=h(c.length,M,z,i?1.8*x:b(c[c.length-1]??"",x)),A=h(l.ticks.length,N,S,i?b(o[o.length-1]??"",x):1.6*x);return n("g",{children:[l.ticks.map((t,r)=>{const c=s(t),d=Math.abs(t)<1e-9;return n("g",{children:[y?e("line",i?{x1:c,x2:c,y1:a.top,y2:a.top+a.height,stroke:d?"var(--neba-chart-baseline)":"var(--neba-chart-grid)",strokeWidth:1}:{x1:a.left,x2:a.left+a.width,y1:c,y2:c,stroke:d?"var(--neba-chart-baseline)":"var(--neba-chart-grid)",strokeWidth:1}):null,m?.hidden||!g(r,l.ticks.length,N,A)?null:e("text",i?{x:c,y:a.top+a.height+x+6,textAnchor:0===r?"start":r===l.ticks.length-1?"end":"middle",fontSize:x,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:o[r]}:{x:a.left-8,y:c,textAnchor:"end",dominantBaseline:"central",fontSize:x,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:o[r]})]},t)}),f?.hidden?null:n(t,{children:[e("line",i?{x1:p,x2:p,y1:a.top,y2:a.top+a.height,stroke:"var(--neba-chart-axis)",strokeWidth:1}:{x1:a.left,x2:a.left+a.width,y1:p,y2:p,stroke:"var(--neba-chart-axis)",strokeWidth:1}),c.map((t,l)=>{const r=w(l),s=g(l,c.length,M,C);return i?s?e("text",{x:a.left-8,y:r,textAnchor:"end",dominantBaseline:"central",fontSize:x,fill:"var(--neba-muted-fg)",className:d?"tabular-nums":void 0,children:t},l):null:n("g",{children:[k?e("line",{x1:r,x2:r,y1:a.top,y2:a.top+a.height,stroke:"var(--neba-chart-grid)",strokeWidth:1}):null,s?e("text",{x:r,y:a.top+a.height+x+6,textAnchor:d?0===l?"start":l===c.length-1?"end":"middle":"middle",fontSize:x,fill:"var(--neba-muted-fg)",className:d?"tabular-nums":void 0,children:t}):null]},l)})]}),m?.label?e("text",{x:i?a.left+a.width:a.left,y:i?a.top+a.height+2*x+12:a.top-8,textAnchor:i?"end":"start",fontSize:x,fill:"var(--neba-muted-fg)",fontWeight:500,children:m.label}):null,f?.label&&!i?e("text",{x:a.left+a.width,y:a.top+a.height+2*x+12,textAnchor:"end",fontSize:x,fill:"var(--neba-muted-fg)",fontWeight:500,children:f.label}):null]})}export{D as ChartDataTable,H as ChartLegendBar,T as ChartScaleLegend,V as ChartStatus,X as ChartSurface,L as ChartTooltipPanel,E as useMeasuredWidth,I as useVisibility};
|
|
1
|
+
"use client";import{jsx as e,Fragment as t,jsxs as n}from"react/jsx-runtime";import*as a from"react";import{Box as l}from"../components/box/Box.js";import{bandScale as i,categoryAt as r,categoryCount as s,categoryExtent as o,chartFontSizes as c,compactNumber as d,extentOf as u,fitsLast as h,formatCategory as m,markerRadii as f,plotHeights as x,seriesColor as g,showsTick as p,textWidth as b,tickStride as v,toValues as y,truncate as k,valueScale as w}from"./chart.js";import{numberFormatter as N}from"./format.js";import{observeResize as M}from"./observe.js";import{chartMessages as z,emptyMessages as S,useMessages as C}from"./i18n.js";import{cx as A,hasContent as P,metaTextClasses as j,srOnlyClasses as _,transitionClasses as W}from"./styles.js";const B="undefined"==typeof document?a.useEffect:a.useLayoutEffect,F=[];function E(e){const[t,n]=a.useState(0);return B(()=>{const t=e.current;if(!t)return;const a=()=>n(t.clientWidth);return a(),M(t,a)},[e]),t}export const markTransitionClasses=["[transition:opacity_var(--neba-duration)_var(--neba-ease),","r_var(--neba-duration)_var(--neba-ease),","scale_var(--neba-duration)_var(--neba-ease)]"].join("");function I(e){const[t,n]=a.useState(()=>{const t=new Set;return e.forEach((e,n)=>{e.hidden&&t.add(n)}),t}),[l,i]=a.useState(null),r=a.useCallback(e=>{n(t=>{const n=new Set(t);return n.has(e)?n.delete(e):n.add(e),n})},[]);return{visible:e.map((e,n)=>!t.has(n)),hovered:l,toggle:r,setHovered:i}}const R={top:"flex-col-reverse",bottom:"flex-col",left:"flex-row-reverse",right:"flex-row"},$={start:"justify-start",center:"justify-center",end:"justify-end"};function H({series:a,colors:l,options:i,visibility:r,size:s,values:o,swatch:c}){const d=!1!==i.interactive,u="left"===i.side||"right"===i.side;return e("ul",{className:A("flex list-none flex-wrap items-center gap-x-3 gap-y-1 p-0",u?"min-w-0 flex-col items-start":"",$[i.align??"center"],j[s]),children:a.map((a,i)=>{const s=r.visible[i],u=null!==r.hovered&&r.hovered!==i,h=a.name??`${i+1}`,m=s?l[i]:"var(--neba-disabled-fg)",f=n(t,{children:[e("span",c?{"aria-hidden":"true",className:"flex size-2.5 shrink-0 items-center justify-center",children:c(i,m)}:{"aria-hidden":"true",className:`size-2.5 shrink-0 rounded-[0.1875rem] ${W}`,style:{backgroundColor:m}}),e("span",{className:"min-w-0 truncate",children:h}),o?.[i]?e("span",{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:o[i]}):null]});return e("li",{className:"min-w-0",children:d?e("button",{type:"button","aria-pressed":s,onClick:()=>r.toggle(i),onPointerEnter:()=>r.setHovered(i),onPointerLeave:()=>r.setHovered(null),onFocus:()=>r.setHovered(i),onBlur:()=>r.setHovered(null),className:A("flex min-w-0 cursor-pointer items-center gap-1.5 rounded-(--neba-radius-xs)","px-1 py-0.5 text-(--neba-fg)","[transition-property:background-color,color,opacity]","[transition-duration:var(--neba-duration)]","[transition-timing-function:var(--neba-ease)]","hover:bg-(--n-soft)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1",s?"":"text-(--neba-disabled-fg)",u?"opacity-55":""),children:f}):e("span",{className:A("flex min-w-0 items-center gap-1.5 px-1 py-0.5 text-(--neba-fg)",s?"":"text-(--neba-disabled-fg)"),children:f})},a.name??i)})})}function T({steps:a,from:l,to:i,middle:r,align:s,vertical:o,size:c}){return e("div",{className:A("flex",o?"":$[s]),children:n("div",{className:A("grid grid-cols-[auto_auto_auto] items-center gap-x-2",j[c]),children:[e("span",{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:l}),e("span",{"aria-hidden":"true",className:A("flex h-2.5 overflow-hidden rounded-[0.1875rem]",o?"w-20":"w-24"),children:a.map(t=>e("span",{className:"h-full flex-1",style:{backgroundColor:t}},t))}),e("span",{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:i}),r?n(t,{children:[e("span",{}),e("span",{className:"text-center tabular-nums text-(--neba-muted-fg)",children:r}),e("span",{})]}):null]})})}function L({heading:t,items:a,x:l,y:i,flip:r,size:s}){return n("div",{"data-neba-tooltip":"",className:A("pointer-events-none absolute z-10 max-w-56 min-w-24","rounded-(--neba-radius-sm) border p-2","[background-image:var(--neba-grain),var(--neba-sheen)]","[background-blend-mode:overlay,normal] [backdrop-filter:var(--neba-blur)]","bg-(--neba-panel-press) [border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-2),var(--neba-plate-glass)]",j[s]),style:r?{right:`calc(100% - ${l}px + 10px)`,top:i}:{left:l+10,top:i},children:[e("div",{className:"mb-1 font-medium text-(--neba-fg)",children:t}),e("ul",{className:"flex list-none flex-col gap-0.5 p-0",children:a.map(t=>n("li",{className:"flex items-center gap-1.5",children:[e("span",{"aria-hidden":"true",className:"size-2 shrink-0 rounded-[0.125rem]",style:{backgroundColor:t.color}}),t.name?e("span",{className:"min-w-0 flex-1 truncate text-(--neba-muted-fg)",children:t.name}):null,e("span",{className:"ms-auto shrink-0 font-medium tabular-nums text-(--neba-fg)",children:t.label??t.formatted})]},t.seriesIndex))})]})}function V({heading:l,items:i}){return e("span",{role:"status","aria-live":"polite",className:_,children:0===i.length?null:n(t,{children:[P(l)?n(t,{children:[l,", "]}):null,i.map((e,t)=>n(a.Fragment,{children:[t>0?", ":null,e.name?`${e.name}: `:null,e.label??e.formatted]},e.seriesIndex))]})})}const D=/*@__PURE__*/a.memo(function({id:t,caption:a,corner:l,categories:i,series:r,values:s,format:o,locale:c}){return n("table",{id:t,className:_,children:[a?e("caption",{children:a}):null,e("thead",{children:n("tr",{children:[e("th",{scope:"col",children:l??""}),r.map((t,n)=>e("th",{scope:"col",children:t.name??n+1},t.name??n))]})}),e("tbody",{children:i.map((t,a)=>n("tr",{children:[e("th",{scope:"row",children:m(t,c)}),r.map((t,n)=>{const l=s[n]?.[a];return e("td",void 0!==l?.label?{children:l.label}:{children:null==l?.value?"":o(l.value)},t.name??n)})]},a))})]})});function X({legend:t,legendSide:a,children:i,table:r,className:s,...o}){return n(l,{...o,className:A("relative flex gap-3",R[a],s??void 0),children:[e("div",{className:"relative min-w-0 flex-1",children:i}),t,r]})}export function CartesianChart({series:t,categories:l,xAxis:h,yAxis:p,horizontal:v=!1,stacked:M=!1,includeZero:P=!0,bandRatio:_=1,inset:W=!1,headroom:B=0,markInset:R=0,xScale:$="band",marks:T,markRadius:Z=24,table:q,swatch:J,scale:K,markTooltip:O,height:U,format:G,locale:Q,label:ee,legend:te,tooltip:ne,empty:ae,size:le="md",variant:ie="text",padded:re=!1,className:se,children:oe,...ce}){const de=a.useRef(null),ue=E(de),he=C(S,Q),me=C(z,Q),fe=a.useId(),xe=I(t),[ge,pe]=a.useState(null),[be,ve]=a.useState(null),[ye,ke]=a.useState(null),we=G?JSON.stringify(G):"",Ne=a.useCallback(e=>G?N(Q,G).format(e):d(e,Q),[we,Q]),Me=a.useMemo(()=>y(t),[t]),ze=a.useMemo(()=>t.map((e,t)=>g(e,t)),[t]),Se=s(t),Ce=a.useMemo(()=>Array.from({length:Se},(e,t)=>r(t,l,Me)),[Se,l,Me]),Ae=Me.filter((e,t)=>xe.visible[t]),Pe=u(Ae,M),je="number"==typeof U?U:void 0===U?x[le]:null,_e=c[le],We=p,Be=h,Fe=K??w(Pe,{min:We?.min,max:We?.max,tickCount:We?.tickCount,includeZero:P}),Ee="value"===$?o(Ae,l):null,Ie="value"===$?w(Ee,{min:Be?.min,max:Be?.max,tickCount:Be?.tickCount,includeZero:!1}):null,Re=Fe.ticks.map((e,t)=>We?.tickFormat?String(We.tickFormat(e,t)):Ne(e)),$e=Ie?Ie.ticks.map((e,t)=>Be?.tickFormat?String(Be.tickFormat(e,t)):d(e,Q)):Ce.map((e,t)=>Be?.tickFormat?String(Be.tickFormat(e,t)):m(e,Q)),He=Re.reduce((e,t)=>Math.max(e,b(t,_e)),0),Te=_e+6,Le=We?.hidden?0:He+10+(We?.label?Te:0),Ve=(ue-(v?0:Le)-16)/Math.max(1,Se),De=Ie?$e:v||Ve-6>=2.4*_e?$e.map(e=>k(e,v?150:Ve-6,_e)):$e,Xe=De.reduce((e,t)=>Math.max(e,b(t,_e)),0),Ye=v?Be?.hidden?0:Xe+10+(Be?.label?Te:0):Le,Ze=v?We?.hidden?0:_e+12+(We?.label?Te:0):Be?.hidden?0:_e+12+(Be?.label?Te:0),qe=(v?Be:We)?.thickness??Ye,Je=(v?We:Be)?.thickness??Ze,Ke=(v||Ie?12:Math.max(8,De.length?Xe/2:8))+R,Oe=f[le]+4+B+R,Ue=je??0,Ge={left:qe+R,top:Oe,width:Math.max(0,ue-qe-R-Ke),height:Math.max(0,Ue-Oe-Je-R)},Qe=v?Ge.height:Ge.width,et=i(W?Math.max(1,Se-1):Se,Qe,_),tt=a.useCallback(e=>W?Se<=1?Qe/2:Qe*e/(Se-1):et.centre(e),[W,Se,Qe,et]),nt=a.useCallback(e=>v?Ge.left+Fe.fraction(e)*Ge.width:Ge.top+(1-Fe.fraction(e))*Ge.height,[v,Ge.left,Ge.top,Ge.width,Ge.height,Fe]),at=a.useCallback((e,t)=>v?{x:nt(t),y:Ge.top+tt(e)}:{x:Ge.left+tt(e),y:nt(t)},[v,nt,tt,Ge.left,Ge.top]),lt=a.useCallback(e=>v?Ge.top+(1-(Ie?.fraction(e)??0))*Ge.height:Ge.left+(Ie?.fraction(e)??0)*Ge.width,[v,Ge.left,Ge.top,Ge.width,Ge.height,Ie]),it=nt(Math.min(Math.max(0,Fe.min),Fe.max)),rt={plot:Ge,values:Me,visible:xe.visible,colors:ze,scale:Fe,band:et,horizontal:v,valuePx:nt,categoryPx:tt,point:at,categoryScale:Ie,categoryValuePx:lt,zeroPx:it,categories:Ce,format:Ne,size:le},st=T?T(rt):F,ot=!1===ne?{mode:"none"}:!0===ne||void 0===ne?{}:ne,ct=ot.mode??(T?"item":"index"),dt=null===be?null:st[be]??null,ut=T?dt?dt.index:null:ge,ht=T?st.length:Se,mt=()=>{pe(null),ve(null),ke(null)},ft=e=>{const t=null===e?null:Math.min(ht-1,Math.max(0,e));T?ve(t):pe(t)},xt=e=>{ke(null);ft(((T?be:ge)??(e>0?-1:ht))+e)},gt=null===ut?[]:t.flatMap((e,t)=>{if(!xe.visible[t]||dt&&dt.series!==t)return[];const n=Me[t]?.[ut];return n&&null!==n.value?[{seriesIndex:t,name:e.name,color:n.color??ze[t],value:n.value,formatted:Ne(n.value),label:n.label}]:[]}),pt=dt&&O?O(dt):null,bt=pt?pt.items:"item"===ct&>.length>1&&null!==ye?[gt.reduce((e,t)=>Math.abs(nt(t.value??0)-ye)<Math.abs(nt(e.value??0)-ye)?t:e)]:gt,vt=dt?Me[dt.series]?.[dt.index]?.x??l?.[dt.index]??dt.index:void 0,yt=dt?dt.x:v?nt(bt[0]?.value??0):Ge.left+tt(ut??0),kt=dt?dt.y:v?Ge.top+tt(ut??0):Ge.top,wt=dt?(dt.x-Ge.left)/Math.max(1,Ge.width)>.6:(v?Fe.fraction(bt[0]?.value??0):tt(ut??0)/Math.max(1,Qe))>.6,Nt=!1===te?{interactive:!1}:!0===te||void 0===te?{}:te,Mt=!0===te||!1!==te&&t.length>1,zt=Nt.side??"bottom",St={...rt,hovered:xe.hovered,activeIndex:ut,marks:st,activeMark:dt},Ct=0===Se||null===Pe||"value"===$&&null===Ee;return n(X,{...ce,size:le,variant:ie,padded:re,className:se,legendSide:zt,legend:Mt?e(H,{series:t,colors:ze,options:Nt,visibility:xe,size:le,swatch:J,values:Nt.showValue&&null!==ut?t.map((e,t)=>{const n=Me[t]?.[ut]?.value;return null==n?void 0:Ne(n)}):void 0}):null,table:Ct?null:q?.(fe,Ne)??e(D,{id:fe,caption:ee,corner:Be?.label,categories:Ce,series:t,values:Me,format:Ne,locale:Q}),children:[n("div",{ref:de,role:"img",tabIndex:Ct?void 0:0,"aria-label":ee??me.label,"aria-describedby":Ct?void 0:fe,onPointerMove:e=>{"none"!==ct&&(T?ve(((e,t)=>{const n=de.current;if(!n||0===st.length)return null;const a=n.getBoundingClientRect(),l=e-a.left,i=t-a.top;let r=null,s=1/0,o=1/0;return st.forEach((e,t)=>{const n=e.x-l,a=e.y-i,c=Math.sqrt(n*n+a*a);let d;if(void 0===e.rx)d=Math.max(0,c-e.r);else{const t=Math.max(0,Math.abs(n)-e.rx),l=Math.max(0,Math.abs(a)-(e.ry??e.rx));d=Math.sqrt(t*t+l*l)}d<=Z&&(d<s||d===s&&c<o)&&(s=d,o=c,r=t)}),r})(e.clientX,e.clientY)):pe(((e,t)=>{const n=de.current;if(!n||0===Se)return null;const a=n.getBoundingClientRect(),l=v?t-a.top-Ge.top:e-a.left-Ge.left;if(l<-et.step||l>Qe+et.step)return null;const i=W?Se<=1?0:Math.round(l/Qe*(Se-1)):Math.floor(l/et.step);return Math.min(Se-1,Math.max(0,i))})(e.clientX,e.clientY)),"item"===ct&&ke(((e,t)=>{const n=de.current;if(!n)return null;const a=n.getBoundingClientRect();return v?e-a.left:t-a.top})(e.clientX,e.clientY)))},onPointerLeave:mt,onKeyDown:"none"===ct?void 0:e=>{const t=v?"ArrowDown":"ArrowRight",n=v?"ArrowUp":"ArrowLeft";if(e.key===t)xt(1);else if(e.key===n)xt(-1);else if("Home"===e.key)ft(0);else if("End"===e.key)ft(ht-1);else{if("Escape"!==e.key)return;mt()}e.preventDefault()},onBlur:mt,className:A("relative w-full","rounded-(--neba-radius-xs)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"),style:{height:je??U},children:[Ct?e("div",{className:A("flex h-full items-center justify-center text-(--neba-muted-fg)",j[le]),children:ae??he.title}):ue>0?n("svg",{width:ue,height:Ue||"100%",viewBox:`0 0 ${ue} ${Ue}`,"aria-hidden":"true",className:"block overflow-visible",children:[e(Y,{plot:Ge,scale:Fe,band:et,horizontal:v,inset:W,categoryPx:tt,valuePx:nt,tickTexts:Re,categoryTexts:De,categoryScale:Ie,categoryValuePx:lt,valueAxis:We,categoryAxis:Be,fontSize:_e,zeroPx:it}),null===ut||T||"index"!==ct||!1===ot.crosshair?null:(()=>{const t=tt(ut);return e("line",v?{x1:Ge.left,x2:Ge.left+Ge.width,y1:Ge.top+t,y2:Ge.top+t,stroke:"var(--neba-chart-baseline)",strokeWidth:1}:{x1:Ge.left+t,x2:Ge.left+t,y1:Ge.top,y2:Ge.top+Ge.height,stroke:"var(--neba-chart-baseline)",strokeWidth:1})})(),oe(St)]}):null,null!==ut&&bt.length>0&&"none"!==ct?ot.render?e("div",{className:"pointer-events-none absolute z-10",style:wt?{right:`calc(100% - ${yt}px + 10px)`,top:kt}:{left:yt+10,top:kt},children:ot.render({index:ut,category:vt??Ce[ut],items:bt})}):e(L,{heading:pt?pt.heading:m(vt??Ce[ut],Q),items:bt,x:yt,y:kt,flip:wt,size:le}):null]}),"none"===ct?null:e(V,{heading:null===ut?void 0:pt?.heading??m(vt??Ce[ut],Q),items:bt})]})}function Y({plot:a,scale:l,horizontal:i,categoryPx:r,valuePx:s,tickTexts:o,categoryTexts:c,categoryScale:d,categoryValuePx:u,valueAxis:m,categoryAxis:f,fontSize:x,zeroPx:g}){const y=!1!==m?.grid&&!m?.hidden,k=!f?.hidden&&(f?.grid??null!==d),w=e=>d?u(d.ticks[e]):(i?a.top:a.left)+r(e),N=v(c.length,i?a.height:a.width,i?1.8*x:Math.max(...c.map(e=>b(e,x)),1)+12),M=v(l.ticks.length,i?a.width:a.height,i?Math.max(...o.map(e=>b(e,x)),1)+16:2*x),z=c.length>1?Math.abs(w(1)-w(0)):a.width,S=l.ticks.length>1?Math.abs(s(l.ticks[1])-s(l.ticks[0])):a.height,C=h(c.length,N,z,i?1.8*x:b(c[c.length-1]??"",x)),A=h(l.ticks.length,M,S,i?b(o[o.length-1]??"",x):1.6*x);return n("g",{children:[l.ticks.map((t,r)=>{const c=s(t),d=Math.abs(t)<1e-9;return n("g",{children:[y?e("line",i?{x1:c,x2:c,y1:a.top,y2:a.top+a.height,stroke:d?"var(--neba-chart-baseline)":"var(--neba-chart-grid)",strokeWidth:1}:{x1:a.left,x2:a.left+a.width,y1:c,y2:c,stroke:d?"var(--neba-chart-baseline)":"var(--neba-chart-grid)",strokeWidth:1}):null,m?.hidden||!p(r,l.ticks.length,M,A)?null:e("text",i?{x:c,y:a.top+a.height+x+6,textAnchor:0===r?"start":r===l.ticks.length-1?"end":"middle",fontSize:x,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:o[r]}:{x:a.left-8,y:c,textAnchor:"end",dominantBaseline:"central",fontSize:x,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:o[r]})]},t)}),f?.hidden?null:n(t,{children:[e("line",i?{x1:g,x2:g,y1:a.top,y2:a.top+a.height,stroke:"var(--neba-chart-axis)",strokeWidth:1}:{x1:a.left,x2:a.left+a.width,y1:g,y2:g,stroke:"var(--neba-chart-axis)",strokeWidth:1}),c.map((t,l)=>{const r=w(l),s=p(l,c.length,N,C);return i?s?e("text",{x:a.left-8,y:r,textAnchor:"end",dominantBaseline:"central",fontSize:x,fill:"var(--neba-muted-fg)",className:d?"tabular-nums":void 0,children:t},l):null:n("g",{children:[k?e("line",{x1:r,x2:r,y1:a.top,y2:a.top+a.height,stroke:"var(--neba-chart-grid)",strokeWidth:1}):null,s?e("text",{x:r,y:a.top+a.height+x+6,textAnchor:d?0===l?"start":l===c.length-1?"end":"middle":"middle",fontSize:x,fill:"var(--neba-muted-fg)",className:d?"tabular-nums":void 0,children:t}):null]},l)})]}),m?.label?e("text",{x:i?a.left+a.width:a.left,y:i?a.top+a.height+2*x+12:a.top-8,textAnchor:i?"end":"start",fontSize:x,fill:"var(--neba-muted-fg)",fontWeight:500,children:m.label}):null,f?.label&&!i?e("text",{x:a.left+a.width,y:a.top+a.height+2*x+12,textAnchor:"end",fontSize:x,fill:"var(--neba-muted-fg)",fontWeight:500,children:f.label}):null]})}export{D as ChartDataTable,H as ChartLegendBar,T as ChartScaleLegend,V as ChartStatus,X as ChartSurface,L as ChartTooltipPanel,E as useMeasuredWidth,I as useVisibility};
|
package/dist/internal/date.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{memoise as t}from"./cache.js";import{dateFormatter as e}from"./format.js";export const YEAR_PAGE_SIZE=12;export function makeDate(t,e,r){const n=new Date(0);return n.setFullYear(t,e,r),n.setHours(0,0,0,0),n}export function isValidDate(t){return t instanceof Date&&!Number.isNaN(t.getTime())}export function startOfDay(t){const e=new Date(t.getTime());return e.setHours(0,0,0,0),e}export function startOfMonth(t){return makeDate(t.getFullYear(),t.getMonth(),1)}export function startOfYear(t){return makeDate(t.getFullYear(),0,1)}export function startOfUnit(t,e){return"year"===e?startOfYear(t):"month"===e?startOfMonth(t):startOfDay(t)}export function endOfUnit(t,e){const r=t.getFullYear();return"year"===e?makeDate(r,11,31):"month"===e?makeDate(r,t.getMonth(),daysInMonth(r,t.getMonth())):startOfDay(t)}export function daysInMonth(t,e){return makeDate(t,e+1,0).getDate()}export function today(){return startOfDay(new Date)}export function addDays(t,e){const r=new Date(t.getTime());return r.setDate(r.getDate()+e),r}export function addMonths(t,e){const r=t.getFullYear(),n=t.getMonth()+e,o=new Date(t.getTime()),a=makeDate(r,n,1);return o.setFullYear(a.getFullYear(),a.getMonth(),Math.min(t.getDate(),daysInMonth(a.getFullYear(),a.getMonth()))),o}export function addYears(t,e){return addMonths(t,12*e)}export function compareDay(t,e){return startOfDay(t).getTime()-startOfDay(e).getTime()}export function isSameDay(t,e){return isValidDate(t)&&isValidDate(e)&&0===compareDay(t,e)}export function isSameMonth(t,e){return isValidDate(t)&&isValidDate(e)&&t.getFullYear()===e.getFullYear()&&t.getMonth()===e.getMonth()}export function isDayInRange(t,e,r){return!(!isValidDate(e)||!isValidDate(r))&&(compareDay(t,e)>0&&compareDay(t,r)<0)}export function clampDate(t,e,r){return isValidDate(e)&&t.getTime()<e.getTime()?new Date(e.getTime()):isValidDate(r)&&t.getTime()>r.getTime()?new Date(r.getTime()):t}export function isDayOutside(t,e,r){return!!(isValidDate(e)&&compareDay(t,e)<0)||isValidDate(r)&&compareDay(t,r)>0}export function isUnitOutside(t,e,r,n){return!!(isValidDate(r)&&compareDay(endOfUnit(t,e),r)<0)||isValidDate(n)&&compareDay(startOfUnit(t,e),n)>0}export function minutesOfDay(t){return 60*t.getHours()+t.getMinutes()}export function secondsOfDay(t){return 3600*t.getHours()+60*t.getMinutes()+t.getSeconds()}export function timeUnitSpan(t,e){const r=secondsOfDay(e);if("hour"===t){const t=3600*Math.floor(r/3600);return[t,t+3599]}if("minute"===t){const t=60*Math.floor(r/60);return[t,t+59]}if("second"===t)return[r,r];const n=e.getHours()<12?0:43200;return[n,n+43200-1]}export function withTime(t,e){const r=new Date(t.getTime());return r.setHours(e.hours??r.getHours(),e.minutes??r.getMinutes(),e.seconds??r.getSeconds(),0),r}export function mergeDateAndTime(t,e){return withTime(startOfDay(t),{hours:e.getHours(),minutes:e.getMinutes(),seconds:e.getSeconds()})}export function calendarWeeks(t,e){const r=startOfMonth(t),n=(r.getDay()-e+7)%7,o=addDays(r,-n);return Array.from({length:6},(t,e)=>Array.from({length:7},(t,r)=>addDays(o,7*e+r)))}export function yearPageStart(t){return t-(t%12+12)%12}export function formatDate(t,r,n){return isValidDate(t)?e(r,n).format(t):""}const r=Array.from({length:24},(t,e)=>new Date(2027,e%12,21+e%7,e,58,58));export function displaySamples(t,n){const o=e(t,n);return[...new Set(r.map(t=>o.format(t)))]}export function withPlaceholder(t,e){return"string"==typeof e&&""!==e?[...t,e]:t}export function toISODate(t){const e=t=>String(t).padStart(2,"0");return`${String(t.getFullYear()).padStart(4,"0")}-${e(t.getMonth()+1)}-${e(t.getDate())}`}export function toISOMonth(t){return`${String(t.getFullYear()).padStart(4,"0")}-${String(t.getMonth()+1).padStart(2,"0")}`}export function toISOYear(t){return String(t.getFullYear()).padStart(4,"0")}export function toISOTime(t,e=!1){const r=t=>String(t).padStart(2,"0"),n=`${r(t.getHours())}:${r(t.getMinutes())}`;return e?`${n}:${r(t.getSeconds())}`:n}export function toISODateTime(t,e=!1){return`${toISODate(t)}T${toISOTime(t,e)}`}const n=makeDate(2021,7,1);export function weekdayLabels(t,r,o="short"){const a=e(t,{weekday:o});return Array.from({length:7},(t,e)=>a.format(addDays(n,(r+e)%7)))}export function monthLabels(t,r="short"){const n=e(t,{month:r});return Array.from({length:12},(t,e)=>n.format(makeDate(2021,e,1)))}export function isMonthBeforeYear(t){const r=e(t,{year:"numeric",month:"long"}).formatToParts(n);return r.findIndex(t=>"month"===t.type)<r.findIndex(t=>"year"===t.type)}export function isHour12(t){const r=e(t,{hour:"numeric"}).resolvedOptions();return r.hourCycle?"h11"===r.hourCycle||"h12"===r.hourCycle:!0===r.hour12}export function meridiemLabels(t){const r=e(t,{hour:"numeric",hour12:!0}),o=t=>{const e=r.formatToParts(withTime(n,{hours:t})).find(t=>"dayPeriod"===t.type);return e?.value??(t<12?"AM":"PM")};return[o(9),o(21)]}const o=new Map;export function localeWeekStart(e){return t(o,e??"",()=>function(t){try{const e=t??(new Intl.DateTimeFormat).resolvedOptions().locale,r=new Intl.Locale(e),n="function"==typeof r.getWeekInfo?r.getWeekInfo():r.weekInfo;if("number"==typeof n?.firstDay)return n.firstDay%7}catch{}return 0}(e))}
|
package/dist/internal/drag.d.ts
CHANGED
|
@@ -3,17 +3,19 @@
|
|
|
3
3
|
* that gives all of it back.
|
|
4
4
|
*
|
|
5
5
|
* Five components drag something: a Sidebar's edge, a Panes boundary, a
|
|
6
|
-
* WindowPane by its bar or its corner, a ScrollZone's strip, a DataTable's
|
|
7
|
-
* column rule
|
|
8
|
-
* is. What was written
|
|
9
|
-
* around it — three listeners, a
|
|
10
|
-
* selection, and a teardown an unmount
|
|
6
|
+
* WindowPane by its bar or its corner, a ScrollZone's strip, and a DataTable's
|
|
7
|
+
* column rule, its column headers and a run of its rows. The arithmetic differs
|
|
8
|
+
* in every one of them and stays where it is. What was written six times and
|
|
9
|
+
* had already drifted is the scaffold around it — three listeners, a
|
|
10
|
+
* `dataset.dragging`, the document's text selection, and a teardown an unmount
|
|
11
|
+
* can call.
|
|
11
12
|
*
|
|
12
13
|
* The drift is the reason this exists rather than the repetition. A DataTable's
|
|
13
14
|
* column resize was the one copy with no selection suppression in it, so
|
|
14
15
|
* dragging a column boundary in Safari selected the text of every cell the
|
|
15
16
|
* pointer crossed; and it was the one with no unmount teardown, so a table that
|
|
16
|
-
* went away mid-drag left two listeners on a detached node.
|
|
17
|
+
* went away mid-drag left two listeners on a detached node. Its row-range drag
|
|
18
|
+
* was the last copy and had the same hole in it, over more cells.
|
|
17
19
|
*
|
|
18
20
|
* There is deliberately **no requestAnimationFrame in here.** A `pointermove`
|
|
19
21
|
* is already delivered once per frame in every browser the library supports —
|
package/dist/internal/drag.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export function beginPointerDrag({target:e,pointerId:t,onMove:r,onEnd:n,selectable:o=!0,mark:s=!0}){const i=o?function(){const e=document.body,t=e.style.getPropertyValue("-webkit-user-select");return e.style.setProperty("-webkit-user-select","none"),()=>{t?e.style.setProperty("-webkit-user-select",t):e.style.removeProperty("-webkit-user-select")}}():null;s&&(e.dataset.dragging="true")
|
|
1
|
+
export function beginPointerDrag({target:e,pointerId:t,onMove:r,onEnd:n,selectable:o=!0,mark:s=!0}){const i=o?function(){const e=document.body,t=e.style.getPropertyValue("-webkit-user-select");return e.style.setProperty("-webkit-user-select","none"),()=>{t?e.style.setProperty("-webkit-user-select",t):e.style.removeProperty("-webkit-user-select")}}():null;s&&(e.dataset.dragging="true");try{e.setPointerCapture?.(t)}catch{}let a=!0;const c=()=>{a&&(a=!1,e.removeEventListener("pointermove",r),e.removeEventListener("pointerup",l),e.removeEventListener("pointercancel",l),s&&delete e.dataset.dragging,i?.())},l=()=>{c(),n?.()};return e.addEventListener("pointermove",r),e.addEventListener("pointerup",l),e.addEventListener("pointercancel",l),c}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* The `Intl`
|
|
2
|
+
* The `Intl` objects, memoised.
|
|
3
3
|
*
|
|
4
|
-
* Here for the reason everything else in this folder is:
|
|
5
|
-
*
|
|
4
|
+
* Here for the reason everything else in this folder is: unrelated parts of the
|
|
5
|
+
* library construct them, and constructing one is the expensive half of
|
|
6
6
|
* using one. Measured on V8, `new Intl.NumberFormat(...).format(n)` costs about
|
|
7
7
|
* 16µs and `format(n)` on a formatter that already exists costs about 0.3µs —
|
|
8
8
|
* fifty-five times the work to produce the same string.
|
|
@@ -13,10 +13,11 @@
|
|
|
13
13
|
* one per category and one per tooltip row, and it writes all of them again on
|
|
14
14
|
* every re-render — which, on a chart being hovered, is every frame.
|
|
15
15
|
*
|
|
16
|
-
* The cache is keyed on the locale and the options together, and it
|
|
17
|
-
*
|
|
18
|
-
*
|
|
19
|
-
*
|
|
16
|
+
* The cache is keyed on the locale and the options together, and it goes
|
|
17
|
+
* through `memoise` so it cannot grow without bound. Nothing here grows with
|
|
18
|
+
* the size of a table or the length of a series — a page has a handful of
|
|
19
|
+
* option objects — but both halves of the key reach these functions from public
|
|
20
|
+
* props, so neither half is the library's to promise anything about.
|
|
20
21
|
*
|
|
21
22
|
* The options object is deliberately *not* part of the key by identity. A caller
|
|
22
23
|
* writing `format={{ style: 'currency', currency: 'USD' }}` inline hands over a
|
|
@@ -25,5 +26,18 @@
|
|
|
25
26
|
*/
|
|
26
27
|
/** A memoised `Intl.DateTimeFormat`. */
|
|
27
28
|
export declare function dateFormatter(locale: string | undefined, options: Intl.DateTimeFormatOptions): Intl.DateTimeFormat;
|
|
29
|
+
/**
|
|
30
|
+
* A memoised `Intl.Segmenter`, or `null` on a runtime that has none.
|
|
31
|
+
*
|
|
32
|
+
* The same rule as the two above, and the one constructor that was still being
|
|
33
|
+
* built per call. `AnimateTyping` asks for a string's graphemes, `AnimateSplit`
|
|
34
|
+
* for its words and `AnimateScramble` for its graphemes again — three effects
|
|
35
|
+
* that a page may well hold several of, each rebuilding a segmenter for a
|
|
36
|
+
* string that has not changed.
|
|
37
|
+
*
|
|
38
|
+
* `null` rather than a throw where `Intl.Segmenter` is missing: a caller can
|
|
39
|
+
* fall back to a spread, and a text effect is not worth taking a page down for.
|
|
40
|
+
*/
|
|
41
|
+
export declare function segmenter(locale: string | undefined, granularity: Intl.SegmenterOptions['granularity']): Intl.Segmenter | null;
|
|
28
42
|
/** A memoised `Intl.NumberFormat`. */
|
|
29
43
|
export declare function numberFormatter(locale: string | undefined, options?: Intl.NumberFormatOptions): Intl.NumberFormat;
|
package/dist/internal/format.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
function t(t
|
|
1
|
+
import{memoise as n}from"./cache.js";function t(n,t){return`${n??""}\0${t?JSON.stringify(t):""}`}const e=new Map;export function dateFormatter(r,o){return n(e,t(r,o),()=>new Intl.DateTimeFormat(r,o))}const r=new Map;export function segmenter(e,o){return"undefined"!=typeof Intl&&"Segmenter"in Intl?n(r,t(e,{granularity:o}),()=>new Intl.Segmenter(e,{granularity:o})):null}const o=new Map;export function numberFormatter(e,r){return n(o,t(e,r),()=>new Intl.NumberFormat(e,r))}
|
package/dist/internal/grid.d.ts
CHANGED
|
@@ -36,6 +36,22 @@ export declare function columnCount(value: number): string;
|
|
|
36
36
|
export declare function columnUnits(value: number, min: number): string;
|
|
37
37
|
export declare const spanValue: (value: number) => string;
|
|
38
38
|
export declare const offsetValue: (value: number) => string;
|
|
39
|
+
/**
|
|
40
|
+
* A width a column count cannot reach.
|
|
41
|
+
*
|
|
42
|
+
* `auto` is the contents' own width — an icon, a chip, a button at the end of
|
|
43
|
+
* a row — and `grow` is that plus whatever is left over in the row, which is
|
|
44
|
+
* how a title sits between an icon and an action. Neither is a share of
|
|
45
|
+
* twelve, so neither can come out of the arithmetic above.
|
|
46
|
+
*
|
|
47
|
+
* A number points back at `--n-col-width`, the arithmetic named in
|
|
48
|
+
* `styles.css`, rather than restating it: that is what lets one map mix the
|
|
49
|
+
* two — `span={{ xs: 'grow', md: 4 }}` — without the keyword at a narrow
|
|
50
|
+
* width leaking into a wider one.
|
|
51
|
+
*/
|
|
52
|
+
export declare function spanWidth(value: number | 'auto' | 'grow'): string;
|
|
53
|
+
/** Which of the two keywords takes the space the row has left. */
|
|
54
|
+
export declare function spanGrow(value: number | 'auto' | 'grow'): string;
|
|
39
55
|
/**
|
|
40
56
|
* A gutter, as a length.
|
|
41
57
|
*
|
package/dist/internal/grid.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export function columnCount(t){return String(Math.max(1,Math.round(t)))}export function columnUnits(t,e){return String(Math.max(e,Math.round(t)))}export const spanValue=t=>columnUnits(t,1);export const offsetValue=t=>columnUnits(t,0);export function spacingValue(t){const e=.25*Math.max(0,t);return`${Number(e.toFixed(5))}rem`}export const justifyContentClasses={start:"justify-start",center:"justify-center",end:"justify-end","space-between":"justify-between","space-around":"justify-around","space-evenly":"justify-evenly",stretch:"justify-stretch"};export const alignItemsClasses={start:"items-start",center:"items-center",end:"items-end",stretch:"items-stretch",baseline:"items-baseline"};export const alignContentClasses={start:"content-start",center:"content-center",end:"content-end","space-between":"content-between","space-around":"content-around","space-evenly":"content-evenly",stretch:"content-stretch"};export const alignSelfClasses={auto:"self-auto",start:"self-start",center:"self-center",end:"self-end",stretch:"self-stretch",baseline:"self-baseline"};
|
|
1
|
+
export function columnCount(t){return String(Math.max(1,Math.round(t)))}export function columnUnits(t,e){return String(Math.max(e,Math.round(t)))}export const spanValue=t=>columnUnits(t,1);export const offsetValue=t=>columnUnits(t,0);export function spanWidth(t){return"number"==typeof t?"var(--n-col-width)":"auto"}export function spanGrow(t){return"grow"===t?"1":"0"}export function spacingValue(t){const e=.25*Math.max(0,t);return`${Number(e.toFixed(5))}rem`}export const justifyContentClasses={start:"justify-start",center:"justify-center",end:"justify-end","space-between":"justify-between","space-around":"justify-around","space-evenly":"justify-evenly",stretch:"justify-stretch"};export const alignItemsClasses={start:"items-start",center:"items-center",end:"items-end",stretch:"items-stretch",baseline:"items-baseline"};export const alignContentClasses={start:"content-start",center:"content-center",end:"content-end","space-between":"content-between","space-around":"content-around","space-evenly":"content-evenly",stretch:"content-stretch"};export const alignSelfClasses={auto:"self-auto",start:"self-start",center:"self-center",end:"self-end",stretch:"self-stretch",baseline:"self-baseline"};
|
package/dist/internal/i18n.d.ts
CHANGED
|
@@ -285,9 +285,69 @@ export interface CarouselMessages {
|
|
|
285
285
|
slide: string;
|
|
286
286
|
previous: string;
|
|
287
287
|
next: string;
|
|
288
|
+
/**
|
|
289
|
+
* The button that stops the slides advancing on their own, and the same
|
|
290
|
+
* button once they have been stopped.
|
|
291
|
+
*
|
|
292
|
+
* It says what it will do rather than what the carousel is doing, which is
|
|
293
|
+
* what a button's name is for — and it names the object, because a lone
|
|
294
|
+
* "Pause" tells a screen reader's element list nothing about which of the
|
|
295
|
+
* things on the page it would pause.
|
|
296
|
+
*/
|
|
297
|
+
pause: string;
|
|
298
|
+
play: string;
|
|
288
299
|
}
|
|
289
300
|
/** The `carousel` namespace, as Carousel read it. */
|
|
290
301
|
export declare const carouselMessages: MessageTable<CarouselMessages>;
|
|
302
|
+
/**
|
|
303
|
+
* Every string a picker says that is not a date.
|
|
304
|
+
*
|
|
305
|
+
* One object rather than twenty props. These are a set: a caller who has to
|
|
306
|
+
* translate "Previous month" has to translate "Next month" in the same breath,
|
|
307
|
+
* and a component with twenty `*Label` props is a component whose signature is
|
|
308
|
+
* mostly apology. The same argument is why they are in here rather than
|
|
309
|
+
* defaulted in the pickers: a product in Korean should get all twenty from its
|
|
310
|
+
* `locale`, and the `labels` prop is then for the wording rather than for the
|
|
311
|
+
* language.
|
|
312
|
+
*
|
|
313
|
+
* The dates themselves are never in here — those come from `Intl`, which
|
|
314
|
+
* already knows what July is called in more languages than this file ever will.
|
|
315
|
+
*/
|
|
316
|
+
export interface PickerMessages {
|
|
317
|
+
/** The calendar's steppers, in day view. */
|
|
318
|
+
previousMonth: string;
|
|
319
|
+
nextMonth: string;
|
|
320
|
+
/** The same steppers in month view, where they move by a year. */
|
|
321
|
+
previousYear: string;
|
|
322
|
+
nextYear: string;
|
|
323
|
+
/** And in year view, where they move by a page of twelve. */
|
|
324
|
+
previousYears: string;
|
|
325
|
+
nextYears: string;
|
|
326
|
+
/** The two header buttons that open the month grid and the year grid. */
|
|
327
|
+
chooseMonth: string;
|
|
328
|
+
chooseYear: string;
|
|
329
|
+
/**
|
|
330
|
+
* The footer's actions. Three shortcuts rather than one because the button
|
|
331
|
+
* jumps to the current *unit*, and a month picker whose footer says "Today"
|
|
332
|
+
* is offering a day it has no way to accept.
|
|
333
|
+
*/
|
|
334
|
+
today: string;
|
|
335
|
+
thisMonth: string;
|
|
336
|
+
thisYear: string;
|
|
337
|
+
now: string;
|
|
338
|
+
clear: string;
|
|
339
|
+
done: string;
|
|
340
|
+
/** The clock's columns. */
|
|
341
|
+
hour: string;
|
|
342
|
+
minute: string;
|
|
343
|
+
second: string;
|
|
344
|
+
meridiem: string;
|
|
345
|
+
/** Which end of a range the calendar is currently asking for. */
|
|
346
|
+
start: string;
|
|
347
|
+
end: string;
|
|
348
|
+
}
|
|
349
|
+
/** The `picker` namespace, as the four date and time pickers read it. */
|
|
350
|
+
export declare const pickerMessages: MessageTable<PickerMessages>;
|
|
291
351
|
/**
|
|
292
352
|
* The gallery, and the viewer a tile opens into.
|
|
293
353
|
*
|
|
@@ -306,6 +366,14 @@ export interface GalleryMessages {
|
|
|
306
366
|
}
|
|
307
367
|
/** The `gallery` namespace, as Gallery and its viewer read it. */
|
|
308
368
|
export declare const galleryMessages: MessageTable<GalleryMessages>;
|
|
369
|
+
export interface ImageMessages {
|
|
370
|
+
/**
|
|
371
|
+
* What stands where the picture was, when the file did not arrive and the
|
|
372
|
+
* caller gave no `alt` to say what it was.
|
|
373
|
+
*/
|
|
374
|
+
unavailable: string;
|
|
375
|
+
}
|
|
376
|
+
export declare const imageMessages: MessageTable<ImageMessages>;
|
|
309
377
|
/**
|
|
310
378
|
* The charts.
|
|
311
379
|
*
|
|
@@ -561,8 +629,12 @@ export interface NebaLocale {
|
|
|
561
629
|
pagination?: Partial<PaginationMessages>;
|
|
562
630
|
/** Carousel. */
|
|
563
631
|
carousel?: Partial<CarouselMessages>;
|
|
632
|
+
/** Picker. */
|
|
633
|
+
picker?: Partial<PickerMessages>;
|
|
564
634
|
/** Gallery. */
|
|
565
635
|
gallery?: Partial<GalleryMessages>;
|
|
636
|
+
/** Image. */
|
|
637
|
+
image?: Partial<ImageMessages>;
|
|
566
638
|
/** Chart. */
|
|
567
639
|
chart?: Partial<ChartMessages>;
|
|
568
640
|
/** Scroll. */
|
package/dist/internal/i18n.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as e from"react";export function fill(e,s){return e.replace(/\{(\w+)\}/g,(e,o)=>s[o]??e)}export const actionMessages={"":{close:"Close",dismiss:"Dismiss",clear:"Clear",remove:"Remove"}};export const confirmMessages={"":{confirm:"Confirm",cancel:"Cancel"}};export const linkMessages={"":{newTab:"(opens in a new tab)"}};export const spoilerMessages={"":{reveal:"Reveal",hide:"Hide",notice:"This may contain spoilers"}};export const chatMessages={"":{sending:"Sending",sent:"Sent",delivered:"Delivered",read:"Read",failed:"Not sent",typing:"Typing…"}};export const emptyMessages={"":{title:"Nothing here"}};export const tableMessages={"":{search:"Search",selectAll:"Select all rows",selectRow:"Select row",rowsPerPage:"Rows per page",range:"{start}–{end} of {total}",selected:"{count} selected",empty:"No data",exportCsv:"Export CSV"}};export const colorMessages={"":{area:"Saturation and brightness",hue:"Hue",alpha:"Opacity",value:"Colour value",swatches:"Preset colours",clear:"Clear",empty:"Choose a colour"}};export const ratingMessages={"":{label:"Rating",value:"{value} out of {max}",empty:"No rating"}};export const numberMessages={"":{increase:"Increase",decrease:"Decrease"}};export const paginationMessages={"":{label:"Pagination",page:"Page {page}",status:"Page {page} of {total}",previous:"Previous page",next:"Next page",first:"First page",last:"Last page"}};export const carouselMessages={"":{label:"Carousel",slide:"Slide {index} of {total}",previous:"Previous slide",next:"Next slide"}};export const galleryMessages={"":{label:"Gallery",item:"Image {index} of {total}",previous:"Previous image",next:"Next image"}};export const chartMessages={"":{label:"Chart"}};export const scrollMessages={"":{label:"Scrollable content",previous:"Scroll back",next:"Scroll forward"}};export const breadcrumbMessages={"":{label:"Breadcrumb",expand:"Show hidden steps"}};export const commandMessages={"":{label:"Command palette",search:"Type a command or search…",empty:"No commands found"}};export const transferMessages={"":{source:"Available",target:"Selected",toTarget:"Move to selected",toSource:"Move to available",search:"Search",selectAll:"Select all",empty:"Nothing here"}};export const anchorMessages={"":{label:"On this page"}};export const comboboxMessages={"":{empty:"No matches",remove:"Remove {label}"}};export const overlayMessages={"":{label:"Overlay"}};export const windowMessages={"":{minimize:"Minimize",maximize:"Maximize",restore:"Restore",resize:"Resize window"}};export const layoutMessages={"":{skipToContent:"Skip to content",sidebar:"Sidebar",openSidebar:"Open sidebar",closeSidebar:"Close sidebar",resizeSidebar:"Resize sidebar"}};export const codeMessages={"":{code:"Code",copy:"Copy",copied:"Copied",copyFailed:"Could not copy",raw:"Raw",prompt:"Prompt"}};export const stepsMessages={"":{previous:"Previous",next:"Next",done:"Done",skip:"Skip",restart:"Start over",completed:"All steps complete",steps:"Steps",position:"{index} of {total}",step:"Step {index}: {title}"}};const
|
|
1
|
+
import*as e from"react";import{memoise as s}from"./cache.js";export function fill(e,s){return e.replace(/\{(\w+)\}/g,(e,o)=>s[o]??e)}export const actionMessages={"":{close:"Close",dismiss:"Dismiss",clear:"Clear",remove:"Remove"}};export const confirmMessages={"":{confirm:"Confirm",cancel:"Cancel"}};export const linkMessages={"":{newTab:"(opens in a new tab)"}};export const spoilerMessages={"":{reveal:"Reveal",hide:"Hide",notice:"This may contain spoilers"}};export const chatMessages={"":{sending:"Sending",sent:"Sent",delivered:"Delivered",read:"Read",failed:"Not sent",typing:"Typing…"}};export const emptyMessages={"":{title:"Nothing here"}};export const tableMessages={"":{search:"Search",selectAll:"Select all rows",selectRow:"Select row",rowsPerPage:"Rows per page",range:"{start}–{end} of {total}",selected:"{count} selected",empty:"No data",exportCsv:"Export CSV"}};export const colorMessages={"":{area:"Saturation and brightness",hue:"Hue",alpha:"Opacity",value:"Colour value",swatches:"Preset colours",clear:"Clear",empty:"Choose a colour"}};export const ratingMessages={"":{label:"Rating",value:"{value} out of {max}",empty:"No rating"}};export const numberMessages={"":{increase:"Increase",decrease:"Decrease"}};export const paginationMessages={"":{label:"Pagination",page:"Page {page}",status:"Page {page} of {total}",previous:"Previous page",next:"Next page",first:"First page",last:"Last page"}};export const carouselMessages={"":{label:"Carousel",slide:"Slide {index} of {total}",previous:"Previous slide",next:"Next slide",pause:"Pause slide show",play:"Play slide show"}};export const pickerMessages={"":{previousMonth:"Previous month",nextMonth:"Next month",previousYear:"Previous year",nextYear:"Next year",previousYears:"Previous years",nextYears:"Next years",chooseMonth:"Choose a month",chooseYear:"Choose a year",today:"Today",thisMonth:"This month",thisYear:"This year",now:"Now",clear:"Clear",done:"Done",hour:"Hour",minute:"Minute",second:"Second",meridiem:"AM/PM",start:"Start",end:"End"}};export const galleryMessages={"":{label:"Gallery",item:"Image {index} of {total}",previous:"Previous image",next:"Next image"}};export const imageMessages={"":{unavailable:"Image unavailable"}};export const chartMessages={"":{label:"Chart"}};export const scrollMessages={"":{label:"Scrollable content",previous:"Scroll back",next:"Scroll forward"}};export const breadcrumbMessages={"":{label:"Breadcrumb",expand:"Show hidden steps"}};export const commandMessages={"":{label:"Command palette",search:"Type a command or search…",empty:"No commands found"}};export const transferMessages={"":{source:"Available",target:"Selected",toTarget:"Move to selected",toSource:"Move to available",search:"Search",selectAll:"Select all",empty:"Nothing here"}};export const anchorMessages={"":{label:"On this page"}};export const comboboxMessages={"":{empty:"No matches",remove:"Remove {label}"}};export const overlayMessages={"":{label:"Overlay"}};export const windowMessages={"":{minimize:"Minimize",maximize:"Maximize",restore:"Restore",resize:"Resize window"}};export const layoutMessages={"":{skipToContent:"Skip to content",sidebar:"Sidebar",openSidebar:"Open sidebar",closeSidebar:"Close sidebar",resizeSidebar:"Resize sidebar"}};export const codeMessages={"":{code:"Code",copy:"Copy",copied:"Copied",copyFailed:"Could not copy",raw:"Raw",prompt:"Prompt"}};export const stepsMessages={"":{previous:"Previous",next:"Next",done:"Done",skip:"Skip",restart:"Start over",completed:"All steps complete",steps:"Steps",position:"{index} of {total}",step:"Step {index}: {title}"}};const o={zh:"zh-hans","zh-cn":"zh-hans","zh-my":"zh-hans","zh-sg":"zh-hans","zh-hk":"zh-hant","zh-mo":"zh-hant","zh-tw":"zh-hant"};const a=new WeakMap;export function resolveMessages(e,t){const r=e[""],n=t?.trim()??"";if(!n)return r;let i=a.get(e);return i||(i=new Map,a.set(e,i)),s(i,n,()=>{const s=function(e){const s=e.toLowerCase().split(/[-_]/).filter(Boolean),o=s[0];if(!o)return[];const a=s.slice(1),t=a.find(e=>/^[a-z]{4}$/.test(e)),r=a.find(e=>/^([a-z]{2}|\d{3})$/.test(e));return[t?`${o}-${t}`:"",r?`${o}-${r}`:"",o].filter(Boolean)}(n).map(s=>{const a=Object.hasOwn(o,s)?o[s]:void 0;return Object.hasOwn(e,s)?e[s]:a&&Object.hasOwn(e,a)?e[a]:void 0}).find(Boolean);return s?{...r,...s}:r})}export function useMessages(s,o){return e.useMemo(()=>resolveMessages(s,o),[s,o])}export function fillMessage(e,s){return e.replace(/\{(\w+)\}/g,(e,o)=>Object.hasOwn(s,o)?s[o]:e)}const t={action:actionMessages,confirm:confirmMessages,link:linkMessages,spoiler:spoilerMessages,chat:chatMessages,empty:emptyMessages,table:tableMessages,color:colorMessages,rating:ratingMessages,number:numberMessages,pagination:paginationMessages,carousel:carouselMessages,picker:pickerMessages,gallery:galleryMessages,image:imageMessages,chart:chartMessages,scroll:scrollMessages,breadcrumb:breadcrumbMessages,anchor:anchorMessages,transfer:transferMessages,command:commandMessages,combobox:comboboxMessages,overlay:overlayMessages,window:windowMessages,layout:layoutMessages,code:codeMessages,steps:stepsMessages};export function registerMessages(e,s){const o=e.trim().toLowerCase();for(const[e,r]of Object.entries(s)){const s=t[e];s&&r&&(s[o]=r,a.delete(s))}}
|
package/dist/internal/icons.d.ts
CHANGED
|
@@ -101,6 +101,17 @@ export declare function CodeIcon(): React.JSX.Element;
|
|
|
101
101
|
* it on the button under a finished guide.
|
|
102
102
|
*/
|
|
103
103
|
export declare function RestartIcon(): React.JSX.Element;
|
|
104
|
+
/**
|
|
105
|
+
* Stop and start, as the pair a rotation control switches between.
|
|
106
|
+
*
|
|
107
|
+
* Drawn as solids rather than as outlines, and at the same optical weight as
|
|
108
|
+
* each other: they sit in one button that swaps between them, so a pair that
|
|
109
|
+
* did not match in weight would read as the button changing size. The triangle
|
|
110
|
+
* is inset a little further than the bars because a shape that tapers to a
|
|
111
|
+
* point looks larger than a rectangle covering the same box.
|
|
112
|
+
*/
|
|
113
|
+
export declare function PauseIcon(): React.JSX.Element;
|
|
114
|
+
export declare function PlayIcon(): React.JSX.Element;
|
|
104
115
|
/**
|
|
105
116
|
* The three dots that stand for what has been left out.
|
|
106
117
|
*
|
|
@@ -112,6 +123,20 @@ export declare function RestartIcon(): React.JSX.Element;
|
|
|
112
123
|
export declare function EllipsisIcon(): React.JSX.Element;
|
|
113
124
|
export declare function StarIcon(): React.JSX.Element;
|
|
114
125
|
export declare function StarOutlineIcon(): React.JSX.Element;
|
|
126
|
+
/**
|
|
127
|
+
* The ring a control that is working draws in place of its own start icon.
|
|
128
|
+
*
|
|
129
|
+
* Two components draw it, and it is here rather than in either of them because
|
|
130
|
+
* a Button that is submitting and a TextField that is checking what was typed
|
|
131
|
+
* have to read as the same object in motion — the same ring at the same weight
|
|
132
|
+
* turning at the same rate. Two drawings would be two objects, and the second
|
|
133
|
+
* one would drift the first time either was touched.
|
|
134
|
+
*
|
|
135
|
+
* The arc is a quarter of the circle behind it, and both are stroked at 2 rather
|
|
136
|
+
* than the 1.5 every other glyph here uses: a ring that turns is read as a
|
|
137
|
+
* shape rather than as a line, and at 1.5 it reads as a smudge.
|
|
138
|
+
*/
|
|
139
|
+
export declare function SpinnerIcon(): React.JSX.Element;
|
|
115
140
|
/** The filled dot: the chosen one of a set, where a tick would say "and". */
|
|
116
141
|
export declare function DotIcon(): React.JSX.Element;
|
|
117
142
|
/** The neutral note: a circled `i` without the serif problem an `i` has at 16px. */
|
package/dist/internal/icons.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as r,jsxs as e}from"react/jsx-runtime";export function CloseIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 4.5 7 7m0-7-7 7",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function ChevronIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 6.5 3.5 3.5 3.5-3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function CheckIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m3.5 8.5 3 3 6-6",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})})}export function MinusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function PlusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M8 3.5v9M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function TrendUpIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 11 6.5 7.5 9 10l4-4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 6h3.5v3.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function TrendDownIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 5 6.5 8.5 9 6l4 4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 10h3.5V6.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CalendarIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"2",y:"3.25",width:"12",height:"10.75",rx:"2",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M2 6.75h12",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M5.25 1.75v2.5M10.75 1.75v2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ClockIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 4.5V8l2.4 1.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function ArrowRightIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3 8h10m-3.5-3.5L13 8l-3.5 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function LinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M6.5 9.5a2.75 2.75 0 0 0 4 .25l1.75-1.75a2.75 2.75 0 0 0-3.9-3.9L7.75 5.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 6.5a2.75 2.75 0 0 0-4-.25L3.75 8a2.75 2.75 0 0 0 3.9 3.9l.6-.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ExternalLinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M12.75 9.25v2.5a1.5 1.5 0 0 1-1.5 1.5h-7a1.5 1.5 0 0 1-1.5-1.5v-7a1.5 1.5 0 0 1 1.5-1.5h2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 2.75h3.75V6.5M7.25 8.75l5.75-5.75",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CopyIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"5.75",y:"5.75",width:"7.5",height:"7.5",rx:"1.75",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M10.25 3.6a1.85 1.85 0 0 0-1.5-.85h-4a2 2 0 0 0-2 2v4c0 .62.28 1.17.72 1.54",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function CodeIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M5.75 4.5 2.5 8l3.25 3.5m4.5-7L13.5 8l-3.25 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function RestartIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M13 8a5 5 0 1 1-1.6-3.67",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M13.25 2.25v3h-3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function EllipsisIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"3.5",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"8",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"12.5",cy:"8",r:"1.15",fill:"currentColor"})]})}const o="M8 1.4 9.71 5.65 14.28 5.96 10.76 8.9 11.88 13.34 8 10.9 4.12 13.34 5.24 8.9 1.72 5.96 6.29 5.65Z";export function StarIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:o,fill:"currentColor",stroke:"currentColor",strokeLinejoin:"round"})})}export function StarOutlineIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:o,stroke:"currentColor",strokeWidth:"1.25",strokeLinejoin:"round"})})}export function DotIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("circle",{cx:"8",cy:"8",r:"3.25",fill:"currentColor"})})}export function NoteIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 7.25v4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"4.9",r:"0.85",fill:"currentColor"})]})}export function SuccessIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.25 8.25 1.9 1.9 3.6-3.9",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function WarningIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M7.13 2.6 1.9 11.7a1 1 0 0 0 .87 1.5h10.46a1 1 0 0 0 .87-1.5L8.87 2.6a1 1 0 0 0-1.74 0Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),r("path",{d:"M8 6.1v3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"11.2",r:"0.85",fill:"currentColor"})]})}export function DangerIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.9 5.9 4.2 4.2m0-4.2-4.2 4.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function severityIcon(e){switch(e){case"success":return r(SuccessIcon,{});case"warning":return r(WarningIcon,{});case"danger":return r(DangerIcon,{});default:return r(NoteIcon,{})}}
|
|
1
|
+
import{jsx as r,jsxs as e}from"react/jsx-runtime";export function CloseIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 4.5 7 7m0-7-7 7",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function ChevronIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 6.5 3.5 3.5 3.5-3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function CheckIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m3.5 8.5 3 3 6-6",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})})}export function MinusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function PlusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M8 3.5v9M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function TrendUpIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 11 6.5 7.5 9 10l4-4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 6h3.5v3.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function TrendDownIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 5 6.5 8.5 9 6l4 4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 10h3.5V6.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CalendarIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"2",y:"3.25",width:"12",height:"10.75",rx:"2",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M2 6.75h12",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M5.25 1.75v2.5M10.75 1.75v2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ClockIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 4.5V8l2.4 1.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function ArrowRightIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3 8h10m-3.5-3.5L13 8l-3.5 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function LinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M6.5 9.5a2.75 2.75 0 0 0 4 .25l1.75-1.75a2.75 2.75 0 0 0-3.9-3.9L7.75 5.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 6.5a2.75 2.75 0 0 0-4-.25L3.75 8a2.75 2.75 0 0 0 3.9 3.9l.6-.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ExternalLinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M12.75 9.25v2.5a1.5 1.5 0 0 1-1.5 1.5h-7a1.5 1.5 0 0 1-1.5-1.5v-7a1.5 1.5 0 0 1 1.5-1.5h2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 2.75h3.75V6.5M7.25 8.75l5.75-5.75",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CopyIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"5.75",y:"5.75",width:"7.5",height:"7.5",rx:"1.75",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M10.25 3.6a1.85 1.85 0 0 0-1.5-.85h-4a2 2 0 0 0-2 2v4c0 .62.28 1.17.72 1.54",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function CodeIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M5.75 4.5 2.5 8l3.25 3.5m4.5-7L13.5 8l-3.25 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function RestartIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M13 8a5 5 0 1 1-1.6-3.67",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M13.25 2.25v3h-3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function PauseIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:[r("rect",{x:"4",y:"3",width:"2.75",height:"10",rx:"1"}),r("rect",{x:"9.25",y:"3",width:"2.75",height:"10",rx:"1"})]})}export function PlayIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:r("path",{d:"M5.5 3.6a1 1 0 0 1 1.53-.85l6.1 3.9a1.2 1.2 0 0 1 0 2.02l-6.1 3.9a1 1 0 0 1-1.53-.85V3.6Z"})})}export function EllipsisIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"3.5",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"8",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"12.5",cy:"8",r:"1.15",fill:"currentColor"})]})}const o="M8 1.4 9.71 5.65 14.28 5.96 10.76 8.9 11.88 13.34 8 10.9 4.12 13.34 5.24 8.9 1.72 5.96 6.29 5.65Z";export function StarIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:o,fill:"currentColor",stroke:"currentColor",strokeLinejoin:"round"})})}export function StarOutlineIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:o,stroke:"currentColor",strokeWidth:"1.25",strokeLinejoin:"round"})})}export function SpinnerIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"animate-spin",children:[r("circle",{cx:"8",cy:"8",r:"6.5",stroke:"currentColor",strokeOpacity:"0.25",strokeWidth:"2"}),r("path",{d:"M14.5 8A6.5 6.5 0 0 0 8 1.5",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})]})}export function DotIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("circle",{cx:"8",cy:"8",r:"3.25",fill:"currentColor"})})}export function NoteIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 7.25v4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"4.9",r:"0.85",fill:"currentColor"})]})}export function SuccessIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.25 8.25 1.9 1.9 3.6-3.9",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function WarningIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M7.13 2.6 1.9 11.7a1 1 0 0 0 .87 1.5h10.46a1 1 0 0 0 .87-1.5L8.87 2.6a1 1 0 0 0-1.74 0Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),r("path",{d:"M8 6.1v3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"11.2",r:"0.85",fill:"currentColor"})]})}export function DangerIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.9 5.9 4.2 4.2m0-4.2-4.2 4.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function severityIcon(e){switch(e){case"success":return r(SuccessIcon,{});case"warning":return r(WarningIcon,{});case"danger":return r(DangerIcon,{});default:return r(NoteIcon,{})}}
|
package/dist/internal/link.d.ts
CHANGED
|
@@ -5,10 +5,11 @@
|
|
|
5
5
|
* pointing back at this one, and a `Referer` header naming it. Modern browsers
|
|
6
6
|
* imply `noopener` for `target="_blank"`; none of them implies `noreferrer`,
|
|
7
7
|
* and neither is implied for a named target. So the two tokens are added
|
|
8
|
-
* wherever a component lets a caller choose where a link opens — TextLink,
|
|
9
|
-
*
|
|
10
|
-
*
|
|
11
|
-
*
|
|
8
|
+
* wherever a component lets a caller choose where a link opens — TextLink, a
|
|
9
|
+
* Menu row, a NavigationMenu link, a ChatBubble's link, an AppLogo, a
|
|
10
|
+
* BottomNavigation destination — and they are added the same way in all of
|
|
11
|
+
* them, because a library where only some are safe is a library whose users
|
|
12
|
+
* cannot tell which.
|
|
12
13
|
*
|
|
13
14
|
* It is a *merge* and not an override, and that is the whole reason this is a
|
|
14
15
|
* function rather than a string. The common reason to write a `rel` by hand is
|
package/dist/internal/media.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import*as e from"react";const
|
|
1
|
+
"use client";import*as e from"react";import{memoise as t}from"./cache.js";const r=new Map;function n(e){return t(r,e,()=>"undefined"!=typeof window&&window.matchMedia?window.matchMedia(e):null)}export function subscribeToQuery(e,t){const r=n(e);return r?(r.addEventListener("change",t),()=>r.removeEventListener("change",t)):()=>{}}export function queryMatches(e){return n(e)?.matches??!1}export function noMatchOnServer(){return!1}export const breakpointWidths={xs:"0rem",sm:"40rem",md:"48rem",lg:"64rem",xl:"80rem"};let o=null;function u(){if(o)return o;if("undefined"==typeof window||!window.getComputedStyle)return breakpointWidths;const e=getComputedStyle(document.documentElement),t={...breakpointWidths};for(const r of["sm","md","lg","xl"]){const n=e.getPropertyValue(`--neba-breakpoint-${r}`).trim();n&&(t[r]=n)}return o=t,t}export function widthBelow(e){return"xs"===e?null:`(width < ${u()[e]})`}export function widthAtLeast(e){return`(width >= ${u()[e]})`}export function useMediaQuery(t){const r=e.useCallback(e=>t?subscribeToQuery(t,e):()=>{},[t]),n=e.useCallback(()=>!!t&&queryMatches(t),[t]);return e.useSyncExternalStore(r,n,noMatchOnServer)}export const reducedMotionQuery="(prefers-reduced-motion: reduce)";const c=e=>subscribeToQuery(reducedMotionQuery,e),i=()=>queryMatches(reducedMotionQuery);export function usePrefersReducedMotion(){return e.useSyncExternalStore(c,i,noMatchOnServer)}
|
package/dist/internal/observe.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=new Map;let t=null;export function observeResize(r,n){const s="undefined"==typeof ResizeObserver?null:(t??=new ResizeObserver(t=>{for(const r of t){const t=e.get(r.target);if(t)for(const e of[...t])e(r)}}),t);if(!s)return()=>{};let o=e.get(r);return o||(o=new Set,e.set(r,o),s.observe(r)),o.add(n),()=>{const t=e.get(r);t&&(t.delete(n),0===t.size&&(e.delete(r),s.unobserve(r)))}}const r=new Map;export function observeVisibility(e,t,n){const s=function(e){if("undefined"==typeof IntersectionObserver)return null;let t=r.get(e);if(!t){const n=new Map;t={watchers:n,observer:new IntersectionObserver(e=>{for(const t of e){const e=n.get(t.target);if(e)for(const r of[...e])r(t.isIntersecting)}},{threshold:e})},r.set(e,t)}return t}(t);if(!s)return null;let o=s.watchers.get(e);return o||(o=new Set,s.watchers.set(e,o),s.observer.observe(e)),o.add(n),()=>{const
|
|
1
|
+
const e=new Map;let t=null;export function observeResize(r,n){const s="undefined"==typeof ResizeObserver?null:(t??=new ResizeObserver(t=>{for(const r of t){const t=e.get(r.target);if(t)for(const e of[...t])e(r)}}),t);if(!s)return()=>{};let o=e.get(r);return o||(o=new Set,e.set(r,o),s.observe(r)),o.add(n),()=>{const t=e.get(r);t&&(t.delete(n),0===t.size&&(e.delete(r),s.unobserve(r)))}}const r=new Map;export function observeVisibility(e,t,n){const s=function(e){if("undefined"==typeof IntersectionObserver)return null;let t=r.get(e);if(!t){const n=new Map;t={watchers:n,observer:new IntersectionObserver(e=>{for(const t of e){const e=n.get(t.target);if(e)for(const r of[...e])r(t.isIntersecting)}},{threshold:e})},r.set(e,t)}return t}(t);if(!s)return null;let o=s.watchers.get(e);return o||(o=new Set,s.watchers.set(e,o),s.observer.observe(e)),o.add(n),()=>{const o=s.watchers.get(e);o&&(o.delete(n),0===o.size&&(s.watchers.delete(e),s.observer.unobserve(e),0===s.watchers.size&&(s.observer.disconnect(),r.delete(t))))}}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import type { PickerLabels } from './calendar.js';
|
|
3
2
|
import type { NebaColor, NebaElevation, NebaSize, NebaStyleProps } from '../types.js';
|
|
4
3
|
/**
|
|
5
4
|
* The shell all four pickers wear: a field-shaped trigger with a popup hanging
|
|
@@ -74,7 +73,13 @@ interface InternalShellProps extends PickerShellProps {
|
|
|
74
73
|
onClear: () => void;
|
|
75
74
|
open: boolean;
|
|
76
75
|
onOpenChange: (open: boolean) => void;
|
|
77
|
-
|
|
76
|
+
/**
|
|
77
|
+
* The × that empties the control, named. One string rather than the whole
|
|
78
|
+
* `labels` set, which is all the shell ever drew of it — asking for
|
|
79
|
+
* twenty to render one is what had a ColorPicker spreading the picker
|
|
80
|
+
* defaults it does not use over a label it does.
|
|
81
|
+
*/
|
|
82
|
+
clearLabel: string;
|
|
78
83
|
/** `<input type="hidden">` rows, so the control submits with a form. */
|
|
79
84
|
hiddenValues?: Array<{
|
|
80
85
|
name: string;
|
|
@@ -99,7 +104,7 @@ interface InternalShellProps extends PickerShellProps {
|
|
|
99
104
|
* and the way `invalid` re-points the whole colour family at `danger` so the
|
|
100
105
|
* edge, the ring and the message turn over together.
|
|
101
106
|
*/
|
|
102
|
-
export declare function PickerShell({ variant, size, color, density, elevation, label, description, error, invalid, startIcon, fullWidth, disabled, readOnly, required, id, className, style, display, samples, empty, clearable, onClear, open, onOpenChange,
|
|
107
|
+
export declare function PickerShell({ variant, size, color, density, elevation, label, description, error, invalid, startIcon, fullWidth, disabled, readOnly, required, id, className, style, display, samples, empty, clearable, onClear, open, onOpenChange, clearLabel, hiddenValues, sideOffset, popupClassName, children, triggerRef, ...props }: InternalShellProps): React.JSX.Element;
|
|
103
108
|
/**
|
|
104
109
|
* The row of shortcuts under a picker's panel.
|
|
105
110
|
*
|
package/dist/internal/picker.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as
|
|
1
|
+
import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as n from"react";import{Field as a}from"@base-ui/react/field";import{Popover as r}from"@base-ui/react/popover";import{CloseIcon as i}from"./icons.js";import{WidthSizer as t}from"./sizer.js";import{chipRemoveClasses as o,controlTextLeadingClasses as s,cx as d,disabledClasses as c,fieldFocusTransitionClasses as p,fieldHeightClasses as u,fieldReadOnlyClasses as m,fieldRestClasses as f,fieldRingClasses as b,gapClasses as h,iconClasses as x,metaTextClasses as g,paddingXClasses as v,popupFadeClasses as N,radiusClasses as y,stackGapClasses as P,surfaceClasses as w,surfaceSlots as j,transitionClasses as C}from"./styles.js";export function popupSlots(e,l){return{...j(e,l),"--n-fill":`var(--neba-${e}-fill)`,"--n-fill-hover":`var(--neba-${e}-fill-hover)`,"--n-fill-active":`var(--neba-${e}-fill-active)`,"--n-on-solid":`var(--neba-${e}-on-solid)`}}const k=["group relative flex w-full items-center select-none","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",C,p,b,x].join(" ");export const pickerPopupClasses=[w,"border bg-(--n-panel-press)","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]","[outline:none]",N].join(" ");export const popupPaddingClasses={xs:"p-1.5",sm:"p-2",md:"p-2.5",lg:"p-3",xl:"p-3.5"};export function PickerShell({variant:p="outline",size:b="md",color:x="primary",density:N="default",elevation:w=0,label:C,description:$,error:z,invalid:O,startIcon:F,fullWidth:R=!1,disabled:S=!1,readOnly:q=!1,required:D=!1,id:I,className:L,style:E,display:T,samples:V,empty:W,clearable:A=!1,onClear:B,open:G,onOpenChange:H,clearLabel:J,hiddenValues:K,sideOffset:M=6,popupClassName:Q,children:U,triggerRef:X,...Y}){const Z=n.useId(),_=I??`${Z}-trigger`,ee=`${Z}-label`,le=`${Z}-description`,ne=`${Z}-error`,ae=null!=z&&!1!==z&&""!==z,re=O??ae,ie=re?"danger":x,te=S||q,oe=d($?le:null,ae?ne:null)||void 0;return l(a.Root,{disabled:S,invalid:re,className:d("flex-col align-top",P[b],R?"flex w-full":"inline-flex",L),style:{...j(ie,w),...E},...Y,children:[C?e(a.Label,{id:ee,htmlFor:_,className:d(g[b],"font-medium",S?"text-(--neba-disabled-fg)":"text-(--neba-fg)"),children:C}):null,l(r.Root,{open:G,onOpenChange:e=>H(e),children:[l("span",{className:d(k,u[b],s[b],y[b],h[b],v[N][b],S?c[p]:q?m[p]:f[p]),children:[l(r.Trigger,{id:_,ref:X,disabled:S,"aria-labelledby":C?ee:void 0,"aria-describedby":oe,"aria-required":D||void 0,"aria-invalid":re||void 0,className:d("flex min-w-0 flex-1 items-center bg-transparent text-start [font:inherit] text-inherit",h[b],"[outline:none]",te?"cursor-default":"cursor-pointer"),children:[F?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg) transition-[color] duration-(--neba-duration) group-focus-within:text-(--n-accent)",children:F}):null,l("span",{className:"flex min-w-0 flex-1 flex-col",children:[e("span",{className:d("w-full truncate",W?"text-(--neba-muted-fg)":"text-(--neba-fg)"),children:T}),e(t,{samples:V??[]})]})]}),!A||W||te?null:e("button",{type:"button","aria-label":J,className:d(o,"text-(--neba-muted-fg)"),onClick:e=>{e.stopPropagation(),B()},children:e(i,{})})]}),e(r.Portal,{children:e(r.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",sideOffset:M,align:"start",children:e(r.Popup,{initialFocus:!1,className:d(pickerPopupClasses,y[b],popupPaddingClasses[b],s[b],Q),style:popupSlots(ie,3),children:U})})})]}),$?e(a.Description,{id:le,className:d(g[b],"text-(--neba-muted-fg)"),children:$}):null,ae?e(a.Error,{id:ne,match:!0,className:d(g[b],"text-(--n-accent)"),children:z}):null,K?.map((l,n)=>e("input",{type:"hidden",name:l.name,value:l.value},n))]})}export function PickerFooter({size:l,children:n}){return e("div",{className:d("flex items-center justify-end border-t pt-1.5","[border-color:var(--n-line)]",h[l]),children:n})}export function PickerDivider(){return e("div",{"aria-hidden":"true",className:"w-px self-stretch bg-(--n-line)"})}
|
|
@@ -16,7 +16,20 @@
|
|
|
16
16
|
* first time a page carried both.
|
|
17
17
|
*/
|
|
18
18
|
import type * as React from 'react';
|
|
19
|
-
import type { NebaColor, NebaSize } from '../types.js';
|
|
19
|
+
import type { NebaColor, NebaSize, NebaThreshold } from '../types.js';
|
|
20
|
+
/**
|
|
21
|
+
* Which family a reading has earned.
|
|
22
|
+
*
|
|
23
|
+
* A `Meter` and a `GaugeChart` both answer this and had a copy each, which is
|
|
24
|
+
* the arrangement this folder exists to end: two implementations of "which band
|
|
25
|
+
* is this number in" is two chances to disagree about a boundary, on the two
|
|
26
|
+
* components a dashboard is most likely to draw side by side.
|
|
27
|
+
*
|
|
28
|
+
* Written as a scan rather than a sort so the array is read in the order it was
|
|
29
|
+
* given: thresholds are meant to be listed in ascending order, and silently
|
|
30
|
+
* reordering them would hide the one call site that did not.
|
|
31
|
+
*/
|
|
32
|
+
export declare function thresholdColor(value: number, color: NebaColor, thresholds: readonly NebaThreshold[] | undefined): NebaColor;
|
|
20
33
|
/**
|
|
21
34
|
* The props all three indicators take.
|
|
22
35
|
*
|
|
@@ -73,6 +86,16 @@ export declare function progressSlots(color: NebaColor): React.CSSProperties;
|
|
|
73
86
|
* a rule between two paragraphs, not a third of a button.
|
|
74
87
|
*/
|
|
75
88
|
export declare const barThicknessClasses: Record<NebaSize, string>;
|
|
89
|
+
/**
|
|
90
|
+
* How thick the line is, when a caller says so rather than the ladder.
|
|
91
|
+
*
|
|
92
|
+
* In pixels, because that is what the ring's arithmetic already works in and a
|
|
93
|
+
* bar and a ring should not take the number two different ways. `size` still
|
|
94
|
+
* decides everything else — the type scale beside the shape, the ring's
|
|
95
|
+
* diameter — so this is the one measurement pulled out of the step rather than
|
|
96
|
+
* a second size ladder.
|
|
97
|
+
*/
|
|
98
|
+
export type ProgressThickness = number;
|
|
76
99
|
/**
|
|
77
100
|
* The diameter of the ring, in pixels.
|
|
78
101
|
*
|