neba 1.16.2 → 1.17.1
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/README.md +5 -5
- package/dist/a2ui/adapter-catalog.json +1 -0
- package/dist/a2ui/catalog.json +632 -145
- package/dist/a2ui/components.js +1 -1
- package/dist/a2ui/index.d.ts +22 -10
- package/dist/a2ui/index.js +1 -1
- package/dist/a2ui/schema.d.ts +8 -6
- package/dist/a2ui/schema.js +1 -1
- package/dist/components/accordion/Accordion.js +1 -1
- package/dist/components/agent-steps/AgentSteps.js +1 -1
- package/dist/components/alert/Alert.js +1 -1
- package/dist/components/anchor/Anchor.d.ts +3 -1
- package/dist/components/anchor/Anchor.js +1 -1
- package/dist/components/animate-counter/AnimateCounter.d.ts +11 -4
- package/dist/components/animate-counter/AnimateCounter.js +1 -1
- package/dist/components/animate-scramble/AnimateScramble.d.ts +6 -3
- package/dist/components/animate-scramble/AnimateScramble.js +1 -1
- package/dist/components/animate-split/AnimateSplit.d.ts +6 -3
- package/dist/components/animate-split/AnimateSplit.js +1 -1
- package/dist/components/animate-typing/AnimateTyping.js +1 -1
- package/dist/components/app-logo/AppLogo.js +1 -1
- package/dist/components/approval/Approval.js +1 -1
- package/dist/components/avatar/Avatar.js +1 -1
- package/dist/components/bar-chart/BarChart.js +1 -1
- package/dist/components/bottom-navigation/BottomNavigation.js +1 -1
- package/dist/components/box/Box.js +1 -1
- package/dist/components/breadcrumb/Breadcrumb.d.ts +3 -3
- package/dist/components/breadcrumb/Breadcrumb.js +1 -1
- package/dist/components/card/Card.js +1 -1
- package/dist/components/chat-bubble/ChatBubble.js +1 -1
- package/dist/components/chip/Chip.d.ts +4 -1
- package/dist/components/chip/Chip.js +1 -1
- package/dist/components/code-block/CodeBlock.js +1 -1
- package/dist/components/collapsible/Collapsible.js +1 -1
- package/dist/components/color-picker/ColorPicker.d.ts +3 -1
- package/dist/components/color-picker/ColorPicker.js +1 -1
- package/dist/components/combobox/Combobox.js +1 -1
- package/dist/components/command-palette/CommandPalette.js +1 -1
- package/dist/components/confirm/Confirm.js +1 -1
- package/dist/components/context-window/ContextWindow.d.ts +4 -1
- package/dist/components/context-window/ContextWindow.js +1 -1
- package/dist/components/data-list/DataList.d.ts +3 -2
- package/dist/components/data-list/DataList.js +1 -1
- package/dist/components/data-table/DataTable.d.ts +11 -5
- package/dist/components/data-table/DataTable.js +1 -1
- package/dist/components/date-range-picker/DateRangePicker.d.ts +3 -2
- package/dist/components/date-range-picker/DateRangePicker.js +1 -1
- package/dist/components/dialog/Dialog.js +1 -1
- package/dist/components/drawer/Drawer.js +1 -1
- package/dist/components/fieldset/Fieldset.js +1 -1
- package/dist/components/file-picker/FilePicker.d.ts +4 -0
- package/dist/components/file-picker/FilePicker.js +1 -1
- package/dist/components/footer/Footer.d.ts +4 -2
- package/dist/components/form/Form.d.ts +0 -14
- package/dist/components/form/Form.js +1 -1
- package/dist/components/gallery/Gallery.js +1 -1
- package/dist/components/gallery/GalleryViewer.js +1 -1
- package/dist/components/header/Header.d.ts +4 -3
- package/dist/components/heatmap-chart/HeatmapChart.js +1 -1
- package/dist/components/hover-card/HoverCard.d.ts +1 -1
- package/dist/components/how-to-steps/HowToSteps.d.ts +2 -1
- package/dist/components/how-to-steps/HowToSteps.js +1 -1
- package/dist/components/image/Image.d.ts +4 -1
- package/dist/components/image/Image.js +1 -1
- package/dist/components/inline-citation/InlineCitation.d.ts +4 -2
- package/dist/components/inline-citation/InlineCitation.js +1 -1
- package/dist/components/menu/Menu.d.ts +6 -2
- package/dist/components/menu/Menu.js +1 -1
- package/dist/components/mockup/Mockup.js +1 -1
- package/dist/components/navigation-menu/NavigationMenu.d.ts +1 -1
- package/dist/components/navigation-menu/NavigationMenu.js +1 -1
- package/dist/components/number-field/NumberField.js +1 -1
- package/dist/components/overlay/Overlay.d.ts +1 -1
- package/dist/components/page-layout/PageLayout.js +1 -1
- package/dist/components/pagination/Pagination.d.ts +3 -2
- package/dist/components/panes/Panes.js +1 -1
- package/dist/components/pie-chart/PieChart.js +1 -1
- package/dist/components/pill/Pill.js +1 -1
- package/dist/components/popover/Popover.js +1 -1
- package/dist/components/progress-box/ProgressBox.js +1 -1
- package/dist/components/prompt-input/PromptInput.d.ts +5 -3
- package/dist/components/prompt-input/PromptInput.js +1 -1
- package/dist/components/radio-group/RadioGroup.js +1 -1
- package/dist/components/rating/Rating.js +1 -1
- package/dist/components/reasoning/Reasoning.d.ts +7 -4
- package/dist/components/reasoning/Reasoning.js +1 -1
- package/dist/components/scatter-chart/ScatterChart.d.ts +7 -1
- package/dist/components/scatter-chart/ScatterChart.js +1 -1
- package/dist/components/scroll-area/ScrollArea.d.ts +12 -0
- package/dist/components/scroll-area/ScrollArea.js +1 -1
- package/dist/components/scroll-zone/ScrollZone.js +1 -1
- package/dist/components/segmented-button/SegmentedButton.js +1 -1
- package/dist/components/select/Select.d.ts +2 -1
- package/dist/components/select/Select.js +1 -1
- package/dist/components/sidebar/Sidebar.js +1 -1
- package/dist/components/sidebar/SidebarTrigger.js +1 -1
- package/dist/components/skeleton/Skeleton.js +1 -1
- package/dist/components/sources/Sources.d.ts +1 -1
- package/dist/components/sources/Sources.js +1 -1
- package/dist/components/stack/Stack.js +1 -1
- package/dist/components/streaming-text/StreamingText.js +1 -1
- package/dist/components/switch/Switch.d.ts +13 -2
- package/dist/components/switch/Switch.js +1 -1
- package/dist/components/switch/index.d.ts +1 -1
- package/dist/components/table/Table.d.ts +4 -2
- package/dist/components/tabs/Tabs.js +1 -1
- package/dist/components/text-field/TextField.js +1 -1
- package/dist/components/text-link/TextLink.js +1 -1
- package/dist/components/timeline-chart/TimelineChart.d.ts +6 -1
- package/dist/components/timeline-chart/TimelineChart.js +1 -1
- package/dist/components/toggle/Toggle.js +1 -1
- package/dist/components/tool-call/ToolCall.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.js +1 -1
- package/dist/components/tree-view/TreeView.js +1 -1
- package/dist/components/typography/Typography.js +1 -1
- package/dist/components/visually-hidden/VisuallyHidden.d.ts +2 -2
- package/dist/components/window-pane/WindowPane.js +1 -1
- package/dist/hooks/useElementSize.d.ts +6 -2
- package/dist/hooks/useElementSize.js +1 -1
- package/dist/hooks/useMediaQuery.d.ts +3 -2
- package/dist/hooks/useOnScreen.d.ts +2 -2
- package/dist/hooks/useShortcut.d.ts +11 -3
- package/dist/hooks/useShortcut.js +1 -1
- package/dist/internal/animate.d.ts +8 -0
- package/dist/internal/animate.js +1 -1
- package/dist/internal/calendar.js +1 -1
- package/dist/internal/chart-brush.d.ts +3 -1
- package/dist/internal/chart-brush.js +1 -1
- package/dist/internal/chart-frame.d.ts +28 -2
- package/dist/internal/chart-frame.js +1 -1
- package/dist/internal/chart-line.js +1 -1
- package/dist/internal/chart.d.ts +21 -0
- package/dist/internal/chart.js +1 -1
- package/dist/internal/drag.d.ts +15 -0
- package/dist/internal/drag.js +1 -1
- package/dist/internal/drop.d.ts +12 -8
- package/dist/internal/drop.js +1 -1
- package/dist/internal/highlight.js +1 -1
- package/dist/internal/i18n.d.ts +40 -4
- package/dist/internal/i18n.js +1 -1
- package/dist/internal/icons.d.ts +3 -0
- package/dist/internal/icons.js +1 -1
- package/dist/internal/link.d.ts +27 -0
- package/dist/internal/link.js +1 -1
- package/dist/internal/new-tab.d.ts +21 -0
- package/dist/internal/new-tab.js +1 -0
- package/dist/internal/notch.d.ts +23 -1
- package/dist/internal/notch.js +1 -1
- package/dist/internal/observe.d.ts +3 -4
- package/dist/internal/picker.d.ts +21 -3
- package/dist/internal/picker.js +1 -1
- package/dist/internal/run.d.ts +7 -5
- package/dist/internal/run.js +1 -1
- package/dist/internal/search.d.ts +3 -3
- package/dist/internal/styles.d.ts +33 -1
- package/dist/internal/styles.js +1 -1
- 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 +31 -4
- package/package.json +9 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as r from"react";import{Button as o}from"../components/button/Button.js";import{ChevronIcon as l}from"./icons.js";import{controlHeightClasses as a,controlTextClasses as s,cx as i,gapClasses as c,metaTextClasses as d,pressTransitionClasses as u,srOnlyClasses as m,transitionClasses as h}from"./styles.js";import{addDays as g,addMonths as f,addYears as b,calendarWeeks as p,compareDay as y,isDayOutside as v,isMonthBeforeYear as x,isSameDay as w,isSameMonth as D,isUnitOutside as N,isValidDate as S,makeDate as M,meridiemLabels as C,monthLabels as k,startOfDay as z,startOfMonth as P,today as A,weekdayLabels as j,withTime as Y,YEAR_PAGE_SIZE as B,yearPageStart as E}from"./date.js";import{dateFormatter as F}from"./format.js";import{pickerMessages as T,useMessages as H}from"./i18n.js";import{useHydrated as R}from"./media.js";export function usePickerLabels(e,t){const n=H(T,t);return r.useMemo(()=>e?{...n,...e}:n,[n,e])}const I={xs:"1.375rem",sm:"1.625rem",md:"2rem",lg:"2.5rem",xl:"3rem"},K={xs:"rounded-(--neba-radius-xs)",sm:"rounded-(--neba-radius-xs)",md:"rounded-(--neba-radius-sm)",lg:"rounded-(--neba-radius-md)",xl:"rounded-(--neba-radius-lg)"},G={xs:"rounded-s-(--neba-radius-xs)",sm:"rounded-s-(--neba-radius-xs)",md:"rounded-s-(--neba-radius-sm)",lg:"rounded-s-(--neba-radius-md)",xl:"rounded-s-(--neba-radius-lg)"},O={xs:"rounded-e-(--neba-radius-xs)",sm:"rounded-e-(--neba-radius-xs)",md:"rounded-e-(--neba-radius-sm)",lg:"rounded-e-(--neba-radius-md)",xl:"rounded-e-(--neba-radius-lg)"},U=["relative flex select-none items-center justify-center tabular-nums","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",h,u,"focus-visible:z-10 focus-visible:[outline:2px_solid_var(--n-ring)]","focus-visible:[outline-offset:-2px]"].join(" ");function Cell({children:n,label:r,selected:o,inRange:l=!1,rangeEdge:a=null,current:s=!1,muted:c=!1,disabled:d=!1,focused:u=!1,size:m,className:h,onClick:g,onPointerEnter:f,onKeyDown:b}){return t("button",{type:"button",role:"gridcell","aria-label":r,"aria-selected":o,"aria-current":s?"date":void 0,"aria-disabled":d||void 0,tabIndex:u?0:-1,"data-focus-target":u?"true":void 0,className:i(U,"start"===a?G[m]:"end"===a?O[m]:"middle"===a?"rounded-none":K[m],d?"cursor-not-allowed text-(--neba-disabled-fg)":o?"cursor-pointer bg-(--n-fill) font-semibold text-(--n-on-solid) hover:bg-(--n-fill-hover) active:bg-(--n-fill-active)":l?"cursor-pointer bg-(--n-soft) text-(--neba-fg) hover:bg-(--n-soft-hover) active:bg-(--n-soft-press)":s?"cursor-pointer font-semibold text-(--n-on-tint) hover:bg-(--n-soft) active:bg-(--n-soft-press)":c?"cursor-pointer text-(--neba-muted-fg) hover:bg-(--n-soft) active:bg-(--n-soft-press)":"cursor-pointer text-(--neba-fg) hover:bg-(--n-soft) active:bg-(--n-soft-press)",h),onClick:()=>{d||g()},onPointerEnter:f,onKeyDown:b,children:[n,s?e("span",{"aria-hidden":"true",className:"absolute bottom-[0.18em] size-[0.22em] rounded-full bg-current"}):null]})}function Header({size:r,color:d,view:u,month:h,locale:g,labels:f,showPreviousButton:b,showNextButton:p,captionId:y,onStep:v,onViewChange:w}){const D=k(g,"long")[h.getMonth()],N=String(h.getFullYear()),S=x(g),M=E(h.getFullYear()),C=`${M}–${M+B-1}`,z="day"===u?[f.previousMonth,f.nextMonth]:"month"===u?[f.previousYear,f.nextYear]:[f.previousYears,f.nextYears],P=(t,n)=>n?e(o,{variant:"text",size:r,color:d,density:"compact","aria-label":z[-1===t?0:1],onClick:()=>v(t),startIcon:e("span",{className:i("flex items-center",-1===t?"rotate-90 rtl:-rotate-90":"-rotate-90 rtl:rotate-90"),children:e(l,{})})}):e("span",{"aria-hidden":"true",className:i(a[r],"w-(--n-cell)")}),A=t=>e("span",{className:i("flex items-center text-(--neba-muted-fg)","[transition:rotate_var(--neba-duration)_var(--neba-ease)]",t&&"rotate-180"),children:e(l,{})}),j=e(o,{variant:"text",size:r,color:d,density:"compact","aria-describedby":`${y}-month`,"aria-expanded":"month"===u,onClick:()=>w("month"===u?"day":"month"),endIcon:A("month"===u),children:D},"month"),Y=e(o,{variant:"text",size:r,color:d,density:"compact",className:"tabular-nums","aria-describedby":`${y}-year`,"aria-expanded":"year"===u,onClick:()=>w("year"===u?"day":"year"),endIcon:A("year"===u),children:N},"year");return t("div",{className:"flex items-center justify-between gap-1",children:[e("span",{id:y,className:m,"aria-live":"polite",children:"day"===u?F(g,{year:"numeric",month:"long"}).format(h):"month"===u?N:C}),e("span",{id:`${y}-month`,hidden:!0,children:f.chooseMonth}),e("span",{id:`${y}-year`,hidden:!0,children:f.chooseYear}),P(-1,b),e("div",{className:i("flex min-w-0 flex-1 items-center justify-center",c[r]),children:"year"===u?e("span",{className:i("flex items-center font-medium tabular-nums text-(--neba-fg)",a[r],s[r]),children:C}):"month"===u?Y:t(n,S?{children:[j,Y]}:{children:[Y,j]})}),P(1,p)]})}const q={day:0,month:1,year:2};export function Calendar({size:n,color:o,locale:l,weekStartsOn:a,month:s,onMonthChange:d,selected:u,rangeStart:m=null,rangeEnd:h=null,onSelect:g,granularity:p="day",renderDay:y,onPreviewChange:x,minDate:w,maxDate:N,shouldDisableDate:C,showOutsideDays:k=!0,autoFocus:j=!1,multiselectable:Y=!1,showPreviousButton:E=!0,showNextButton:F=!0,labels:T,className:H}){const R=r.useId(),[K,G]=r.useState(p),O=q[K]<q[p]?p:K,U=r.useMemo(()=>u.filter(S),[u]),[L,$]=r.useState(()=>{const e=U.find(e=>D(e,s));return e?z(e):D(A(),s)?A():P(s)}),_=r.useRef(j),V=r.useRef(null);r.useEffect(()=>{$(e=>D(e,s)?e:P(s))},[s]),r.useLayoutEffect(()=>{_.current&&(_.current=!1,V.current?.querySelector('[data-focus-target="true"]')?.focus({preventScroll:!0}))});const J=r.useCallback(e=>v(e,w,N)||(C?.(e)??!1),[w,N,C]),Q=e=>{_.current=!0,G(e)},W=e=>{_.current=!0,d(e)};return t("div",{ref:V,className:i("flex flex-col",c[n],H),style:{"--n-cell":I[n]},onPointerLeave:()=>x?.(null),children:[e(Header,{size:n,color:o,view:O,month:s,locale:l,labels:T,showPreviousButton:E,showNextButton:F,captionId:R,onStep:e=>{d("day"===O?f(s,e):b(s,"month"===O?e:e*B))},onViewChange:Q}),e("div",{className:"h-[calc(var(--n-cell)*7)] w-[calc(var(--n-cell)*7)]",children:"day"===O?e(DayGrid,{labelledBy:R,multiselectable:Y&&"day"===p,size:n,locale:l,weekStartsOn:a,month:s,chosen:U,rangeStart:m,rangeEnd:h,focusedDate:L,renderDay:y,showOutsideDays:k,isDisabled:J,onSelect:e=>{$(e),g(e)},onPreviewChange:x,onMoveFocus:e=>{_.current=!0,$(e),D(e,s)||d(P(e))}}):"month"===O?e(MonthGrid,{labelledBy:R,multiselectable:Y&&"month"===p,size:n,locale:l,month:s,chosen:U,minDate:w,maxDate:N,shouldDisable:"month"===p?C:void 0,onMoveCursor:W,onPick:e=>{const t=M(s.getFullYear(),e,1);d(t),"month"===p?g(t):($(e=>D(e,t)?e:t),Q("day"))}}):e(YearGrid,{labelledBy:R,multiselectable:Y&&"year"===p,size:n,month:s,chosen:U,minDate:w,maxDate:N,shouldDisable:"year"===p?C:void 0,onMoveCursor:W,onPick:e=>{if("year"===p){const t=M(e,0,1);return d(t),void g(t)}d(M(e,s.getMonth(),1)),Q("month")}})})]})}function L(e){return"rtl"===getComputedStyle(e).direction}function DayGrid({labelledBy:n,multiselectable:r,size:o,locale:l,weekStartsOn:a,month:c,chosen:u,rangeStart:m,rangeEnd:h,focusedDate:b,renderDay:v,showOutsideDays:x,isDisabled:N,onSelect:M,onPreviewChange:C,onMoveFocus:k}){const z=p(c,a),P=j(l,a,"short"),Y=j(l,a,"long"),B=F(l,{dateStyle:"full"}),E=(H=h,S(T=m)&&S(H)?y(T,H)<=0?[T,H]:[H,T]:null);var T,H;const I=R()?A():null;return t("div",{role:"grid","aria-labelledby":n,"aria-multiselectable":r||void 0,className:"flex h-full flex-col",children:[e("div",{role:"row",className:"grid grid-cols-7",children:P.map((t,n)=>e("span",{role:"columnheader","aria-label":Y[n],className:i("flex h-(--n-cell) items-center justify-center font-medium text-(--neba-muted-fg) select-none",d[o]),children:t},n))}),z.map((n,r)=>e("div",{role:"row",className:"grid grid-cols-7",children:n.map(n=>{const r=!D(n,c);if(r&&!x)return e("span",{role:"gridcell","aria-hidden":"true",className:"size-(--n-cell)"},n.getTime());const l=u.some(e=>w(e,n)),d=null!==E&&y(n,E[0])>=0&&y(n,E[1])<=0,m=null!==E&&d&&w(n,E[0]),h=null!==E&&d&&w(n,E[1]);return t(Cell,{size:o,label:B.format(n),selected:l,inRange:d&&!l,rangeEdge:d?m&&h?"both":m?"start":h?"end":"middle":null,current:null!==I&&w(n,I)&&!l,muted:r,disabled:N(n),focused:w(n,b),className:i("size-(--n-cell)",s[o]),onClick:()=>M(n),onPointerEnter:()=>C?.(n),onKeyDown:e=>((e,t)=>{const n=(t.getDay()-a+7)%7,r=L(e.currentTarget)?-1:1,o={ArrowLeft:()=>g(t,-r),ArrowRight:()=>g(t,r),ArrowUp:()=>g(t,-7),ArrowDown:()=>g(t,7),Home:()=>g(t,-n),End:()=>g(t,6-n),PageUp:()=>f(t,e.shiftKey?-12:-1),PageDown:()=>f(t,e.shiftKey?12:1)}[e.key];o&&(e.preventDefault(),k(o()))})(e,n),children:[n.getDate(),v?v(n):null]},n.getTime())})},r))]})}function MonthGrid({labelledBy:t,multiselectable:n,size:r,locale:o,month:l,chosen:a,minDate:c,maxDate:d,shouldDisable:u,onMoveCursor:m,onPick:h}){const g=k(o,"short"),b=F(o,{year:"numeric",month:"long"}),p=l.getFullYear(),y=R()?new Date:null,v=e=>{const t=L(e.currentTarget)?-1:1,n={ArrowLeft:-t,ArrowRight:t,ArrowUp:-3,ArrowDown:3,PageUp:-12,PageDown:12}[e.key];void 0!==n&&(e.preventDefault(),m(f(P(l),n)))};return e("div",{role:"grid","aria-labelledby":t,"aria-multiselectable":n||void 0,className:"flex h-full flex-col justify-evenly",children:[0,1,2,3].map(t=>e("div",{role:"row",className:"grid grid-cols-3 gap-1",children:[0,1,2].map(n=>{const o=3*t+n,m=M(p,o,1);return e(Cell,{size:r,label:b.format(m),selected:a.some(e=>e.getFullYear()===p&&e.getMonth()===o),current:null!==y&&y.getFullYear()===p&&y.getMonth()===o,disabled:N(m,"month",c,d)||(u?.(m)??!1),focused:o===l.getMonth(),className:i("h-(--n-cell) w-full",s[r]),onClick:()=>h(o),onKeyDown:v,children:g[o]},o)})},t))})}function YearGrid({labelledBy:t,multiselectable:n,size:r,month:o,chosen:l,minDate:a,maxDate:c,shouldDisable:d,onMoveCursor:u,onPick:m}){const h=E(o.getFullYear()),g=R()?(new Date).getFullYear():null,f=e=>{const t=L(e.currentTarget)?-1:1,n={ArrowLeft:-t,ArrowRight:t,ArrowUp:-4,ArrowDown:4,PageUp:-B,PageDown:B}[e.key];void 0!==n&&(e.preventDefault(),u(b(P(o),n)))};return e("div",{role:"grid","aria-labelledby":t,"aria-multiselectable":n||void 0,className:"flex h-full flex-col justify-evenly",children:[0,1,2].map(t=>e("div",{role:"row",className:"grid grid-cols-4 gap-1",children:[0,1,2,3].map(n=>{const u=h+4*t+n,b=M(u,0,1);return e(Cell,{size:r,label:String(u),selected:l.some(e=>e.getFullYear()===u),current:u===g,disabled:N(b,"year",a,c)||(d?.(b)??!1),focused:u===o.getFullYear(),className:i("h-(--n-cell) w-full",s[r]),onClick:()=>m(u),onKeyDown:f,children:u},u)})},t))})}function $(e){const t=e.parentElement;if(!t)return;const n=e.getBoundingClientRect(),r=t.getBoundingClientRect(),o=n.top-r.top-t.clientTop+t.scrollTop,l=o+n.height;o<t.scrollTop?t.scrollTop=o:l>t.scrollTop+t.clientHeight&&(t.scrollTop=l-t.clientHeight)}export function TimeGrid({size:n,density:o,locale:l,value:c,referenceDate:d,onChange:u,hour12:h,showSeconds:g,hourStep:f,minuteStep:b,secondStep:p,shouldDisableTime:y,autoFocus:v=!1,labels:x,className:w}){const D=c??d,N=r.useRef(null),[S,M]=r.useMemo(()=>C(l),[l]);r.useEffect(()=>{const e=N.current;if(e?.querySelectorAll('[data-chosen="true"]').forEach($),v){const t=e?.querySelector('[role="listbox"]');(t?.querySelector('[data-chosen="true"]')??t?.querySelector('[role="option"]'))?.focus({preventScroll:!0})}},[v]);const k=r.useMemo(()=>{const e=Math.ceil((h?12:24)/f),t=Array.from({length:e},(e,t)=>t*f);return h?t.map(e=>0===e?12:e):t},[h,f]),z=r.useMemo(()=>Array.from({length:Math.ceil(60/b)},(e,t)=>t*b),[b]),P=r.useMemo(()=>Array.from({length:Math.ceil(60/p)},(e,t)=>t*p),[p]),A=e=>String(e).padStart(2,"0"),j=h?D.getHours()%12||12:D.getHours(),B=e=>{const t=Array.from(e.currentTarget.querySelectorAll('[role="option"]')),n=t.indexOf(e.target);if(n<0)return;const r="ArrowDown"===e.key?n+1:"ArrowUp"===e.key?n-1:"Home"===e.key?0:"End"===e.key?t.length-1:null;if(null===r)return;e.preventDefault();const o=t[Math.min(t.length-1,Math.max(0,r))];o.focus({preventScroll:!0}),$(o)},E=(t,r,o,l,d)=>{const m=Math.max(0,null===c?0:o.findIndex(l));return e("div",{role:"listbox","aria-label":r,onKeyDown:B,className:i("flex flex-col gap-0.5 overflow-y-auto overscroll-contain","h-[calc(var(--n-cell)*7)] w-[calc(var(--n-cell)*2)]","scroll-py-0.5 [scrollbar-width:thin]"),children:o.map((r,o)=>{const g=((e,t)=>Y(D,"hour"===e?{hours:h?t%12+(D.getHours()>=12?12:0):t}:"minute"===e?{minutes:t}:"second"===e?{seconds:t}:{hours:D.getHours()%12+12*t}))(t,r),f=null!==c&&l(r),b=y?.(g,t)??!1;return e("button",{type:"button",role:"option","aria-selected":f,"aria-disabled":b||void 0,"data-chosen":f?"true":void 0,tabIndex:o===m?0:-1,className:i(U,K[n],a[n],s[n],"w-full shrink-0",b?"cursor-not-allowed text-(--neba-disabled-fg)":f?"cursor-pointer bg-(--n-fill) font-semibold text-(--n-on-solid) hover:bg-(--n-fill-hover) active:bg-(--n-fill-active)":"cursor-pointer text-(--neba-fg) hover:bg-(--n-soft) active:bg-(--n-soft-press)"),onClick:()=>{b||u(g)},children:d(r)},r)})},t)};return t("div",{ref:N,className:i("flex","compact"===o?"gap-0.5":"gap-1",w),style:{"--n-cell":I[n]},children:[E("hour",x.hour,k,e=>e===j,e=>h?String(e):A(e)),E("minute",x.minute,z,e=>e===D.getMinutes(),A),g?E("second",x.second,P,e=>e===D.getSeconds(),A):null,h?E("meridiem",x.meridiem,[0,1],e=>(D.getHours()>=12?1:0)===e,e=>0===e?S:M):null,e("span",{className:m,"aria-live":"polite",children:null===c?"":F(l,{hour:"numeric",minute:"2-digit",...g?{second:"2-digit"}:{}}).format(c)})]})}
|
|
1
|
+
"use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as r from"react";import{Button as o}from"../components/button/Button.js";import{ChevronIcon as l}from"./icons.js";import{controlHeightClasses as a,controlTextClasses as s,cx as i,gapClasses as c,metaTextClasses as d,pressTransitionClasses as u,srOnlyClasses as m,transitionClasses as h}from"./styles.js";import{addDays as f,addMonths as g,addYears as b,calendarWeeks as p,compareDay as y,isDayOutside as v,isMonthBeforeYear as x,isSameDay as w,isSameMonth as D,isUnitOutside as N,isValidDate as S,makeDate as M,meridiemLabels as C,monthLabels as k,startOfDay as z,startOfMonth as P,today as A,weekdayLabels as j,withTime as Y,YEAR_PAGE_SIZE as E,yearPageStart as B}from"./date.js";import{dateFormatter as F}from"./format.js";import{pickerMessages as T,useMessages as H}from"./i18n.js";import{useHydrated as R}from"./media.js";export function usePickerLabels(e,t){const n=H(T,t);return r.useMemo(()=>e?{...n,...e}:n,[n,e])}const I={xs:"1.375rem",sm:"1.625rem",md:"2rem",lg:"2.5rem",xl:"3rem"},K={xs:"rounded-(--neba-radius-xs)",sm:"rounded-(--neba-radius-xs)",md:"rounded-(--neba-radius-sm)",lg:"rounded-(--neba-radius-md)",xl:"rounded-(--neba-radius-lg)"},G={xs:"rounded-s-(--neba-radius-xs)",sm:"rounded-s-(--neba-radius-xs)",md:"rounded-s-(--neba-radius-sm)",lg:"rounded-s-(--neba-radius-md)",xl:"rounded-s-(--neba-radius-lg)"},O={xs:"rounded-e-(--neba-radius-xs)",sm:"rounded-e-(--neba-radius-xs)",md:"rounded-e-(--neba-radius-sm)",lg:"rounded-e-(--neba-radius-md)",xl:"rounded-e-(--neba-radius-lg)"},U=["neba-calendar-cell relative flex select-none items-center justify-center tabular-nums","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",h,u,"focus-visible:z-10 focus-visible:[outline:2px_solid_var(--n-ring)]","focus-visible:[outline-offset:-2px]"].join(" ");function Cell({children:n,label:r,selected:o,inRange:l=!1,rangeEdge:a=null,current:s=!1,muted:c=!1,disabled:d=!1,focused:u=!1,size:m,className:h,onClick:f,onPointerEnter:g,onKeyDown:b}){return t("button",{type:"button",role:"gridcell","aria-label":r,"aria-selected":o,"aria-current":s?"date":void 0,"aria-disabled":d||void 0,tabIndex:u?0:-1,"data-focus-target":u?"true":void 0,className:i(U,"start"===a?G[m]:"end"===a?O[m]:"middle"===a?"rounded-none":K[m],d?"cursor-not-allowed text-(--neba-disabled-fg)":o?"cursor-pointer bg-(--n-fill) font-semibold text-(--n-on-solid) hover:bg-(--n-fill-hover) active:bg-(--n-fill-active)":l?"cursor-pointer bg-(--n-soft) text-(--neba-fg) hover:bg-(--n-soft-hover) active:bg-(--n-soft-press)":s?"cursor-pointer font-semibold text-(--n-on-tint) hover:bg-(--n-soft) active:bg-(--n-soft-press)":c?"cursor-pointer text-(--neba-muted-fg) hover:bg-(--n-soft) active:bg-(--n-soft-press)":"cursor-pointer text-(--neba-fg) hover:bg-(--n-soft) active:bg-(--n-soft-press)",h),onClick:()=>{d||f()},onPointerEnter:g,onKeyDown:b,children:[n,s?e("span",{"aria-hidden":"true",className:"absolute bottom-[0.18em] size-[0.22em] rounded-full bg-current"}):null]})}function Header({size:r,color:d,view:u,month:h,locale:f,labels:g,showPreviousButton:b,showNextButton:p,captionId:y,onStep:v,onViewChange:w}){const D=k(f,"long")[h.getMonth()],N=String(h.getFullYear()),S=x(f),M=B(h.getFullYear()),C=`${M}–${M+E-1}`,z="day"===u?[g.previousMonth,g.nextMonth]:"month"===u?[g.previousYear,g.nextYear]:[g.previousYears,g.nextYears],P=(t,n)=>n?e(o,{variant:"text",size:r,color:d,density:"compact","aria-label":z[-1===t?0:1],onClick:()=>v(t),startIcon:e("span",{className:i("flex items-center",-1===t?"rotate-90 rtl:-rotate-90":"-rotate-90 rtl:rotate-90"),children:e(l,{})})}):e("span",{"aria-hidden":"true",className:i(a[r],"w-(--n-cell)")}),A=t=>e("span",{className:i("flex items-center text-(--neba-muted-fg)","[transition:rotate_var(--neba-duration)_var(--neba-ease)]",t&&"rotate-180"),children:e(l,{})}),j=e(o,{variant:"text",size:r,color:d,density:"compact","aria-describedby":`${y}-month`,"aria-expanded":"month"===u,onClick:()=>w("month"===u?"day":"month"),endIcon:A("month"===u),children:D},"month"),Y=e(o,{variant:"text",size:r,color:d,density:"compact",className:"tabular-nums","aria-describedby":`${y}-year`,"aria-expanded":"year"===u,onClick:()=>w("year"===u?"day":"year"),endIcon:A("year"===u),children:N},"year");return t("div",{className:"flex items-center justify-between gap-1",children:[e("span",{id:y,className:m,"aria-live":"polite",children:"day"===u?F(f,{year:"numeric",month:"long"}).format(h):"month"===u?N:C}),e("span",{id:`${y}-month`,hidden:!0,children:g.chooseMonth}),e("span",{id:`${y}-year`,hidden:!0,children:g.chooseYear}),P(-1,b),e("div",{className:i("flex min-w-0 flex-1 items-center justify-center",c[r]),children:"year"===u?e("span",{className:i("flex items-center font-medium tabular-nums text-(--neba-fg)",a[r],s[r]),children:C}):"month"===u?Y:t(n,S?{children:[j,Y]}:{children:[Y,j]})}),P(1,p)]})}const q={day:0,month:1,year:2};export function Calendar({size:n,color:o,locale:l,weekStartsOn:a,month:s,onMonthChange:d,selected:u,rangeStart:m=null,rangeEnd:h=null,onSelect:f,granularity:p="day",renderDay:y,onPreviewChange:x,minDate:N,maxDate:C,shouldDisableDate:k,showOutsideDays:j=!0,autoFocus:Y=!1,multiselectable:B=!1,showPreviousButton:F=!0,showNextButton:T=!0,labels:H,className:K}){const G=r.useId(),[O,U]=r.useState(p),L=q[O]<q[p]?p:O,$=r.useMemo(()=>u.filter(S),[u]),_=R(),[V,J]=r.useState(()=>{const e=$.find(e=>D(e,s));return e?z(e):_&&D(A(),s)?A():P(s)}),Q=r.useRef(!_);r.useEffect(()=>{_&&Q.current&&(Q.current=!1,J(e=>w(e,P(s))&&D(A(),s)&&!$.some(e=>D(e,s))?A():e))},[_]);const W=r.useRef(Y),X=r.useRef(null);r.useEffect(()=>{J(e=>D(e,s)?e:P(s))},[s]),r.useLayoutEffect(()=>{W.current&&(W.current=!1,X.current?.querySelector('[data-focus-target="true"]')?.focus({preventScroll:!0}))});const Z=r.useCallback(e=>v(e,N,C)||(k?.(e)??!1),[N,C,k]),ee=e=>{W.current=!0,U(e)},te=e=>{W.current=!0,d(e)};return t("div",{ref:X,className:i("flex flex-col",c[n],K),style:{"--n-cell":I[n]},onPointerLeave:()=>x?.(null),children:[e(Header,{size:n,color:o,view:L,month:s,locale:l,labels:H,showPreviousButton:F,showNextButton:T,captionId:G,onStep:e=>{d("day"===L?g(s,e):b(s,"month"===L?e:e*E))},onViewChange:ee}),e("div",{className:"h-[calc(var(--n-cell)*7)] w-[calc(var(--n-cell)*7)]",children:"day"===L?e(DayGrid,{labelledBy:G,multiselectable:B&&"day"===p,size:n,locale:l,weekStartsOn:a,month:s,chosen:$,rangeStart:m,rangeEnd:h,focusedDate:V,renderDay:y,showOutsideDays:j,isDisabled:Z,onSelect:e=>{J(e),f(e)},onPreviewChange:x,onMoveFocus:e=>{W.current=!0,J(e),D(e,s)||d(P(e))}}):"month"===L?e(MonthGrid,{labelledBy:G,multiselectable:B&&"month"===p,size:n,locale:l,month:s,chosen:$,minDate:N,maxDate:C,shouldDisable:"month"===p?k:void 0,onMoveCursor:te,onPick:e=>{const t=M(s.getFullYear(),e,1);d(t),"month"===p?f(t):(J(e=>D(e,t)?e:t),ee("day"))}}):e(YearGrid,{labelledBy:G,multiselectable:B&&"year"===p,size:n,month:s,chosen:$,minDate:N,maxDate:C,shouldDisable:"year"===p?k:void 0,onMoveCursor:te,onPick:e=>{if("year"===p){const t=M(e,0,1);return d(t),void f(t)}d(M(e,s.getMonth(),1)),ee("month")}})})]})}function L(e){return"rtl"===getComputedStyle(e).direction}function DayGrid({labelledBy:n,multiselectable:r,size:o,locale:l,weekStartsOn:a,month:c,chosen:u,rangeStart:m,rangeEnd:h,focusedDate:b,renderDay:v,showOutsideDays:x,isDisabled:N,onSelect:M,onPreviewChange:C,onMoveFocus:k}){const z=p(c,a),P=j(l,a,"short"),Y=j(l,a,"long"),E=F(l,{dateStyle:"full"}),B=(H=h,S(T=m)&&S(H)?y(T,H)<=0?[T,H]:[H,T]:null);var T,H;const I=R()?A():null;return t("div",{role:"grid","aria-labelledby":n,"aria-multiselectable":r||void 0,className:"flex h-full flex-col",children:[e("div",{role:"row",className:"grid grid-cols-7",children:P.map((t,n)=>e("span",{role:"columnheader","aria-label":Y[n],className:i("flex h-(--n-cell) items-center justify-center font-medium text-(--neba-muted-fg) select-none",d[o]),children:t},n))}),z.map((n,r)=>e("div",{role:"row",className:"grid grid-cols-7",children:n.map(n=>{const r=!D(n,c);if(r&&!x)return e("span",{role:"gridcell","aria-hidden":"true",className:"size-(--n-cell)"},n.getTime());const l=u.some(e=>w(e,n)),d=null!==B&&y(n,B[0])>=0&&y(n,B[1])<=0,m=null!==B&&d&&w(n,B[0]),h=null!==B&&d&&w(n,B[1]);return t(Cell,{size:o,label:E.format(n),selected:l,inRange:d&&!l,rangeEdge:d?m&&h?"both":m?"start":h?"end":"middle":null,current:null!==I&&w(n,I),muted:r,disabled:N(n),focused:w(n,b),className:i("size-(--n-cell)",s[o]),onClick:()=>M(n),onPointerEnter:()=>C?.(n),onKeyDown:e=>((e,t)=>{const n=(t.getDay()-a+7)%7,r=L(e.currentTarget)?-1:1,o={ArrowLeft:()=>f(t,-r),ArrowRight:()=>f(t,r),ArrowUp:()=>f(t,-7),ArrowDown:()=>f(t,7),Home:()=>f(t,-n),End:()=>f(t,6-n),PageUp:()=>g(t,e.shiftKey?-12:-1),PageDown:()=>g(t,e.shiftKey?12:1)}[e.key];o&&(e.preventDefault(),k(o()))})(e,n),children:[n.getDate(),v?v(n):null]},n.getTime())})},r))]})}function MonthGrid({labelledBy:t,multiselectable:n,size:r,locale:o,month:l,chosen:a,minDate:c,maxDate:d,shouldDisable:u,onMoveCursor:m,onPick:h}){const f=k(o,"short"),b=F(o,{year:"numeric",month:"long"}),p=l.getFullYear(),y=R()?new Date:null,v=e=>{const t=L(e.currentTarget)?-1:1,n={ArrowLeft:-t,ArrowRight:t,ArrowUp:-3,ArrowDown:3,PageUp:-12,PageDown:12}[e.key];void 0!==n&&(e.preventDefault(),m(g(P(l),n)))};return e("div",{role:"grid","aria-labelledby":t,"aria-multiselectable":n||void 0,className:"flex h-full flex-col justify-evenly",children:[0,1,2,3].map(t=>e("div",{role:"row",className:"grid grid-cols-3 gap-1",children:[0,1,2].map(n=>{const o=3*t+n,m=M(p,o,1);return e(Cell,{size:r,label:b.format(m),selected:a.some(e=>e.getFullYear()===p&&e.getMonth()===o),current:null!==y&&y.getFullYear()===p&&y.getMonth()===o,disabled:N(m,"month",c,d)||(u?.(m)??!1),focused:o===l.getMonth(),className:i("h-(--n-cell) w-full",s[r]),onClick:()=>h(o),onKeyDown:v,children:f[o]},o)})},t))})}function YearGrid({labelledBy:t,multiselectable:n,size:r,month:o,chosen:l,minDate:a,maxDate:c,shouldDisable:d,onMoveCursor:u,onPick:m}){const h=B(o.getFullYear()),f=R()?(new Date).getFullYear():null,g=e=>{const t=L(e.currentTarget)?-1:1,n={ArrowLeft:-t,ArrowRight:t,ArrowUp:-4,ArrowDown:4,PageUp:-E,PageDown:E}[e.key];void 0!==n&&(e.preventDefault(),u(b(P(o),n)))};return e("div",{role:"grid","aria-labelledby":t,"aria-multiselectable":n||void 0,className:"flex h-full flex-col justify-evenly",children:[0,1,2].map(t=>e("div",{role:"row",className:"grid grid-cols-4 gap-1",children:[0,1,2,3].map(n=>{const u=h+4*t+n,b=M(u,0,1);return e(Cell,{size:r,label:String(u),selected:l.some(e=>e.getFullYear()===u),current:u===f,disabled:N(b,"year",a,c)||(d?.(b)??!1),focused:u===o.getFullYear(),className:i("h-(--n-cell) w-full",s[r]),onClick:()=>m(u),onKeyDown:g,children:u},u)})},t))})}function $(e){const t=e.parentElement;if(!t)return;const n=e.getBoundingClientRect(),r=t.getBoundingClientRect(),o=n.top-r.top-t.clientTop+t.scrollTop,l=o+n.height;o<t.scrollTop?t.scrollTop=o:l>t.scrollTop+t.clientHeight&&(t.scrollTop=l-t.clientHeight)}export function TimeGrid({size:n,density:o,locale:l,value:c,referenceDate:d,onChange:u,hour12:h,showSeconds:f,hourStep:g,minuteStep:b,secondStep:p,shouldDisableTime:y,autoFocus:v=!1,labels:x,className:w}){const D=c??d,N=r.useRef(null),[S,M]=r.useMemo(()=>C(l),[l]);r.useEffect(()=>{const e=N.current;if(e?.querySelectorAll('[data-chosen="true"]').forEach($),v){const t=e?.querySelector('[role="listbox"]');(t?.querySelector('[data-chosen="true"]')??t?.querySelector('[role="option"]'))?.focus({preventScroll:!0})}},[v]);const k=r.useMemo(()=>{const e=Math.ceil((h?12:24)/g),t=Array.from({length:e},(e,t)=>t*g);return h?t.map(e=>0===e?12:e):t},[h,g]),z=r.useMemo(()=>Array.from({length:Math.ceil(60/b)},(e,t)=>t*b),[b]),P=r.useMemo(()=>Array.from({length:Math.ceil(60/p)},(e,t)=>t*p),[p]),A=e=>String(e).padStart(2,"0"),j=h?D.getHours()%12||12:D.getHours(),E=e=>{const t=Array.from(e.currentTarget.querySelectorAll('[role="option"]')),n=t.indexOf(e.target);if(n<0)return;const r="ArrowDown"===e.key?n+1:"ArrowUp"===e.key?n-1:"Home"===e.key?0:"End"===e.key?t.length-1:null;if(null===r)return;e.preventDefault();const o=t[Math.min(t.length-1,Math.max(0,r))];o.focus({preventScroll:!0}),$(o)},B=(t,r,o,l,d)=>{const m=Math.max(0,null===c?0:o.findIndex(l));return e("div",{role:"listbox","aria-label":r,onKeyDown:E,className:i("flex flex-col gap-0.5 overflow-y-auto overscroll-contain","h-[calc(var(--n-cell)*7)] w-[calc(var(--n-cell)*2)]","scroll-py-0.5 [scrollbar-width:thin]"),children:o.map((r,o)=>{const f=((e,t)=>Y(D,"hour"===e?{hours:h?t%12+(D.getHours()>=12?12:0):t}:"minute"===e?{minutes:t}:"second"===e?{seconds:t}:{hours:D.getHours()%12+12*t}))(t,r),g=null!==c&&l(r),b=y?.(f,t)??!1;return e("button",{type:"button",role:"option","aria-selected":g,"aria-disabled":b||void 0,"data-chosen":g?"true":void 0,tabIndex:o===m?0:-1,className:i(U,K[n],a[n],s[n],"w-full shrink-0",b?"cursor-not-allowed text-(--neba-disabled-fg)":g?"cursor-pointer bg-(--n-fill) font-semibold text-(--n-on-solid) hover:bg-(--n-fill-hover) active:bg-(--n-fill-active)":"cursor-pointer text-(--neba-fg) hover:bg-(--n-soft) active:bg-(--n-soft-press)"),onClick:()=>{b||u(f)},children:d(r)},r)})},t)};return t("div",{ref:N,className:i("flex","compact"===o?"gap-0.5":"gap-1",w),style:{"--n-cell":I[n]},children:[B("hour",x.hour,k,e=>e===j,e=>h?String(e):A(e)),B("minute",x.minute,z,e=>e===D.getMinutes(),A),f?B("second",x.second,P,e=>e===D.getSeconds(),A):null,h?B("meridiem",x.meridiem,[0,1],e=>(D.getHours()>=12?1:0)===e,e=>0===e?S:M):null,e("span",{className:m,"aria-live":"polite",children:null===c?"":F(l,{hour:"numeric",minute:"2-digit",...f?{second:"2-digit"}:{}}).format(c)})]})}
|
|
@@ -29,6 +29,8 @@ export interface BrushProps {
|
|
|
29
29
|
start: string;
|
|
30
30
|
end: string;
|
|
31
31
|
};
|
|
32
|
+
/** The chart's own name, which the strip is a group under. */
|
|
33
|
+
label: string;
|
|
32
34
|
/** What the two handles say they are on, read out with their positions. */
|
|
33
35
|
categories: readonly NebaChartCategory[];
|
|
34
36
|
locale?: string;
|
|
@@ -50,4 +52,4 @@ export interface BrushProps {
|
|
|
50
52
|
* reachable by pointer alone, which on the one control that decides what the
|
|
51
53
|
* chart shows is not a control at all.
|
|
52
54
|
*/
|
|
53
|
-
export declare function ChartBrush({ outline, count, range, onRange, color, height, words, categories, locale, width }: BrushProps): React.JSX.Element;
|
|
55
|
+
export declare function ChartBrush({ outline, count, range, onRange, color, height, words, label, categories, locale, width }: BrushProps): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as t,jsxs as e}from"react/jsx-runtime";import*as n from"react";import{formatCategory as r,linePath as
|
|
1
|
+
"use client";import{jsx as t,jsxs as e}from"react/jsx-runtime";import*as n from"react";import{formatCategory as r,linePath as a}from"./chart.js";import{beginPointerDrag as o}from"./drag.js";import{cx as i,hitAreaClasses as s}from"./styles.js";export function ChartBrush({outline:l,count:u,range:c,onRange:h,color:m,height:d,words:f,label:x,categories:g,locale:w,width:M}){const p=n.useRef(null),b=n.useRef(null);n.useEffect(()=>()=>b.current?.(),[]);const y=Math.max(0,u-1),[v,k]=c,D=n.useRef([v,k]);n.useEffect(()=>{D.current=[v,k]});const R=t=>0===y?0:t/y,_=n.useMemo(()=>{let t=1/0,e=-1/0;for(const n of l)null!==n&&(t=Math.min(t,n),e=Math.max(e,n));if(M<=0||t>e)return"";const n=e-t||1,r=Math.max(1,d-4);return a(l.map((e,a)=>null===e?null:{x:R(a)*M,y:2+(1-(e-t)/n)*r}),"linear")},[l,M,d,y]),j=t=>{const e=p.current;if(!e)return 0;const n=e.getBoundingClientRect(),r=0===n.width?0:(t-n.left)/n.width;return Math.min(y,Math.max(0,Math.round(r*y)))},A=(t,e,n)=>{let r;if("start"===t)r=[Math.min(e,k-1),k];else if("end"===t)r=[v,Math.max(e,v+1)];else{const t=k-v,a=Math.min(Math.max(0,e-n),y-t);r=[a,a+t]}const a=Math.min(y,Math.max(0,r[0])),o=Math.min(y,Math.max(a,r[1])),[i,s]=D.current;a===i&&o===s||(D.current=[a,o],h([a,o]))};function E(t,e){const n=j(e.clientX),r="window"===t?n-v:0;e.preventDefault(),b.current?.(),b.current=o({target:e.currentTarget,pointerId:e.pointerId,onMove:e=>A(t,j(e.clientX),r),onEnd:()=>{b.current=null}})}const N=e=>{const n="start"===e?v:k;return t("button",{type:"button",role:"slider","aria-label":"start"===e?f.start:f.end,"aria-valuemin":0,"aria-valuemax":y,"aria-valuenow":n,"aria-valuetext":r(g[n]??n,w),onPointerDown:t=>E(e,t),onKeyDown:t=>function(t,e){const n=Math.max(1,Math.round(u/10)),r="ArrowLeft"===e.key||"ArrowDown"===e.key?-1:"ArrowRight"===e.key||"ArrowUp"===e.key?1:"PageDown"===e.key?-n:"PageUp"===e.key?n:0;if(0!==r)A(t,Math.min(y,Math.max(0,("end"===t?k:v)+r)),0);else if("Home"===e.key)A(t,0,0);else{if("End"!==e.key)return;A(t,y,0)}e.preventDefault()}(e,t),className:i("absolute inset-y-0 w-2 -translate-x-1/2 cursor-ew-resize rounded-full",s,"bg-(--n-accent) [touch-action:none]","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1"),style:{left:100*R(n)+"%"}})};return e("div",{ref:p,role:"group","aria-label":x,className:"absolute inset-x-0 bottom-0 select-none",style:{height:d},children:[e("svg",{width:"100%",height:d,viewBox:`0 0 ${Math.max(1,M)} ${d}`,preserveAspectRatio:"none","aria-hidden":"true",className:"absolute inset-0 block",children:[t("rect",{x:0,y:0,width:Math.max(1,M),height:d,rx:3,fill:"var(--neba-chart-grid)"}),_?t("path",{d:_,fill:"none",stroke:m,strokeWidth:1,opacity:.6}):null]}),t("div",{onPointerDown:t=>E("window",t),className:i("absolute inset-y-0 cursor-grab rounded-[3px] [touch-action:none]","bg-(--n-soft) [box-shadow:inset_0_0_0_1px_var(--n-accent)]","data-[dragging]:cursor-grabbing"),style:{left:100*R(v)+"%",width:100*(R(k)-R(v))+"%"}}),N("start"),N("end")]})}
|
|
@@ -73,7 +73,7 @@ declare function chartHeight(height: number | string | undefined, size: NebaSize
|
|
|
73
73
|
* the bar, the scatter and the timeline snapped, and a dashboard holding two of
|
|
74
74
|
* each showed both answers at once.
|
|
75
75
|
*/
|
|
76
|
-
export declare const markTransitionClasses:
|
|
76
|
+
export declare const markTransitionClasses = "[transition:opacity_var(--neba-duration)_var(--neba-ease),r_var(--neba-duration)_var(--neba-ease),scale_var(--neba-duration)_var(--neba-ease)]";
|
|
77
77
|
export interface ChartBaseProps extends Omit<BoxProps, 'children' | 'title'> {
|
|
78
78
|
/**
|
|
79
79
|
* How tall the drawing is. A number is pixels; a string is any CSS length.
|
|
@@ -333,12 +333,22 @@ declare function ChartTooltipPanel({ heading, items, x, y, flip, size }: Tooltip
|
|
|
333
333
|
* where a reader who wants the numbers can walk it. `hidden` keeps it out of the
|
|
334
334
|
* reading order: a description is computed from a hidden element all the same.
|
|
335
335
|
*/
|
|
336
|
-
declare function ChartSummary({ id, template, count, min, max, locale }: {
|
|
336
|
+
declare function ChartSummary({ id, template, count, min, max, second, locale }: {
|
|
337
337
|
id: string;
|
|
338
338
|
template: string;
|
|
339
339
|
count: number;
|
|
340
340
|
min: string;
|
|
341
341
|
max: string;
|
|
342
|
+
/**
|
|
343
|
+
* The series on a second value axis, said in a sentence of their own and
|
|
344
|
+
* in that axis' format, since one range across two units is not a range.
|
|
345
|
+
*/
|
|
346
|
+
second?: {
|
|
347
|
+
template: string;
|
|
348
|
+
count: number;
|
|
349
|
+
min: string;
|
|
350
|
+
max: string;
|
|
351
|
+
} | null;
|
|
342
352
|
locale?: string;
|
|
343
353
|
}): React.JSX.Element;
|
|
344
354
|
/** The count and extremes of every non-`null` value in the rows still shown. */
|
|
@@ -509,6 +519,13 @@ export interface CartesianLayout {
|
|
|
509
519
|
zeroPxOf: (series?: number) => number;
|
|
510
520
|
categories: readonly NebaChartCategory[];
|
|
511
521
|
format: (value: number) => string;
|
|
522
|
+
/**
|
|
523
|
+
* How a given series' numbers are written: through `secondaryAxis.tickFormat`
|
|
524
|
+
* when the series is measured on the far edge, and `format` otherwise. A
|
|
525
|
+
* value label reads this rather than `format`, or a rate on the far edge is
|
|
526
|
+
* printed in the first axis' currency.
|
|
527
|
+
*/
|
|
528
|
+
formatFor: (series: number) => (value: number) => string;
|
|
512
529
|
size: NebaSize;
|
|
513
530
|
}
|
|
514
531
|
/** The layout, plus everything the pointer decides. */
|
|
@@ -550,6 +567,15 @@ interface CartesianProps extends CartesianChartProps {
|
|
|
550
567
|
* than building a formatter that a pointer moving over the picture rebuilds.
|
|
551
568
|
*/
|
|
552
569
|
table?: (id: string, format: (value: number) => string) => React.ReactNode;
|
|
570
|
+
/**
|
|
571
|
+
* The rows the export button writes, for the same charts `table` is for.
|
|
572
|
+
*
|
|
573
|
+
* Left out, the file is the frame's grid of categories against series, which
|
|
574
|
+
* is a scatter's points filed against the wrong x and a timeline's rows as
|
|
575
|
+
* the number one. A chart with a table of its own hands its rows over here
|
|
576
|
+
* too, so the file and the table cannot disagree.
|
|
577
|
+
*/
|
|
578
|
+
exportRows?: () => readonly (readonly unknown[])[];
|
|
553
579
|
/**
|
|
554
580
|
* What the plot's one-sentence description counts, for a chart whose drawn
|
|
555
581
|
* values are not its series' values — a timeline's spans. Left out, it is
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,Fragment as t,jsxs as n}from"react/jsx-runtime";import{useStyleDefaults as a}from"./defaults.js";import*as l from"react";import{Box as r}from"../components/box/Box.js";import{bandScale as i,categoryAt as o,categoryCount as s,categoryExtent as c,chartFontSizes as u,compactNumber as d,extentOf as h,fitsLast as m,formatCategory as f,markerRadii as x,plotHeights as g,resolveColor as p,seriesColor as v,showsTick as b,textWidth as y,tickStride as k,toFullShares as M,toValues as w,truncate as C,turnedAxis as S,valueScale as N,warnPaletteOverflow as z}from"./chart.js";import{numberFormatter as A}from"./format.js";import{observeResize as P}from"./observe.js";import{chartMessages as j,emptyMessages as B,fillMessage as T,useMessages as E}from"./i18n.js";import{cx as $,hasContent as F,metaTextClasses as R,srOnlyClasses as W,transitionClasses as _}from"./styles.js";const L="undefined"==typeof document?l.useEffect:l.useLayoutEffect,D=[];function I(e){const[t,n]=l.useState(0);return L(()=>{const t=e.current;if(!t)return;const a=()=>n(t.clientWidth);return a(),P(t,a)},[e]),t}function H(e,t){const[n,a]=l.useState(0);return L(()=>{const n=e.current;if(!t||!n)return;const l=()=>a(n.clientHeight);return l(),P(n,l)},[e,t]),n}function V(e,t,n){return"number"==typeof e?e:void 0===e?g[t]:n}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 O(e){const[t,n]=l.useState(()=>new Map),[a,r]=l.useState(null),i=function(e){const t=new Map;return e.map((e,n)=>{if(void 0===e.name)return`index:${n}`;const a=t.get(e.name)??0;return t.set(e.name,a+1),`name:${a}:${e.name}`})}(e),o=l.useRef({series:e,keys:i});l.useEffect(()=>{o.current={series:e,keys:i}});const s=l.useCallback(e=>{const{series:t,keys:a}=o.current,l=a[e];void 0!==l&&n(n=>{const a=new Map(n);return a.set(l,!(n.get(l)??!t[e]?.hidden)),a})},[]);return{visible:e.map((e,n)=>t.get(i[n])??!e.hidden),hovered:a,toggle:s,setHovered:r}}const Z={top:"flex-col-reverse",bottom:"flex-col",left:"flex-row-reverse",right:"flex-row"},X={start:"justify-start",center:"justify-center",end:"justify-end"};function Y(e,t,n){const a=l.useRef(n);l.useEffect(()=>{a.current=n}),l.useEffect(()=>{if(!t)return;const n=t=>{const n=e.current;n&&t.target instanceof Node&&!n.contains(t.target)&&a.current()};return document.addEventListener("pointerdown",n,!0),()=>document.removeEventListener("pointerdown",n,!0)},[e,t])}function ChartLegendBar({series:a,colors:l,options:r,visibility:i,size:o,values:s,swatch:c}){const u=!1!==r.interactive,d="left"===r.side||"right"===r.side;return e("ul",{className:$("flex list-none flex-wrap items-center gap-x-3 gap-y-1 p-0",d?"min-w-0 flex-col items-start":"",X[r.align??"center"],R[o]),children:a.map((a,r)=>{const o=i.visible[r],d=null!==i.hovered&&i.hovered!==r,h=a.name??`${r+1}`,m=l[r],f=n(t,{children:[e("span",c?{"aria-hidden":"true",className:"flex size-2.5 shrink-0 items-center justify-center",children:c(r,m)}:{"aria-hidden":"true",className:`size-2.5 shrink-0 rounded-[0.1875rem] ${_}`,style:{backgroundColor:m}}),e("span",{className:"min-w-0 truncate",children:h}),s?.[r]?e("span",{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:s[r]}):null]});return e("li",{className:"min-w-0",children:u?e("button",{type:"button","aria-pressed":o,onClick:()=>i.toggle(r),onPointerEnter:()=>i.setHovered(r),onPointerLeave:()=>i.setHovered(null),onFocus:()=>i.setHovered(r),onBlur:()=>i.setHovered(null),className:$("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",o?d?"opacity-55":"":"opacity-40"),children:f}):e("span",{className:$("flex min-w-0 items-center gap-1.5 px-1 py-0.5 text-(--neba-fg)",o?"":"opacity-40"),children:f})},a.name??r)})})}function ChartScaleLegend({steps:a,from:l,to:r,middle:i,align:o,vertical:s,size:c}){return e("div",{className:$("flex",s?"":X[o]),children:n("div",{className:$("grid grid-cols-[auto_auto_auto] items-center gap-x-2",R[c]),children:[e("span",{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:l}),e("span",{"aria-hidden":"true",className:$("flex h-2.5 overflow-hidden rounded-[0.1875rem]",s?"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:r}),i?n(t,{children:[e("span",{}),e("span",{className:"text-center tabular-nums text-(--neba-muted-fg)",children:i}),e("span",{})]}):null]})})}function ChartTooltipPanel({heading:t,items:a,x:l,y:r,flip:i,size:o}){return n("div",{"data-neba-tooltip":"",className:$("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)]",R[o]),style:i?{right:`calc(100% - ${l}px + 10px)`,top:r}:{left:l+10,top:r},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 ChartSummary({id:t,template:n,count:a,min:l,max:r,locale:i}){return e("span",{id:t,hidden:!0,children:T(n,{count:A(i,{}).format(a),min:l,max:r})})}function q(e,t){let n=0,a=1/0,l=-1/0;for(const t of e)for(const e of t)null===e.value||Number.isNaN(e.value)||(n+=1,a=Math.min(a,e.value),l=Math.max(l,e.value));return 0===n?{count:n,min:"",max:""}:{count:n,min:t(a),max:t(l)}}function ChartStatus({heading:a,items:r}){return e("span",{role:"status","aria-live":"polite",className:W,children:0===r.length?null:n(t,{children:[F(a)?n(t,{children:[a,", "]}):null,r.map((e,t)=>n(l.Fragment,{children:[t>0?", ":null,e.name?`${e.name}: `:null,e.label??e.formatted]},e.seriesIndex))]})})}const J=/*@__PURE__*/l.memo(function ChartDataTable({id:t,caption:a,corner:l,categories:r,series:i,values:o,format:s,formatFor:c,locale:u}){return n("table",{id:t,className:W,children:[a?e("caption",{children:a}):null,e("thead",{children:n("tr",{children:[e("th",{scope:"col",children:l??""}),i.map((t,n)=>e("th",{scope:"col",children:t.name??n+1},t.name??n))]})}),e("tbody",{children:r.map((t,a)=>n("tr",{children:[e("th",{scope:"row",children:f(t,u)}),i.map((t,n)=>{const l=o[n]?.[a];return e("td",void 0!==l?.label?{children:l.label}:{children:null==l?.value?"":(c?.(n)??s)(l.value)},t.name??n)})]},a))})]})}),K=l.lazy(()=>import("./chart-brush.js").then(e=>({default:e.ChartBrush})));function ChartExport({rows:t,fileName:n,onExport:a,label:l}){return e("button",{type:"button","aria-label":l,title:l,onClick:async()=>{const{toCsv:e,downloadText:l}=await(import("./csv.js")),r=e(t());a?a(r):l(r,n,"text/csv;charset=utf-8")},className:$("absolute end-0 top-0 z-10 inline-flex size-6 cursor-pointer items-center justify-center","rounded-(--neba-radius-xs) text-(--neba-muted-fg)","hover:bg-(--n-soft) hover:text-(--neba-fg)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1",_),children:e("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",className:"size-3.5",children:e("path",{d:"M12 3v12m0 0 4-4m-4 4-4-4M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2"})})})}function ChartSurface({legend:t,legendSide:a,children:l,table:i,className:o,...s}){return n(r,{...s,className:$("relative flex gap-3",Z[a],o??void 0),children:[e("div",{className:"relative min-w-0 flex-1",children:l}),t,i]})}function ChartReferences({references:t,plot:a,horizontal:l,valuePx:r,categoryPx:i,categoryScale:o,categoryValuePx:s,fontSize:c}){return e("g",{children:t.map((t,u)=>{const d="value"===(t.axis??"value"),h=e=>d?r(e):o?s(e):(l?a.top:a.left)+i(e),m=d?!l:l,f=h(t.value),x=void 0===t.to?null:h(t.to),g=null===x?f:Math.min(f,x),v=null===x?f:Math.max(f,x),b=t.color?p(t.color):"var(--neba-muted-fg)",y=t.solid?void 0:"4 4",k=t.label?e("text",{x:m?a.left+a.width-4:g+4,y:m?g-5:a.top+c,textAnchor:m?"end":"start",fontSize:c,fontWeight:500,fill:b,children:t.label}):null;return n("g",{children:[null===x?null:e("rect",{x:m?a.left:g,y:m?g:a.top,width:m?a.width:Math.max(0,v-g),height:m?Math.max(0,v-g):a.height,fill:`color-mix(in oklab, ${b} 12%, transparent)`}),(null===x?[f]:[g,v]).map((t,n)=>e("line",{x1:m?a.left:t,x2:m?a.left+a.width:t,y1:m?t:a.top,y2:m?t:a.top+a.height,stroke:b,strokeWidth:1,strokeDasharray:y},n)),k]},u)})})}export function CartesianChart(r){const{series:m,categories:g,xAxis:p,yAxis:b,secondaryAxis:k,brush:P,references:T,horizontal:F=!1,stacked:_=!1,stackedFull:L=!1,includeZero:Z=!0,bandRatio:X=1,inset:U=!1,headroom:G=0,markInset:Q=0,xScale:ee="band",marks:te,markRadius:ne=24,table:ae,summary:le,swatch:re,scale:ie,markTooltip:oe,height:se,format:ce,locale:ue,label:de,legend:he,tooltip:me,empty:fe,exportable:xe=!1,exportFileName:ge="chart.csv",onExport:pe,size:ve="md",variant:be="text",padded:ye=!1,className:ke,children:Me,...we}=a(r,["size","variant","locale"]),Ce=l.useRef(null),Se=I(Ce),Ne=E(B,ue),ze=E(j,ue),Ae=l.useId(),Pe=l.useId(),je=O(m);l.useEffect(()=>{z(m.length)},[m.length]);const Be=s(m),Te=!0===P?{}:!1===P||void 0===P?null:P,[Ee,$e]=l.useState(null),Fe=Te?Te.range??Ee??Te.defaultRange??[0,Math.max(0,Be-1)]:[0,Math.max(0,Be-1)],Re=Math.min(Math.max(0,Math.round(Fe[0])),Math.max(0,Be-1)),We=Math.min(Math.max(Re,Math.round(Fe[1])),Math.max(0,Be-1)),_e=null!==Te&&(Re>0||We<Be-1),Le=l.useMemo(()=>_e?m.map(e=>({...e,data:e.data.slice(Re,We+1)})):m,[m,_e,Re,We]),De=l.useMemo(()=>_e&&g?g.slice(Re,We+1):g,[g,_e,Re,We]),[Ie,He]=l.useState(null),[Ve,Oe]=l.useState(null),[Ze,Xe]=l.useState(null),Ye=ce?JSON.stringify(ce):"",qe=l.useCallback(e=>ce?A(ue,ce).format(e):d(e,ue),[Ye,ue]),Je=l.useMemo(()=>w(Le),[Le]),Ke=je.visible.map(Number).join(""),Ue=l.useMemo(()=>L?M(Je,je.visible,qe):Je,[Je,L,Ke,qe]),Ge=l.useMemo(()=>Le.map((e,t)=>v(e,t)),[Le]),Qe=s(Le),et=l.useMemo(()=>Array.from({length:Qe},(e,t)=>o(t,De,Ue)),[Qe,De,Ue]),tt=l.useMemo(()=>_e?w(m):Ue,[_e,m,Ue]),nt=l.useMemo(()=>_e?Array.from({length:Be},(e,t)=>o(t,g,tt)):et,[_e,Be,g,tt,et]),at=Boolean(k)&&!_&&!L,lt=l.useCallback(e=>at&&"secondary"===Le[e]?.axis,[at,Le]),rt=Ue.filter((e,t)=>je.visible[t]),it=Ue.filter((e,t)=>je.visible[t]&&!lt(t)),ot=Ue.filter((e,t)=>je.visible[t]&<(t)),st=l.useMemo(()=>{const e=h(it,_),t=(T??[]).filter(e=>"value"===(e.axis??"value"));if(0===t.length)return e;const n=t.flatMap(e=>void 0===e.to?[e.value]:[e.value,e.to]);return{min:Math.min(e?.min??1/0,...n),max:Math.max(e?.max??-1/0,...n)}},[it,_,T]),ct=l.useMemo(()=>at?h(ot,!1):null,[at,ot]),ut=le??q(rt,qe),dt=V(se,ve,H(Ce,"string"==typeof se)),ht=u[ve],mt=b,ft=p,xt=ie??N(st,{min:mt?.min,max:mt?.max,tickCount:mt?.tickCount,includeZero:Z}),gt=null===ct?null:N(ct,{min:k?.min,max:k?.max,tickCount:k?.tickCount??xt.ticks.length,includeZero:Z}),pt="value"===ee?c(rt,De):null,vt="value"===ee?N(pt,{min:ft?.min,max:ft?.max,tickCount:ft?.tickCount,includeZero:!1}):null,bt=xt.ticks.map((e,t)=>mt?.tickFormat?String(mt.tickFormat(e,t)):qe(e)),yt=ft?.tickFormat,kt=l.useMemo(()=>vt?vt.ticks.map((e,t)=>yt?String(yt(e,t)):d(e,ue)):et.map((e,t)=>yt?String(yt(e,t)):f(e,ue)),[vt?vt.ticks.join(" "):et,yt,ue]),Mt=bt.reduce((e,t)=>Math.max(e,y(t,ht)),0),wt=(gt?.ticks??[]).map((e,t)=>k?.tickFormat?String(k.tickFormat(e,t)):qe(e)),Ct=wt.reduce((e,t)=>Math.max(e,y(t,ht)),0),St=ht+6,Nt=gt&&!k?.hidden?k?.thickness??(F?ht+12:Ct+10)+(k?.label?St:0):0,zt=F?ft:mt,At=Boolean(zt?.label)&&!zt?.hidden,Pt=F||ft?.hidden?0:ft?.tickAngle,jt=l.useMemo(()=>S(Pt,ht),[Pt,ht]),Bt=0!==jt.angle,Tt=mt?.hidden?0:Mt+10,Et=(Se-(F?0:Tt)-16)/Math.max(1,Qe),$t=Math.min(140,.4*dt),Ft=!vt&&(F||Bt||Et-6>=2.4*ht),Rt=F?150:Bt?jt.cut($t):Et-6,Wt=l.useMemo(()=>Ft?kt.map(e=>C(e,Rt,ht)):kt,[kt,Ft,Rt,ht]),_t=l.useMemo(()=>Wt.reduce((e,t)=>Math.max(e,y(t,ht)),0),[Wt,ht]),Lt=F?ft?.hidden?0:_t+10:Tt,Dt=jt.depth(_t),It=Te?(Te.height??32)+10:0,Ht=(F?mt?.hidden?0:ht+12+(mt?.label?St:0):ft?.hidden?0:Dt+12+(ft?.label?St:0))+It,Vt=(F?ft:mt)?.thickness??Lt,Ot=(F?mt:ft)?.thickness??Ht,Zt=(F||vt?12:Bt?jt.angle>0?jt.overhang(_t)+8:8:Math.max(8,Wt.length?jt.overhang(_t):8))+Q+(F?0:Nt),Xt=x[ve]+4+G+Q+(At?St+2:0)+(xe?20:0)+(F?Nt:0),Yt=dt,qt={left:Vt+Q,top:Xt,width:Math.max(0,Se-Vt-Q-Zt),height:Math.max(0,Yt-Xt-Ot-Q)},Jt=F?qt.height:qt.width,Kt=i(U?Math.max(1,Qe-1):Qe,Jt,X),Ut=l.useCallback(e=>U?Qe<=1?Jt/2:Jt*e/(Qe-1):Kt.centre(e),[U,Qe,Jt,Kt]),Gt=l.useCallback((e,t)=>{return n=void 0!==t&<(t)&>?gt:xt,F?qt.left+n.fraction(e)*qt.width:qt.top+(1-n.fraction(e))*qt.height;var n},[F,qt.left,qt.top,qt.width,qt.height,xt,gt,lt]),Qt=l.useCallback((e,t,n)=>F?{x:Gt(t,n),y:qt.top+Ut(e)}:{x:qt.left+Ut(e),y:Gt(t,n)},[F,Gt,Ut,qt.left,qt.top]),en=l.useCallback(e=>F?qt.top+(1-(vt?.fraction(e)??0))*qt.height:qt.left+(vt?.fraction(e)??0)*qt.width,[F,qt.left,qt.top,qt.width,qt.height,vt]),tn=l.useCallback(e=>{const t=void 0!==e&<(e)&>?gt:xt;return Gt(Math.min(Math.max(0,t.min),t.max),e)},[Gt,xt,gt,lt]),nn=tn(),an=l.useCallback(e=>lt(e)&&k?.tickFormat?e=>String(k.tickFormat(e,0)):qe,[lt,k,qe]),ln={plot:qt,values:Ue,visible:je.visible,colors:Ge,scale:xt,secondScale:gt,onSecond:lt,band:Kt,horizontal:F,valuePx:Gt,categoryPx:Ut,point:Qt,categoryScale:vt,categoryValuePx:en,zeroPx:nn,zeroPxOf:tn,categories:et,format:qe,size:ve},rn=te?te(ln):D,on=(T??[]).filter(e=>Boolean(e.label)),sn=e=>{const t=t=>"value"===(e.axis??"value")?qe(t):f(vt?t:et[t]??t,ue);return void 0===e.to?t(e.value):`${t(e.value)}–${t(e.to)}`},cn=!1===me?{mode:"none"}:!0===me||void 0===me?{}:me,un=cn.mode??(te?"item":"index"),dn=null===Ve?null:rn[Ve]??null,hn=te?dn?dn.index:null:Ie,mn=te?rn.length:Qe,fn=()=>{He(null),Oe(null),Xe(null)};Y(Ce,null!==hn,fn);const xn=e=>{if("none"!==un){if(te){const t=((e,t)=>{const n=Ce.current;if(!n||0===rn.length)return null;const a=n.getBoundingClientRect(),l=e-a.left,r=t-a.top;let i=null,o=1/0,s=1/0;return rn.forEach((e,t)=>{const n=e.x-l,a=e.y-r,c=Math.sqrt(n*n+a*a);let u;if(void 0===e.rx)u=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));u=Math.sqrt(t*t+l*l)}u<=ne&&(u<o||u===o&&c<s)&&(o=u,s=c,i=t)}),i})(e.clientX,e.clientY);t!==Ve&&Oe(t)}else{const t=((e,t)=>{const n=Ce.current;if(!n||0===Qe)return null;const a=n.getBoundingClientRect(),l=F?t-a.top-qt.top:e-a.left-qt.left;if(l<-Kt.step||l>Jt+Kt.step)return null;const r=U?Qe<=1?0:Math.round(l/Jt*(Qe-1)):Math.floor(l/Kt.step);return Math.min(Qe-1,Math.max(0,r))})(e.clientX,e.clientY);t!==Ie&&He(t)}"item"!==un||te||Xe(((e,t)=>{const n=Ce.current;if(!n)return null;const a=n.getBoundingClientRect();return F?e-a.left:t-a.top})(e.clientX,e.clientY))}},gn=e=>{const t=null===e?null:Math.min(mn-1,Math.max(0,e));te?Oe(t):He(t)},pn=e=>{Xe(null);gn(((te?Ve:Ie)??(e>0?-1:mn))+e)},vn=null===hn?[]:Le.flatMap((e,t)=>{if(!je.visible[t]||dn&&dn.series!==t)return[];const n=Ue[t]?.[hn];return n&&null!==n.value?[{seriesIndex:t,name:e.name,color:n.color??Ge[t],value:n.value,formatted:an(t)(n.value),label:n.label}]:[]}),bn=dn&&oe?oe(dn):null,yn=bn?bn.items:"item"===un&&vn.length>1&&null!==Ze?[vn.reduce((e,t)=>Math.abs(Gt(t.value??0)-Ze)<Math.abs(Gt(e.value??0)-Ze)?t:e)]:vn,kn=dn?Ue[dn.series]?.[dn.index]?.x??De?.[dn.index]??dn.index:void 0,Mn=e=>"number"==typeof e&&vt?A(ue,{}).format(e):f(e,ue),wn=dn?dn.x:F?Gt(yn[0]?.value??0):qt.left+Ut(hn??0),Cn=dn?dn.y:F?qt.top+Ut(hn??0):qt.top,Sn=dn?(dn.x-qt.left)/Math.max(1,qt.width)>.6:(F?xt.fraction(yn[0]?.value??0):Ut(hn??0)/Math.max(1,Jt))>.6,Nn=!1===he?{interactive:!1}:!0===he||void 0===he?{}:he,zn=!0===he||!1!==he&&Le.length>1,An=Nn.side??"bottom",Pn={...ln,hovered:je.hovered,activeIndex:hn,marks:rn,activeMark:dn},jn=0===Qe||null===st||"value"===ee&&null===pt;return n(ChartSurface,{...we,size:ve,variant:be,padded:ye,className:ke,legendSide:An,legend:zn?e(ChartLegendBar,{series:Le,colors:Ge,options:Nn,visibility:je,size:ve,swatch:re,values:Nn.showValue&&null!==hn?Le.map((e,t)=>{const n=Ue[t]?.[hn]?.value;return null==n?void 0:an(t)(n)}):void 0}):null,table:jn?null:n(t,{children:[ae?.(Ae,qe)??e(J,{id:Ae,caption:de,corner:ft?.label,categories:nt,series:Le,values:tt,format:qe,formatFor:at?an:void 0,locale:ue}),on.length>0?e("ul",{className:W,children:on.map((e,t)=>n("li",{children:[e.label,": ",sn(e)]},t))}):null]}),children:[xe&&!jn?e(ChartExport,{rows:()=>[[ft?.label??"",...Le.map((e,t)=>e.name??`${t+1}`)],...nt.map((e,t)=>[e,...tt.map(e=>e[t]?.value??null)])],fileName:ge,onExport:pe,label:ze.exportCsv}):null,n("div",{ref:Ce,role:"img",tabIndex:jn?void 0:0,"aria-label":de??ze.label,"aria-describedby":jn?void 0:Pe,onPointerMove:xn,onPointerDown:e=>{"touch"===e.pointerType&&xn(e)},onPointerLeave:e=>{"touch"!==e.pointerType&&fn()},onKeyDown:"none"===un?void 0:e=>{const t=F?"ArrowDown":"ArrowRight",n=F?"ArrowUp":"ArrowLeft";if(e.key===t)pn(1);else if(e.key===n)pn(-1);else if("Home"===e.key)gn(0);else if("End"===e.key)gn(mn-1);else{if("Escape"!==e.key)return;fn()}e.preventDefault()},onBlur:fn,className:$("relative w-full","rounded-(--neba-radius-xs)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"),style:{height:"string"==typeof se?se:dt},children:[jn?e("div",{className:$("flex h-full items-center justify-center text-(--neba-muted-fg)",R[ve]),children:fe??Ne.title}):Se>0?n("svg",{width:Se,height:Yt||"100%",viewBox:`0 0 ${Se} ${Yt}`,"aria-hidden":"true",className:"block overflow-visible",children:[e(ChartAxes,{plot:qt,scale:xt,band:Kt,horizontal:F,inset:U,categoryPx:Ut,valuePx:Gt,tickTexts:bt,widestTick:Mt,categoryTexts:Wt,widestCategory:_t,categoryScale:vt,categoryValuePx:en,valueAxis:mt,categoryAxis:ft,secondScale:gt,secondTickTexts:wt,secondaryAxis:k,fontSize:ht,turn:jt,labelDepth:Dt,zeroPx:nn}),T&&T.length>0?e(ChartReferences,{references:T,plot:qt,horizontal:F,valuePx:Gt,categoryPx:Ut,categoryScale:vt,categoryValuePx:en,fontSize:ht}):null,null===hn||te||"index"!==un||!1===cn.crosshair?null:(()=>{const t=Ut(hn);return e("line",F?{x1:qt.left,x2:qt.left+qt.width,y1:qt.top+t,y2:qt.top+t,stroke:"var(--neba-chart-baseline)",strokeWidth:1}:{x1:qt.left+t,x2:qt.left+t,y1:qt.top,y2:qt.top+qt.height,stroke:"var(--neba-chart-baseline)",strokeWidth:1})})(),Me(Pn)]}):null,null!==hn&&yn.length>0&&"none"!==un?cn.render?e("div",{className:"pointer-events-none absolute z-10",style:Sn?{right:`calc(100% - ${wn}px + 10px)`,top:Cn}:{left:wn+10,top:Cn},children:cn.render({index:hn,category:kn??et[hn],items:yn})}):e(ChartTooltipPanel,{heading:bn?bn.heading:Mn(kn??et[hn]),items:yn,x:wn,y:Cn,flip:Sn,size:ve}):null]}),Te&&!jn?e(l.Suspense,{fallback:null,children:e(K,{outline:(tt[je.visible.indexOf(!0)]??tt[0]??[]).map(e=>e.value),count:Be,range:[Re,We],onRange:e=>{$e(e),Te.onRangeChange?.(e)},color:Ge[Math.max(0,je.visible.indexOf(!0))]??Ge[0],height:Te.height??32,words:{start:ze.start,end:ze.end},categories:nt,locale:ue,width:Se})}):null,jn?null:e(ChartSummary,{id:Pe,template:ze.summary,locale:ue,...ut}),"none"===un?null:e(ChartStatus,{heading:null===hn?void 0:bn?.heading??Mn(kn??et[hn]),items:yn})]})}function ChartAxes({plot:a,scale:l,horizontal:r,categoryPx:i,valuePx:o,tickTexts:s,widestTick:c,categoryTexts:u,widestCategory:d,categoryScale:h,categoryValuePx:f,valueAxis:x,categoryAxis:g,secondScale:p,secondTickTexts:v,secondaryAxis:M,fontSize:w,turn:C,labelDepth:S,zeroPx:N}){const z=!1!==x?.grid&&!x?.hidden,A=r?g:x,P=r?x:g,j=!g?.hidden&&(g?.grid??null!==h),B=e=>h?f(h.ticks[e]):(r?a.top:a.left)+i(e),T=0!==C.angle,E=C.room(d),$=k(u.length,r?a.height:a.width,r?1.8*w:E),F=k(l.ticks.length,r?a.width:a.height,r?Math.max(c,1)+16:2*w),R=u.length>1?Math.abs(B(1)-B(0)):a.width,W=l.ticks.length>1?Math.abs(o(l.ticks[1])-o(l.ticks[0])):a.height,_=m(u.length,$,R,r?1.8*w:T?E:y(u[u.length-1]??"",w)),L=a.top+a.height+C.offset,D=m(l.ticks.length,F,W,r?y(s[s.length-1]??"",w):1.6*w);return n("g",{children:[l.ticks.map((t,i)=>{const c=o(t),u=Math.abs(t)<1e-9;return n("g",{children:[z?e("line",r?{x1:c,x2:c,y1:a.top,y2:a.top+a.height,stroke:u?"var(--neba-chart-baseline)":"var(--neba-chart-grid)",strokeWidth:1}:{x1:a.left,x2:a.left+a.width,y1:c,y2:c,stroke:u?"var(--neba-chart-baseline)":"var(--neba-chart-grid)",strokeWidth:1}):null,x?.hidden||!b(i,l.ticks.length,F,D)?null:e("text",r?{x:c,y:a.top+a.height+w+6,textAnchor:0===i?"start":i===l.ticks.length-1?"end":"middle",fontSize:w,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:s[i]}:{x:a.left-8,y:c,textAnchor:"end",dominantBaseline:"central",fontSize:w,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:s[i]})]},t)}),g?.hidden?null:n(t,{children:[e("line",r?{x1:N,x2:N,y1:a.top,y2:a.top+a.height,stroke:"var(--neba-chart-axis)",strokeWidth:1}:{x1:a.left,x2:a.left+a.width,y1:N,y2:N,stroke:"var(--neba-chart-axis)",strokeWidth:1}),u.map((t,l)=>{const i=B(l),o=b(l,u.length,$,_);return r?o?e("text",{x:a.left-8,y:i,textAnchor:"end",dominantBaseline:"central",fontSize:w,fill:"var(--neba-muted-fg)",className:h?"tabular-nums":void 0,children:t},l):null:n("g",{children:[j?e("line",{x1:i,x2:i,y1:a.top,y2:a.top+a.height,stroke:"var(--neba-chart-grid)",strokeWidth:1}):null,o?e("text",{x:i,y:L,textAnchor:T?C.anchor:h?0===l?"start":l===u.length-1?"end":"middle":"middle",transform:T?`rotate(${C.angle} ${i} ${L})`:void 0,dominantBaseline:T?"central":void 0,fontSize:w,fill:"var(--neba-muted-fg)",className:h?"tabular-nums":void 0,children:t}):null]},l)})]}),p&&!M?.hidden?p.ticks.map((t,n)=>{const l=r?a.left+p.fraction(t)*a.width:a.top+(1-p.fraction(t))*a.height;return b(n,p.ticks.length,F,D)?e("text",r?{x:l,y:a.top-8,textAnchor:0===n?"start":n===p.ticks.length-1?"end":"middle",fontSize:w,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:v[n]}:{x:a.left+a.width+8,y:l,textAnchor:"start",dominantBaseline:"central",fontSize:w,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:v[n]},t):null}):null,p&&M?.label&&!M.hidden?e("text",{x:a.left+a.width,y:w+2,textAnchor:"end",fontSize:w,fill:"var(--neba-muted-fg)",fontWeight:500,children:M.label}):null,A?.label&&!A.hidden?e("text",{x:a.left,y:w+2,textAnchor:"start",fontSize:w,fill:"var(--neba-muted-fg)",fontWeight:500,children:A.label}):null,P?.label&&!P.hidden?e("text",{x:a.left+a.width,y:a.top+a.height+S+w+12,textAnchor:"end",fontSize:w,fill:"var(--neba-muted-fg)",fontWeight:500,children:P.label}):null]})}export{J as ChartDataTable,ChartExport,ChartLegendBar,ChartScaleLegend,ChartStatus,ChartSummary,ChartSurface,ChartTooltipPanel,q as summarise,V as chartHeight,H as useMeasuredHeight,I as useMeasuredWidth,Y as useReleaseOutside,O as useVisibility};
|
|
1
|
+
"use client";import{jsx as e,Fragment as t,jsxs as n}from"react/jsx-runtime";import{useStyleDefaults as a}from"./defaults.js";import*as l from"react";import{Box as r}from"../components/box/Box.js";import{alignedScale as i,bandScale as o,categoryAt as s,categoryCount as c,categoryExtent as u,chartFontSizes as d,compactNumber as h,extentOf as m,fitsLast as f,formatCategory as x,markerRadii as g,plotHeights as p,resolveColor as v,seriesColor as b,showsTick as y,textWidth as k,tickStride as M,toFullShares as w,toValues as C,truncate as S,turnedAxis as N,valueScale as z,warnPaletteOverflow as A}from"./chart.js";import{numberFormatter as P}from"./format.js";import{observeResize as B}from"./observe.js";import{chartMessages as j,emptyMessages as T,fillMessage as E,useMessages as $}from"./i18n.js";import{cx as F,hasContent as R,metaTextClasses as I,srOnlyClasses as W,transitionClasses as _}from"./styles.js";const L="undefined"==typeof document?l.useEffect:l.useLayoutEffect,D=[];function H(e){const[t,n]=l.useState(0);return L(()=>{const t=e.current;if(!t)return;const a=()=>n(t.clientWidth);return a(),B(t,a)},[e]),t}function O(e,t){const[n,a]=l.useState(0);return L(()=>{const n=e.current;if(!t||!n)return;const l=()=>a(n.clientHeight);return l(),B(n,l)},[e,t]),n}function V(e,t,n){return"number"==typeof e?e:void 0===e?p[t]:n}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)]";function Z(e){const[t,n]=l.useState(()=>new Map),[a,r]=l.useState(null),i=function(e){const t=new Map;return e.map((e,n)=>{if(void 0===e.name)return`index:${n}`;const a=t.get(e.name)??0;return t.set(e.name,a+1),`name:${a}:${e.name}`})}(e),o=l.useRef({series:e,keys:i});l.useEffect(()=>{o.current={series:e,keys:i}});const s=l.useCallback(e=>{const{series:t,keys:a}=o.current,l=a[e];void 0!==l&&n(n=>{const a=new Map(n);return a.set(l,!(n.get(l)??!t[e]?.hidden)),a})},[]);return{visible:e.map((e,n)=>t.get(i[n])??!e.hidden),hovered:a,toggle:s,setHovered:r}}const X={top:"flex-col-reverse",bottom:"flex-col",left:"flex-row-reverse",right:"flex-row"},Y={start:"justify-start",center:"justify-center",end:"justify-end"};function q(e,t,n){const a=l.useRef(n);l.useEffect(()=>{a.current=n}),l.useEffect(()=>{if(!t)return;const n=t=>{const n=e.current;n&&t.target instanceof Node&&!n.contains(t.target)&&a.current()};return document.addEventListener("pointerdown",n,!0),()=>document.removeEventListener("pointerdown",n,!0)},[e,t])}function ChartLegendBar({series:a,colors:l,options:r,visibility:i,size:o,values:s,swatch:c}){const u=!1!==r.interactive,d="left"===r.side||"right"===r.side;return e("ul",{className:F("flex list-none flex-wrap items-center gap-x-3 gap-y-1 p-0",d?"min-w-0 flex-col items-start":"",Y[r.align??"center"],I[o]),children:a.map((a,r)=>{const o=i.visible[r],d=null!==i.hovered&&i.hovered!==r,h=a.name??`${r+1}`,m=l[r],f=n(t,{children:[e("span",c?{"aria-hidden":"true",className:"flex size-2.5 shrink-0 items-center justify-center",children:c(r,m)}:{"aria-hidden":"true",className:`size-2.5 shrink-0 rounded-[0.1875rem] ${_}`,style:{backgroundColor:m}}),e("span",{className:"min-w-0 truncate",children:h}),s?.[r]?e("span",{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:s[r]}):null]});return e("li",{className:"min-w-0",children:u?e("button",{type:"button","aria-pressed":o,onClick:()=>i.toggle(r),onPointerEnter:()=>i.setHovered(r),onPointerLeave:()=>i.setHovered(null),onFocus:()=>i.setHovered(r),onBlur:()=>i.setHovered(null),className:F("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",o?d?"opacity-55":"":"opacity-40"),children:f}):e("span",{className:F("flex min-w-0 items-center gap-1.5 px-1 py-0.5 text-(--neba-fg)",o?"":"opacity-40"),children:f})},a.name??r)})})}function ChartScaleLegend({steps:a,from:l,to:r,middle:i,align:o,vertical:s,size:c}){return e("div",{className:F("flex",s?"":Y[o]),children:n("div",{className:F("grid grid-cols-[auto_auto_auto] items-center gap-x-2",I[c]),children:[e("span",{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:l}),e("span",{"aria-hidden":"true",className:F("flex h-2.5 overflow-hidden rounded-[0.1875rem]",s?"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:r}),i?n(t,{children:[e("span",{}),e("span",{className:"text-center tabular-nums text-(--neba-muted-fg)",children:i}),e("span",{})]}):null]})})}function ChartTooltipPanel({heading:t,items:a,x:l,y:r,flip:i,size:o}){return n("div",{"data-neba-tooltip":"",className:F("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)]",I[o]),style:i?{right:`calc(100% - ${l}px + 10px)`,top:r}:{left:l+10,top:r},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 ChartSummary({id:e,template:t,count:a,min:l,max:r,second:i,locale:o}){const s=P(o,{});return n("span",{id:e,hidden:!0,children:[E(t,{count:s.format(a),min:l,max:r}),i&&i.count>0?` ${E(i.template,{count:s.format(i.count),min:i.min,max:i.max})}`:null]})}function J(e,t){let n=0,a=1/0,l=-1/0;for(const t of e)for(const e of t)null===e.value||Number.isNaN(e.value)||(n+=1,a=Math.min(a,e.value),l=Math.max(l,e.value));return 0===n?{count:n,min:"",max:""}:{count:n,min:t(a),max:t(l)}}function ChartStatus({heading:a,items:r}){return e("span",{role:"status","aria-live":"polite",className:W,children:0===r.length?null:n(t,{children:[R(a)?n(t,{children:[a,", "]}):null,r.map((e,t)=>n(l.Fragment,{children:[t>0?", ":null,e.name?`${e.name}: `:null,e.label??e.formatted]},e.seriesIndex))]})})}const K=/*@__PURE__*/l.memo(function ChartDataTable({id:t,caption:a,corner:l,categories:r,series:i,values:o,format:s,formatFor:c,locale:u}){return n("table",{id:t,className:W,children:[a?e("caption",{children:a}):null,e("thead",{children:n("tr",{children:[e("th",{scope:"col",children:l??""}),i.map((t,n)=>e("th",{scope:"col",children:t.name??n+1},t.name??n))]})}),e("tbody",{children:r.map((t,a)=>n("tr",{children:[e("th",{scope:"row",children:x(t,u)}),i.map((t,n)=>{const l=o[n]?.[a];return e("td",void 0!==l?.label?{children:l.label}:{children:null==l?.value?"":(c?.(n)??s)(l.value)},t.name??n)})]},a))})]})}),U=l.lazy(()=>import("./chart-brush.js").then(e=>({default:e.ChartBrush})));function ChartExport({rows:t,fileName:n,onExport:a,label:l}){return e("button",{type:"button","aria-label":l,title:l,onClick:async()=>{const{toCsv:e,downloadText:l}=await(import("./csv.js")),r=e(t());a?a(r):l(r,n,"text/csv;charset=utf-8")},className:F("absolute end-0 top-0 z-10 inline-flex size-6 cursor-pointer items-center justify-center","rounded-(--neba-radius-xs) text-(--neba-muted-fg)","hover:bg-(--n-soft) hover:text-(--neba-fg)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1",_),children:e("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",className:"size-3.5",children:e("path",{d:"M12 3v12m0 0 4-4m-4 4-4-4M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2"})})})}function ChartSurface({legend:t,legendSide:a,children:l,table:i,className:o,...s}){return n(r,{...s,className:F("relative flex gap-3",X[a],o??void 0),children:[e("div",{className:"relative min-w-0 flex-1",children:l}),t,i]})}function ChartReferences({references:t,plot:a,horizontal:l,valuePx:r,categoryPx:i,categoryScale:o,categoryValuePx:s,categoryBounds:c,categoryOffset:u,fontSize:d}){const[h,m]=c;return e("g",{children:t.map((t,c)=>{const f="value"===(t.axis??"value"),x=e=>f?e:Math.min(m,Math.max(h,e));if(!f&&Math.max(t.value,t.to??t.value)<h)return null;if(!f&&Math.min(t.value,t.to??t.value)>m)return null;const g=e=>f?r(e):o?s(e):(l?a.top:a.left)+i(e-u),p=f?!l:l,b=g(x(t.value)),y=void 0===t.to?null:g(x(t.to)),k=(void 0===t.to?[t.value]:[t.value,t.to]).filter(e=>f||e>=h&&e<=m).map(g),M=null===y?b:Math.min(b,y),w=null===y?b:Math.max(b,y),C=t.color?v(t.color):"var(--neba-muted-fg)",S=t.solid?void 0:"4 4",N=t.label?e("text",{x:p?a.left+a.width-4:M+4,y:p?M-5:a.top+d,textAnchor:p?"end":"start",fontSize:d,fontWeight:500,fill:C,children:t.label}):null;return n("g",{children:[null===y?null:e("rect",{x:p?a.left:M,y:p?M:a.top,width:p?a.width:Math.max(0,w-M),height:p?Math.max(0,w-M):a.height,fill:`color-mix(in oklab, ${C} 12%, transparent)`}),k.map((t,n)=>e("line",{x1:p?a.left:t,x2:p?a.left+a.width:t,y1:p?t:a.top,y2:p?t:a.top+a.height,stroke:C,strokeWidth:1,strokeDasharray:S},n)),N]},c)})})}export function CartesianChart(r){const{series:f,categories:p,xAxis:v,yAxis:y,secondaryAxis:M,brush:B,references:E,horizontal:R=!1,stacked:_=!1,stackedFull:L=!1,includeZero:X=!0,bandRatio:Y=1,inset:G=!1,headroom:Q=0,markInset:ee=0,xScale:te="band",marks:ne,markRadius:ae=24,table:le,exportRows:re,summary:ie,swatch:oe,scale:se,markTooltip:ce,height:ue,format:de,locale:he,label:me,legend:fe,tooltip:xe,empty:ge,exportable:pe=!1,exportFileName:ve="chart.csv",onExport:be,size:ye="md",variant:ke="text",padded:Me=!1,className:we,children:Ce,...Se}=a(r,["size","variant","locale"]),Ne=l.useRef(null),ze=H(Ne),Ae=$(T,he),Pe=$(j,he),Be=l.useId(),je=l.useId(),Te=Z(f);l.useEffect(()=>{A(f.length)},[f.length]);const Ee=c(f),$e=!0===B?{}:!1===B||void 0===B?null:B,[Fe,Re]=l.useState(null),Ie=$e?$e.range??Fe??$e.defaultRange??[0,Math.max(0,Ee-1)]:[0,Math.max(0,Ee-1)],We=Math.min(Math.max(0,Math.round(Ie[0])),Math.max(0,Ee-1)),_e=Math.min(Math.max(We,Math.round(Ie[1])),Math.max(0,Ee-1)),Le=null!==$e&&(We>0||_e<Ee-1),De=l.useMemo(()=>Le?f.map(e=>({...e,data:e.data.slice(We,_e+1)})):f,[f,Le,We,_e]),He=l.useMemo(()=>Le&&p?p.slice(We,_e+1):p,[p,Le,We,_e]),[Oe,Ve]=l.useState(null),[Ze,Xe]=l.useState(null),[Ye,qe]=l.useState(null),Je=de?JSON.stringify(de):"",Ke=l.useCallback(e=>de?P(he,de).format(e):h(e,he),[Je,he]),Ue=l.useMemo(()=>C(De),[De]),Ge=Te.visible.map(Number).join(""),Qe=l.useMemo(()=>L?w(Ue,Te.visible,Ke):Ue,[Ue,L,Ge,Ke]),et=l.useMemo(()=>De.map((e,t)=>b(e,t)),[De]),tt=c(De),nt=l.useMemo(()=>Array.from({length:tt},(e,t)=>s(t,He,Qe)),[tt,He,Qe]),at=Le||L,lt=l.useMemo(()=>at?C(f):null,[at,f]),rt=lt??Qe,it=l.useMemo(()=>Le&<?Array.from({length:Ee},(e,t)=>s(t,p,lt)):null,[Le,Ee,p,lt])??nt,ot=Math.max(0,Te.visible.indexOf(!0)),st=null!==$e,ct=l.useMemo(()=>st?(rt[ot]??[]).map(e=>e.value):[],[st,rt,ot]),ut=Boolean(M)&&!_&&!L,dt=f.map(e=>"secondary"===e.axis?"1":"0").join(""),ht=l.useCallback(e=>ut&&"1"===dt[e],[ut,dt]),mt=Qe.filter((e,t)=>Te.visible[t]),ft=l.useMemo(()=>{const e=m(Qe.filter((e,t)=>Te.visible[t]&&!ht(t)),_),t=(E??[]).filter(e=>"value"===(e.axis??"value"));if(0===t.length)return e;const n=t.flatMap(e=>void 0===e.to?[e.value]:[e.value,e.to]);return{min:Math.min(e?.min??1/0,...n),max:Math.max(e?.max??-1/0,...n)}},[Qe,Ge,ht,_,E]),xt=l.useMemo(()=>ut?m(Qe.filter((e,t)=>Te.visible[t]&&ht(t)),!1):null,[ut,Qe,Ge,ht]),gt=M?.tickFormat,pt=ie??J(ut?Qe.filter((e,t)=>Te.visible[t]&&!ht(t)):mt,Ke),vt=void 0===ie&&ut?J(Qe.filter((e,t)=>Te.visible[t]&&ht(t)),gt?e=>String(gt(e,0)):Ke):null,bt=V(ue,ye,O(Ne,"string"==typeof ue)),yt=d[ye],kt=y,Mt=v,wt=se??z(ft,{min:kt?.min,max:kt?.max,tickCount:kt?.tickCount,includeZero:X}),Ct=null===xt?null:void 0===M?.tickCount?i(xt,wt.ticks.length-1,{min:M?.min,max:M?.max,includeZero:X}):z(xt,{min:M?.min,max:M?.max,tickCount:M.tickCount,includeZero:X}),St="value"===te?u(mt,He):null,Nt="value"===te?z(St,{min:Mt?.min,max:Mt?.max,tickCount:Mt?.tickCount,includeZero:!1}):null,zt=wt.ticks.map((e,t)=>kt?.tickFormat?String(kt.tickFormat(e,t)):Ke(e)),At=Mt?.tickFormat,Pt=l.useMemo(()=>Nt?Nt.ticks.map((e,t)=>At?String(At(e,t)):h(e,he)):nt.map((e,t)=>At?String(At(e,t)):x(e,he)),[Nt?Nt.ticks.join(" "):nt,At,he]),Bt=zt.reduce((e,t)=>Math.max(e,k(t,yt)),0),jt=(Ct?.ticks??[]).map((e,t)=>M?.tickFormat?String(M.tickFormat(e,t)):Ke(e)),Tt=jt.reduce((e,t)=>Math.max(e,k(t,yt)),0),Et=yt+6,$t=Ct&&!M?.hidden?M?.thickness??(R?yt+12:Tt+10):0,Ft=R?Mt:kt,Rt=Boolean(Ft?.label)&&!Ft?.hidden,It=Boolean(Ct&&M?.label&&!M.hidden),Wt=R||Mt?.hidden?0:Mt?.tickAngle,_t=l.useMemo(()=>N(Wt,yt),[Wt,yt]),Lt=0!==_t.angle,Dt=kt?.hidden?0:Bt+10,Ht=(ze-(R?0:Dt)-16)/Math.max(1,tt),Ot=Math.min(140,.4*bt),Vt=!Nt&&(R||Lt||Ht-6>=2.4*yt),Zt=R?150:Lt?_t.cut(Ot):Ht-6,Xt=l.useMemo(()=>Vt?Pt.map(e=>S(e,Zt,yt)):Pt,[Pt,Vt,Zt,yt]),Yt=l.useMemo(()=>Xt.reduce((e,t)=>Math.max(e,k(t,yt)),0),[Xt,yt]),qt=R?Mt?.hidden?0:Yt+10:Dt,Jt=_t.depth(Yt),Kt=$e?($e.height??32)+10:0,Ut=R?kt?.hidden?0:yt+12+(kt?.label?Et:0):Mt?.hidden?0:Jt+12+(Mt?.label?Et:0),Gt=(R?Mt:kt)?.thickness??qt,Qt=((R?kt:Mt)?.thickness??Ut)+Kt,en=(R||Nt?12:Lt?_t.angle>0?_t.overhang(Yt)+8:8:Math.max(8,Xt.length?_t.overhang(Yt):8))+ee+(R?0:$t),tn=g[ye]+4+Q+ee+(Rt||It?Et+2:0)+(pe?20:0)+(R?$t:0),nn=bt,an={left:Gt+ee,top:tn,width:Math.max(0,ze-Gt-ee-en),height:Math.max(0,nn-tn-Qt-ee)},ln=R?an.height:an.width,rn=o(G?Math.max(1,tt-1):tt,ln,Y),on=l.useCallback(e=>G?tt<=1?ln/2:ln*e/(tt-1):rn.centre(e),[G,tt,ln,rn]),sn=l.useCallback((e,t)=>{return n=void 0!==t&&ht(t)&&Ct?Ct:wt,R?an.left+n.fraction(e)*an.width:an.top+(1-n.fraction(e))*an.height;var n},[R,an.left,an.top,an.width,an.height,wt,Ct,ht]),cn=l.useCallback((e,t,n)=>R?{x:sn(t,n),y:an.top+on(e)}:{x:an.left+on(e),y:sn(t,n)},[R,sn,on,an.left,an.top]),un=l.useCallback(e=>R?an.top+(1-(Nt?.fraction(e)??0))*an.height:an.left+(Nt?.fraction(e)??0)*an.width,[R,an.left,an.top,an.width,an.height,Nt]),dn=l.useCallback(e=>{const t=void 0!==e&&ht(e)&&Ct?Ct:wt;return sn(Math.min(Math.max(0,t.min),t.max),e)},[sn,wt,Ct,ht]),hn=dn(),mn=M?.tickFormat,fn=l.useCallback(e=>ht(e)&&mn?e=>String(mn(e,0)):Ke,[ht,mn,Ke]),xn={plot:an,values:Qe,visible:Te.visible,colors:et,scale:wt,secondScale:Ct,onSecond:ht,band:rn,horizontal:R,valuePx:sn,categoryPx:on,point:cn,categoryScale:Nt,categoryValuePx:un,zeroPx:hn,zeroPxOf:dn,categories:nt,format:Ke,formatFor:fn,size:ye},gn=ne?ne(xn):D,pn=(E??[]).filter(e=>Boolean(e.label)),vn=e=>{const t=t=>"value"===(e.axis??"value")?Ke(t):x(Nt?t:it[t]??t,he);return void 0===e.to?t(e.value):`${t(e.value)}–${t(e.to)}`},bn=!1===xe?{mode:"none"}:!0===xe||void 0===xe?{}:xe,yn=bn.mode??(ne?"item":"index"),kn=null===Ze?null:gn[Ze]??null,Mn=ne?kn?kn.index:null:Oe,wn=ne?gn.length:tt,Cn=()=>{Ve(null),Xe(null),qe(null)};q(Ne,null!==Mn,Cn);const Sn=e=>{if("none"!==yn){if(ne){const t=((e,t)=>{const n=Ne.current;if(!n||0===gn.length)return null;const a=n.getBoundingClientRect(),l=e-a.left,r=t-a.top;let i=null,o=1/0,s=1/0;return gn.forEach((e,t)=>{const n=e.x-l,a=e.y-r,c=Math.sqrt(n*n+a*a);let u;if(void 0===e.rx)u=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));u=Math.sqrt(t*t+l*l)}u<=ae&&(u<o||u===o&&c<s)&&(o=u,s=c,i=t)}),i})(e.clientX,e.clientY);t!==Ze&&Xe(t)}else{const t=((e,t)=>{const n=Ne.current;if(!n||0===tt)return null;const a=n.getBoundingClientRect(),l=R?t-a.top-an.top:e-a.left-an.left;if(l<-rn.step||l>ln+rn.step)return null;const r=G?tt<=1?0:Math.round(l/ln*(tt-1)):Math.floor(l/rn.step);return Math.min(tt-1,Math.max(0,r))})(e.clientX,e.clientY);t!==Oe&&Ve(t)}"item"!==yn||ne||qe(((e,t)=>{const n=Ne.current;if(!n)return null;const a=n.getBoundingClientRect();return R?e-a.left:t-a.top})(e.clientX,e.clientY))}},Nn=e=>{const t=null===e?null:Math.min(wn-1,Math.max(0,e));ne?Xe(t):Ve(t)},zn=e=>{qe(null);Nn(((ne?Ze:Oe)??(e>0?-1:wn))+e)},An=null===Mn?[]:De.flatMap((e,t)=>{if(!Te.visible[t]||kn&&kn.series!==t)return[];const n=Qe[t]?.[Mn];return n&&null!==n.value?[{seriesIndex:t,name:e.name,color:n.color??et[t],value:n.value,formatted:fn(t)(n.value),label:n.label}]:[]}),Pn=kn&&ce?ce(kn):null,Bn=new Map;let jn=0,Tn=0;for(const e of An){const t=e.value??0,n=_?t<0?Tn:jn:t,a=_?n+t:t;_&&t<0?Tn=a:_&&(jn=a),Bn.set(e.seriesIndex,[sn(n,e.seriesIndex),sn(a,e.seriesIndex)])}const En=(e,t)=>{const[n,a]=Bn.get(e.seriesIndex)??[t,t];return Math.max(0,Math.min(n,a)-t,t-Math.max(n,a))},$n=Pn?Pn.items:"item"===yn&&An.length>1&&null!==Ye?[An.reduce((e,t)=>En(t,Ye)<En(e,Ye)?t:e)]:An,Fn=kn?Qe[kn.series]?.[kn.index]?.x??He?.[kn.index]??kn.index:void 0,Rn=e=>"number"==typeof e&&Nt?P(he,{}).format(e):x(e,he),In=kn?kn.x:R?Bn.get($n[0]?.seriesIndex??-1)?.[1]??sn($n[0]?.value??0,$n[0]?.seriesIndex):an.left+on(Mn??0),Wn=kn?kn.y:R?an.top+on(Mn??0):an.top,_n=kn?(kn.x-an.left)/Math.max(1,an.width)>.6:(R?(In-an.left)/Math.max(1,an.width):on(Mn??0)/Math.max(1,ln))>.6,Ln=!1===fe?{interactive:!1}:!0===fe||void 0===fe?{}:fe,Dn=!0===fe||!1!==fe&&De.length>1,Hn=Ln.side??"bottom",On={...xn,hovered:Te.hovered,activeIndex:Mn,marks:gn,activeMark:kn},Vn=0===tt||null===ft||"value"===te&&null===St,Zn=Le&&Vn&&rt.some((e,t)=>Te.visible[t]&&e.some(e=>null!==e.value)),Xn=Vn&&!Zn;return n(ChartSurface,{...Se,size:ye,variant:ke,padded:Me,className:we,legendSide:Hn,legend:Dn?e(ChartLegendBar,{series:De,colors:et,options:Ln,visibility:Te,size:ye,swatch:oe,values:Ln.showValue&&null!==Mn?De.map((e,t)=>{const n=Qe[t]?.[Mn]?.value;return null==n?void 0:fn(t)(n)}):void 0}):null,table:Xn?null:n(t,{children:[le?.(Be,Ke)??e(K,{id:Be,caption:me,corner:Mt?.label,categories:it,series:f,values:rt,format:Ke,formatFor:ut?fn:void 0,locale:he}),pn.length>0?e("ul",{className:W,children:pn.map((e,t)=>n("li",{children:[e.label,": ",vn(e)]},t))}):null]}),children:[pe&&!Xn?e(ChartExport,{rows:re??(()=>[["string"==typeof Mt?.label?Mt.label:"",...De.map((e,t)=>e.name??`${t+1}`)],...it.map((e,t)=>[e,...rt.map(e=>e[t]?.value??null)])]),fileName:ve,onExport:be,label:Pe.exportCsv}):null,n("div",{ref:Ne,role:"img",tabIndex:Vn?void 0:0,"aria-label":me??Pe.label,"aria-describedby":Vn?void 0:je,onPointerMove:Sn,onPointerDown:e=>{"touch"===e.pointerType&&Sn(e)},onPointerLeave:e=>{"touch"!==e.pointerType&&Cn()},onKeyDown:"none"===yn?void 0:e=>{const t=R?"ArrowDown":"ArrowRight",n=R?"ArrowUp":"ArrowLeft";if(e.key===t)zn(1);else if(e.key===n)zn(-1);else if("Home"===e.key)Nn(0);else if("End"===e.key)Nn(wn-1);else{if("Escape"!==e.key)return;Cn()}e.preventDefault()},onBlur:Cn,className:F("relative w-full","rounded-(--neba-radius-xs)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"),style:{height:"string"==typeof ue?ue:bt},children:[Vn?e("div",{className:F("flex h-full items-center justify-center text-(--neba-muted-fg)",I[ye]),style:Zn?{paddingBottom:Kt}:void 0,children:ge??Ae.title}):ze>0?n("svg",{width:ze,height:nn||"100%",viewBox:`0 0 ${ze} ${nn}`,"aria-hidden":"true",className:"block overflow-visible",children:[e(ChartAxes,{plot:an,scale:wt,band:rn,horizontal:R,inset:G,categoryPx:on,valuePx:sn,tickTexts:zt,widestTick:Bt,categoryTexts:Xt,widestCategory:Yt,categoryScale:Nt,categoryValuePx:un,valueAxis:kt,categoryAxis:Mt,secondScale:Ct,secondTickTexts:jt,secondaryAxis:M,fontSize:yt,turn:_t,labelDepth:Jt,zeroPx:hn}),E&&E.length>0?e(ChartReferences,{references:E,plot:an,horizontal:R,valuePx:sn,categoryPx:on,categoryScale:Nt,categoryValuePx:un,categoryBounds:Nt?[Nt.min,Nt.max]:G?[We,We+tt-1]:[We-.5,We+tt-.5],categoryOffset:We,fontSize:yt}):null,null===Mn||ne||"index"!==yn||!1===bn.crosshair?null:(()=>{const t=on(Mn);return e("line",R?{x1:an.left,x2:an.left+an.width,y1:an.top+t,y2:an.top+t,stroke:"var(--neba-chart-baseline)",strokeWidth:1}:{x1:an.left+t,x2:an.left+t,y1:an.top,y2:an.top+an.height,stroke:"var(--neba-chart-baseline)",strokeWidth:1})})(),Ce(On)]}):null,null!==Mn&&$n.length>0&&"none"!==yn?bn.render?e("div",{className:"pointer-events-none absolute z-10",style:_n?{right:`calc(100% - ${In}px + 10px)`,top:Wn}:{left:In+10,top:Wn},children:bn.render({index:Mn,category:Fn??nt[Mn],items:$n})}):e(ChartTooltipPanel,{heading:Pn?Pn.heading:Rn(Fn??nt[Mn]),items:$n,x:In,y:Wn,flip:_n,size:ye}):null]}),$e&&!Xn?e(l.Suspense,{fallback:null,children:e(U,{outline:ct,count:Ee,range:[We,_e],onRange:e=>{Re(e),$e.onRangeChange?.(e)},color:et[Math.max(0,Te.visible.indexOf(!0))]??et[0],height:$e.height??32,words:{start:Pe.start,end:Pe.end},label:me??Pe.label,categories:it,locale:he,width:ze})}):null,Vn?null:e(ChartSummary,{id:je,template:Pe.summary,locale:he,...pt,second:vt?{template:Pe.summarySecondary,...vt}:null}),"none"===yn?null:e(ChartStatus,{heading:null===Mn?void 0:Pn?.heading??Rn(Fn??nt[Mn]),items:$n})]})}function ChartAxes({plot:a,scale:l,horizontal:r,categoryPx:i,valuePx:o,tickTexts:s,widestTick:c,categoryTexts:u,widestCategory:d,categoryScale:h,categoryValuePx:m,valueAxis:x,categoryAxis:g,secondScale:p,secondTickTexts:v,secondaryAxis:b,fontSize:w,turn:C,labelDepth:S,zeroPx:N}){const z=!1!==x?.grid&&!x?.hidden,A=r?g:x,P=r?x:g,B=!g?.hidden&&(g?.grid??null!==h),j=e=>h?m(h.ticks[e]):(r?a.top:a.left)+i(e),T=0!==C.angle,E=C.room(d),$=M(u.length,r?a.height:a.width,r?1.8*w:E),F=M(l.ticks.length,r?a.width:a.height,r?Math.max(c,1)+16:2*w),R=u.length>1?Math.abs(j(1)-j(0)):a.width,I=l.ticks.length>1?Math.abs(o(l.ticks[1])-o(l.ticks[0])):a.height,W=f(u.length,$,R,r?1.8*w:T?E:k(u[u.length-1]??"",w)),_=a.top+a.height+C.offset,L=f(l.ticks.length,F,I,r?k(s[s.length-1]??"",w):1.6*w);return n("g",{children:[l.ticks.map((t,i)=>{const c=o(t),u=Math.abs(t)<1e-9;return n("g",{children:[z?e("line",r?{x1:c,x2:c,y1:a.top,y2:a.top+a.height,stroke:u?"var(--neba-chart-baseline)":"var(--neba-chart-grid)",strokeWidth:1}:{x1:a.left,x2:a.left+a.width,y1:c,y2:c,stroke:u?"var(--neba-chart-baseline)":"var(--neba-chart-grid)",strokeWidth:1}):null,x?.hidden||!y(i,l.ticks.length,F,L)?null:e("text",r?{x:c,y:a.top+a.height+w+6,textAnchor:0===i?"start":i===l.ticks.length-1?"end":"middle",fontSize:w,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:s[i]}:{x:a.left-8,y:c,textAnchor:"end",dominantBaseline:"central",fontSize:w,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:s[i]})]},t)}),g?.hidden?null:n(t,{children:[e("line",r?{x1:N,x2:N,y1:a.top,y2:a.top+a.height,stroke:"var(--neba-chart-axis)",strokeWidth:1}:{x1:a.left,x2:a.left+a.width,y1:N,y2:N,stroke:"var(--neba-chart-axis)",strokeWidth:1}),u.map((t,l)=>{const i=j(l),o=y(l,u.length,$,W);return r?o?e("text",{x:a.left-8,y:i,textAnchor:"end",dominantBaseline:"central",fontSize:w,fill:"var(--neba-muted-fg)",className:h?"tabular-nums":void 0,children:t},l):null:n("g",{children:[B?e("line",{x1:i,x2:i,y1:a.top,y2:a.top+a.height,stroke:"var(--neba-chart-grid)",strokeWidth:1}):null,o?e("text",{x:i,y:_,textAnchor:T?C.anchor:h?0===l?"start":l===u.length-1?"end":"middle":"middle",transform:T?`rotate(${C.angle} ${i} ${_})`:void 0,dominantBaseline:T?"central":void 0,fontSize:w,fill:"var(--neba-muted-fg)",className:h?"tabular-nums":void 0,children:t}):null]},l)})]}),p&&!b?.hidden?p.ticks.map((t,n)=>{const l=r?a.left+p.fraction(t)*a.width:a.top+(1-p.fraction(t))*a.height;return y(n,p.ticks.length,F,L)?e("text",r?{x:l,y:a.top-8,textAnchor:0===n?"start":n===p.ticks.length-1?"end":"middle",fontSize:w,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:v[n]}:{x:a.left+a.width+8,y:l,textAnchor:"start",dominantBaseline:"central",fontSize:w,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:v[n]},t):null}):null,p&&b?.label&&!b.hidden?e("text",{x:a.left+a.width,y:w+2,textAnchor:"end",fontSize:w,fill:"var(--neba-muted-fg)",fontWeight:500,children:b.label}):null,A?.label&&!A.hidden?e("text",{x:a.left,y:w+2,textAnchor:"start",fontSize:w,fill:"var(--neba-muted-fg)",fontWeight:500,children:A.label}):null,P?.label&&!P.hidden?e("text",{x:a.left+a.width,y:a.top+a.height+S+w+12,textAnchor:"end",fontSize:w,fill:"var(--neba-muted-fg)",fontWeight:500,children:P.label}):null]})}export{K as ChartDataTable,ChartExport,ChartLegendBar,ChartScaleLegend,ChartStatus,ChartSummary,ChartSurface,ChartTooltipPanel,J as summarise,V as chartHeight,O as useMeasuredHeight,H as useMeasuredWidth,q as useReleaseOutside,Z as useVisibility};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as l,jsxs as e}from"react/jsx-runtime";import{areaPath as r,chartFontSizes as t,labelInk as o,labelledPoints as n,linePath as a,lineWidths as i,markerRadii as s,markGap as u}from"./chart.js";import{markTransitionClasses as c}from"./chart-frame.js";export function LineSeries({context:f,curve:p,filled:d,stacked:m,markers:x,valueLabels:h,connectNulls:k,gradient:v,idPrefix:$}){const{values:b,visible:y,colors:g,hovered:j,activeIndex:C,plot:L,point:N,zeroPxOf:W,size:z,
|
|
1
|
+
import{jsx as l,jsxs as e}from"react/jsx-runtime";import{areaPath as r,chartFontSizes as t,labelInk as o,labelledPoints as n,linePath as a,lineWidths as i,markerRadii as s,markGap as u}from"./chart.js";import{markTransitionClasses as c}from"./chart-frame.js";export function LineSeries({context:f,curve:p,filled:d,stacked:m,markers:x,valueLabels:h,connectNulls:k,gradient:v,idPrefix:$}){const{values:b,visible:y,colors:g,hovered:j,activeIndex:C,plot:L,point:N,zeroPxOf:W,size:z,formatFor:B}=f,O=i[z],S=s[z],w=y.indexOf(!0),E=[],G=[],P=[];return b.forEach((l,e)=>{const r=l.map((l,e)=>(l.value??0)<0?P[e]??0:G[e]??0);E.push(r),m&&y[e]&&l.forEach((l,e)=>{const r=l.value??0;r<0?P[e]=(P[e]??0)+r:G[e]=(G[e]??0)+r})}),e("g",{children:[e("defs",{children:[v?g.map((r,t)=>e("linearGradient",{id:`${$}-stroke-${t}`,gradientUnits:"userSpaceOnUse",x1:L.left,y1:0,x2:L.left+L.width,y2:0,children:[l("stop",{offset:"0%",stopColor:`color-mix(in oklab, ${r} 45%, transparent)`}),l("stop",{offset:"100%",stopColor:r})]},`stroke-${t}`)):null,d&&!m?g.map((r,t)=>e("linearGradient",{id:`${$}-fill-${t}`,x1:"0",y1:"0",x2:"0",y2:"1",children:[l("stop",{offset:"0%",stopColor:`color-mix(in oklab, ${r} 28%, transparent)`}),l("stop",{offset:"100%",stopColor:`color-mix(in oklab, ${r} 2%, transparent)`})]},`fill-${t}`)):null]}),b.map((i,s)=>{if(!y[s])return null;const f=g[s],b=null!==j&&j!==s,G=i.map((l,e)=>{if(null===l.value)return null;const r=m?E[s][e]+l.value:l.value;return N(e,r,s)}),P=k?G.filter(Boolean):G,U=W(s),A=i.map((l,e)=>null===l.value?null:m?N(e,E[s][e],s):{x:N(e,l.value,s).x,y:U}),F=d&&m,I=n(i,h);return e("g",{opacity:b?.28:1,className:c,children:[d?l("path",{d:r(P,k?A.filter(Boolean):A,p),fill:m?`color-mix(in oklab, ${f} 70%, transparent)`:`url(#${$}-fill-${s})`,stroke:"none"}):null,F&&s!==w?l("path",{d:a(k?A.filter(Boolean):A,p),fill:"none",stroke:"var(--neba-chart-gap)",strokeWidth:u}):null,F?null:l("path",{d:a(P,p),fill:"none",stroke:v?`url(#${$}-stroke-${s})`:f,strokeWidth:O,strokeLinecap:"round",strokeLinejoin:"round"}),G.map((e,r)=>{if(!e)return null;return"all"===x||"auto"===x&&i.length<=14||r===C?l("circle",{cx:e.x,cy:e.y,r:r===C?S+1:S,fill:i[r].color??f,stroke:"var(--neba-chart-gap)",strokeWidth:u,className:c},r):null}),"none"===h?null:G.map((e,r)=>{const n=i[r].value;return e&&null!==n&&I(r)?l("text",{x:e.x,y:e.y-S-5,textAnchor:e.x>L.left+L.width-24?"end":e.x<L.left+24?"start":"middle",fontSize:t[z],fontWeight:500,fill:o(i[r].color??f),className:"tabular-nums",children:i[r].label??B(s)(n)},`label-${r}`):null})]},s)})]})}
|
package/dist/internal/chart.d.ts
CHANGED
|
@@ -279,6 +279,27 @@ export declare function valueScale(extent: {
|
|
|
279
279
|
/** Keeps zero in range. Off for a line chart told an explicit `min`. */
|
|
280
280
|
includeZero?: boolean;
|
|
281
281
|
}): ValueScale;
|
|
282
|
+
/**
|
|
283
|
+
* A second value axis' scale, cut into exactly as many intervals as the first
|
|
284
|
+
* axis has, so that each of its ticks sits on one of the first axis' gridlines.
|
|
285
|
+
*
|
|
286
|
+
* Asking `valueScale` for the same tick count is not enough: the count is a
|
|
287
|
+
* wish that clean numbers overrule, so a revenue axis of seven intervals beside
|
|
288
|
+
* a rate axis of five drew two sets of lines crossing each other, and the far
|
|
289
|
+
* edge's labels, thinned at the first axis' stride, stood beside nothing. Here
|
|
290
|
+
* the count is the fixed thing and the step gives: the smallest 1-2-5 step
|
|
291
|
+
* whose run of intervals, started on a multiple of itself, still covers the
|
|
292
|
+
* data. Both ends pinned leaves nothing to round, and the step is the range
|
|
293
|
+
* divided by the count, whatever number that is.
|
|
294
|
+
*/
|
|
295
|
+
export declare function alignedScale(extent: {
|
|
296
|
+
min: number;
|
|
297
|
+
max: number;
|
|
298
|
+
} | null, intervals: number, options?: {
|
|
299
|
+
min?: number;
|
|
300
|
+
max?: number;
|
|
301
|
+
includeZero?: boolean;
|
|
302
|
+
}): ValueScale;
|
|
282
303
|
/** The units a time axis is allowed to step in. */
|
|
283
304
|
export type TimeUnit = 'second' | 'minute' | 'hour' | 'day' | 'week' | 'month' | 'quarter' | 'year';
|
|
284
305
|
/** A value scale whose numbers are instants, and the unit its ticks step in. */
|
package/dist/internal/chart.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{parseColor as t,readableInk as e}from"./color.js";import{dateFormatter as n,numberFormatter as r}from"./format.js";export const plotHeights={xs:120,sm:160,md:220,lg:280,xl:360};export const sparklineHeights={xs:16,sm:20,md:28,lg:40,xl:56};export const lineWidths={xs:1.5,sm:1.75,md:2,lg:2.25,xl:2.5};export const markerRadii={xs:3,sm:3.5,md:4,lg:4.5,xl:5};export const chartFontSizes={xs:10,sm:11,md:12,lg:13,xl:14};export const barMaxThickness={xs:14,sm:18,md:24,lg:30,xl:36};export const barBandRatio={default:.62,compact:.82};export const markGap=2;export const barRadius=4;export const chartPalette=["var(--neba-chart-1)","var(--neba-chart-2)","var(--neba-chart-3)","var(--neba-chart-4)","var(--neba-chart-5)","var(--neba-chart-6)","var(--neba-chart-7)","var(--neba-chart-8)"];export function inkOn(n,r){if(!n)return`var(--neba-chart-on-${r%chartPalette.length+1})`;const a=o.has(n)?null:t(n);return a?e(a.hsv):"var(--neba-surface)"}export function labelInk(t){return`color-mix(in oklab, ${t} 85%, var(--neba-fg))`}const o=new Set(["primary","secondary","success","warning","danger","info"]);export function resolveColor(t){return o.has(t)?`var(--neba-${t}-accent)`:t}export function seriesColor(t,e,n=chartPalette){return resolveColor(t?.color?t.color:n[e%n.length]??chartPalette[0])}const a=new Set;export function warnPaletteOverflow(t){"production"===process.env.NODE_ENV||t<=chartPalette.length||a.has(t)||(a.add(t),console.warn(`Neba: a chart was given ${t} series and its palette has ${chartPalette.length} colours, so the colours repeat from the ninth series. Fold the smallest into an "Other" series, or draw a second chart.`))}export function toFullShares(t,e,n){const r=[];return t.forEach((t,n)=>{!1!==e[n]&&t.forEach((t,e)=>{r[e]=(r[e]??0)+Math.abs(t.value??0)})}),t.map(t=>t.map((t,e)=>{if(null===t.value)return t;const o=r[e]??0;return{...t,value:0===o?0:t.value/o*100,label:t.label??n(t.value)}}))}export function toValue(t){return null==t?{value:null}:"number"==typeof t?{value:Number.isFinite(t)?t:null}:(t=>"object"==typeof t&&null!==t)(t)?{value:null!==t.y&&Number.isFinite(t.y)?t.y:null,x:t.x,z:t.z,color:t.color?resolveColor(t.color):void 0,label:t.label}:{value:null}}export function toValues(t){return t.map(t=>t.data.map(toValue))}export function zeroGaps(t){return t.map(t=>({...t,data:t.data.map(t=>null==t?0:"number"==typeof t?Number.isFinite(t)?t:0:null!==t.y&&Number.isFinite(t.y)?t:{...t,y:0})}))}export function toNumber(t){return t instanceof Date?Number.isFinite(t.getTime())?t.getTime():null:"number"==typeof t&&Number.isFinite(t)?t:null}export function pointX(t,e,n){return toNumber(t.x??n?.[e]??e)}export function categoryExtent(t,e){let n=1/0,r=-1/0,o=!1;return t.forEach(t=>{t.forEach((t,a)=>{if(null===t.value)return;const i=pointX(t,a,e);null!==i&&(o=!0,n=Math.min(n,i),r=Math.max(r,i))})}),o?{min:n,max:r}:null}export function bubbleRadius(t,e,n,r){return e>0&&Number.isFinite(t)&&!(t<=0)?Math.max(r,Math.sqrt(Math.min(t,e)/e)*n):0===t?0:r}export function categoryCount(t){return t.reduce((t,e)=>Math.max(t,e.data.length),0)}export function categoryAt(t,e,n){if(e&&t<e.length)return e[t];for(const e of n){const n=e[t]?.x;if(void 0!==n)return n}return t}export function extentOf(t,e){let n=1/0,r=-1/0,o=!1;if(e){const e=t.reduce((t,e)=>Math.max(t,e.length),0);for(let a=0;a<e;a++){let e=0,i=0;for(const n of t){const t=n[a]?.value;null!=t&&(o=!0,t>=0?e+=t:i+=t)}n=Math.min(n,i),r=Math.max(r,e)}}else for(const e of t)for(const{value:t}of e)null!==t&&(o=!0,n=Math.min(n,t),r=Math.max(r,t));return o?{min:n,max:r}:null}function i(t){const e=10**Math.floor(Math.log10(t)),n=t/e;return n<=1?e:n<=2?2*e:n<=5?5*e:10*e}export function valueScale(t,e={}){const{tickCount:n=5,includeZero:r=!0}=e;let o=e.min??(t?t.min:0),a=e.max??(t?t.max:1);r&&void 0===e.min&&(o=Math.min(o,0)),r&&void 0===e.max&&(a=Math.max(a,0));const u=void 0!==e.min&&void 0===e.max,s=void 0!==e.max&&void 0===e.min;if(a<=o&&(u||s)){const t=u?o:a,e=Math.abs(t)>0?Math.abs(t):2;u?a=o+e:o=a-e}else if(a===o){const t=Math.abs(a)>0?.5*Math.abs(a):1;o-=t,a+=t}const c=void 0!==e.min&&void 0!==e.max?function(t,e){const n=10**Math.floor(Math.log10(t/Math.max(1,e)));let r=i(t/Math.max(1,e)),o=1/0;for(const a of[.1,1,10])for(const i of[1,2,2.5,5]){const u=i*a*n,s=t/u,c=Math.round(s);if(c<1||Math.abs(s-c)>1e-9)continue;const l=Math.abs(c-e);l<o&&(o=l,r=u)}return r}(a-o,n):i((a-o)/Math.max(1,n)),l=void 0!==e.min?o:Math.floor(o/c)*c,h=void 0!==e.max?a:Math.ceil(a/c)*c,m=h-l||1,f=[];for(let t=l;t<=h+1e-9*c;t+=c)f.push(Number(t.toFixed(12)));return{min:l,max:h,ticks:f,fraction:t=>(t-l)/m}}const u=1e3,s=6e4,c=36e5,l=24*c,h=[{unit:"second",count:1,size:u},{unit:"second",count:5,size:5e3},{unit:"second",count:15,size:15e3},{unit:"second",count:30,size:3e4},{unit:"minute",count:1,size:s},{unit:"minute",count:5,size:3e5},{unit:"minute",count:15,size:9e5},{unit:"minute",count:30,size:18e5},{unit:"hour",count:1,size:c},{unit:"hour",count:3,size:3*c},{unit:"hour",count:6,size:6*c},{unit:"hour",count:12,size:12*c},{unit:"day",count:1,size:l},{unit:"day",count:2,size:2*l},{unit:"week",count:1,size:7*l},{unit:"week",count:2,size:14*l},{unit:"month",count:1,size:30*l},{unit:"quarter",count:1,size:91*l},{unit:"month",count:6,size:182*l},{unit:"year",count:1,size:365*l}];function m(t,e,n){const r=new Date(t);if("year"===e)r.setFullYear(r.getFullYear()+n);else if("quarter"===e)r.setMonth(r.getMonth()+3*n);else if("month"===e)r.setMonth(r.getMonth()+n);else if("week"===e)r.setDate(r.getDate()+7*n);else if("day"===e)r.setDate(r.getDate()+n);else{if("hour"!==e)return t+n*("minute"===e?s:u);r.setHours(r.getHours()+n)}return r.getTime()}const f={second:"minute",minute:"hour",hour:"day",day:"month",week:"week",month:"year",quarter:"year",year:"year"};function $(t,e,n){let r=function(t,e){const n=new Date(t);if("year"===e)return new Date(n.getFullYear(),0,1).getTime();if("quarter"===e)return new Date(n.getFullYear(),3*Math.floor(n.getMonth()/3),1).getTime();if("month"===e)return new Date(n.getFullYear(),n.getMonth(),1).getTime();if("week"===e){const t=new Date(n.getFullYear(),n.getMonth(),n.getDate());return t.setDate(t.getDate()-t.getDay()),t.getTime()}return"day"===e?new Date(n.getFullYear(),n.getMonth(),n.getDate()).getTime():"hour"===e?new Date(n.getFullYear(),n.getMonth(),n.getDate(),n.getHours()).getTime():"minute"===e?Math.floor(t/s)*s:Math.floor(t/u)*u}(t,f[e]);if("year"===e&&n>1){const t=new Date(r).getFullYear();r=new Date(t-(t%n+n)%n,0,1).getTime()}for(let o=0;o<500;o++){const o=m(r,e,n);if(o>t)return r;r=o}return r}export function timeScale(t,e={}){const{tickCount:n=6}=e;let r=e.min??t?.min??Date.parse("2000-01-01T00:00:00"),o=e.max??t?.max??r+l;o<=r&&(r-=l/2,o+=l/2);const a=o-r;let u=h[0],s=1/0;for(const t of h){const e=Math.abs(a/t.size-n);e<s&&(s=e,u=t)}const c=u.unit,f="year"===c?Math.max(1,Math.round(i(a/n/(365*l)))):u.count,x=e.min??$(r,c,f),p=[];let M=$(r,c,f);for(let t=0;t<500&&(p.push(M),!(M>o));t++)M=m(M,c,f);const d=e.max??p[p.length-1],g=d-x||1;return{min:x,max:d,ticks:p.filter(t=>t>=x&&t<=d),unit:c,step:f,fraction:t=>(t-x)/g}}function x(t,e){if("second"===t)return{hour:"2-digit",minute:"2-digit",second:"2-digit",hourCycle:"h23"};if("minute"===t||"hour"===t)return{hour:"2-digit",minute:"2-digit",hourCycle:"h23"};if("year"===t)return{year:"numeric"};const n="month"===t||"quarter"===t?{month:"short"}:{month:"short",day:"numeric"};return e?{...n,year:"numeric"}:n}export function formatTimeValue(t,e,r,o=!1){const a=x(e,!0);return n(r,o&&void 0===a.hour?{...a,hour:"2-digit",minute:"2-digit",hourCycle:"h23"}:a).format(new Date(t))}export function formatTimeTicks(t,e,r){const o=new Set(t.map(t=>new Date(t).getFullYear())).size>1;return t.map((t,a)=>n(r,x(e,o||0===a)).format(new Date(t)))}export function tickStride(t,e,n){if(t<=1||e<=0)return 1;const r=Math.max(1,Math.floor(e/Math.max(1,n)));return Math.max(1,Math.ceil(t/r))}export function showsTick(t,e,n,r){return t%n===0||r&&t===e-1}export function fitsLast(t,e,n,r){const o=(t-1)%e;return o>0&&o*n>=r+8}export function textWidth(t,e){let n=0;for(const e of t)n+=/[ᄀ-ᇿ⺀-가-豈-︰-﹏]/.test(e)?1:.6;return n*e}export function turnedAxis(t,e){const n=Math.max(-90,Math.min(90,t??0)),r=Math.abs(n)*(Math.PI/180),o=Math.sin(r),a=Math.cos(r);return 0===n?{angle:0,depth:()=>e,room:t=>Math.max(t,1)+12,cut:t=>t,offset:e+6,overhang:t=>t/2,anchor:"middle"}:{angle:n,depth:t=>t*o+e*a,room:()=>e/Math.max(.2,o)+4,cut:t=>Math.max(0,(t-e*a)/Math.max(.05,o)),offset:8+e/2*a,overhang:t=>t*a,anchor:n<0?"end":"start"}}export function truncate(t,e,n){if(e<=0||textWidth(t,n)<=e)return t;const r=e-textWidth("…",n);let o="",a=0;for(const e of t){const t=a+textWidth(e,n);if(t>r)break;a=t,o+=e}return o.length>0?`${o.trimEnd()}…`:"…"}export function bandScale(t,e,n){const r=t>0?e/t:e;return{step:r,band:r*n,centre:t=>r*(t+.5)}}export function linePath(t,e){const n=[];let r=[];const o=()=>{if(0!==r.length){if(1===r.length)n.push(`M${r[0].x} ${r[0].y}h0`);else if("step"===e){n.push(`M${r[0].x} ${r[0].y}`);for(let t=1;t<r.length;t++){const e=(r[t-1].x+r[t].x)/2;n.push(`H${e}V${r[t].y}H${r[t].x}`)}}else if("smooth"===e)n.push(`M${r[0].x} ${r[0].y}`),n.push(function(t){const e=t.length,n=[];for(let r=0;r<e-1;r++){const e=t[r+1].x-t[r].x;n.push(0===e?0:(t[r+1].y-t[r].y)/e)}const r=[n[0]??0];for(let t=1;t<e-1;t++){const e=n[t-1],o=n[t];r.push(e*o<=0?0:2*e*o/(e+o))}r.push(n[e-2]??0);const o=[];for(let n=0;n<e-1;n++){const e=(t[n+1].x-t[n].x)/3;o.push(`C${t[n].x+e} ${t[n].y+r[n]*e} ${t[n+1].x-e} ${t[n+1].y-r[n+1]*e} ${t[n+1].x} ${t[n+1].y}`)}return o.join("")}(r));else{n.push(`M${r[0].x} ${r[0].y}`);for(let t=1;t<r.length;t++)n.push(`L${r[t].x} ${r[t].y}`)}r=[]}};for(const e of t)null===e?o():r.push(e);return o(),n.join("")}export function areaPath(t,e,n){const r=[];let o=0;const a=a=>{const i=t.slice(o,a).filter(Boolean);if(0===i.length)return;const u="number"==typeof e?i.map(t=>({x:t.x,y:e})).reverse():e.slice(o,a).filter(Boolean).reverse();if(0===u.length)return;const s=linePath(i,n),c=linePath(u,n).replace(/^M/,"L");r.push(`${s}${c}Z`)};for(let e=0;e<t.length;e++)null===t[e]&&(a(e),o=e+1);return a(t.length),r.join("")}export function barPath(t,e,n,r,o,a){const i=Math.max(0,Math.min(o,n/2,r/2));if(0===i||n<=0||r<=0)return`M${t} ${e}h${n}v${r}h${-n}Z`;const u=(t,e)=>`a${i} ${i} 0 0 1 ${t} ${e}`;return"up"===a?`M${t} ${e+r}V${e+i}${u(i,-i)}H${t+n-i}${u(i,i)}V${e+r}Z`:"down"===a?`M${t} ${e}H${t+n}V${e+r-i}${u(-i,i)}H${t+i}${u(-i,-i)}Z`:"right"===a?`M${t} ${e}H${t+n-i}${u(i,i)}V${e+r-i}${u(-i,i)}H${t}Z`:`M${t+n} ${e+r}H${t+i}${u(-i,-i)}V${e+i}${u(i,-i)}H${t+n}Z`}export const markShapes=["circle","square","triangle","diamond","cross"];const p={circle:1,square:.8862,triangle:1.5551,diamond:1.2533,cross:1.189};export function markPath(t,e,n,r){const o=Math.max(0,r)*p[t];if(0===o)return"";if("circle"===t)return`M${e-o} ${n}a${o} ${o} 0 1 0 ${2*o} 0a${o} ${o} 0 1 0 ${2*-o} 0Z`;if("square"===t)return`M${e-o} ${n-o}h${2*o}v${2*o}h${2*-o}Z`;if("diamond"===t)return`M${e} ${n-o}L${e+o} ${n}L${e} ${n+o}L${e-o} ${n}Z`;if("triangle"===t){return`M${[0,120,240].map(t=>{const r=(t-90)*Math.PI/180;return`${e+o*Math.cos(r)} ${n+o*Math.sin(r)}`}).join("L")}Z`}const a=o/3;return`M${e-a} ${n-o}h${2*a}v${o-a}h${o-a}v${2*a}h${-(o-a)}v${o-a}h${2*-a}v${-(o-a)}h${-(o-a)}v${2*-a}h${o-a}Z`}export function ringPath(t,e,n,r,o){const a=r=>{const o=(r-90)*Math.PI/180;return`${t+n*Math.cos(o)} ${e+n*Math.sin(o)}`};if(Math.abs(o-r)>=360){const t=r+180;return`M${a(r)}A${n} ${n} 0 1 1 ${a(t)}A${n} ${n} 0 1 1 ${a(r)}`}const i=Math.abs(o-r)>180?1:0;return`M${a(r)}A${n} ${n} 0 ${i} 1 ${a(o)}`}export function arcPath(t,e,n,r,o,a){const i=(n,r)=>{const o=(r-90)*Math.PI/180;return`${t+n*Math.cos(o)} ${e+n*Math.sin(o)}`};if(Math.abs(a-o)>=360){const t=o+180;return r>0?`M${i(n,o)}A${n} ${n} 0 1 1 ${i(n,t)}A${n} ${n} 0 1 1 ${i(n,o)}ZM${i(r,o)}A${r} ${r} 0 1 0 ${i(r,t)}A${r} ${r} 0 1 0 ${i(r,o)}Z`:`M${i(n,o)}A${n} ${n} 0 1 1 ${i(n,t)}A${n} ${n} 0 1 1 ${i(n,o)}Z`}const u=Math.abs(a-o)>180?1:0;return r<=0?`M${t} ${e}L${i(n,o)}A${n} ${n} 0 ${u} 1 ${i(n,a)}Z`:`M${i(n,o)}A${n} ${n} 0 ${u} 1 ${i(n,a)}L${i(r,a)}A${r} ${r} 0 ${u} 0 ${i(r,o)}Z`}export const rampSteps=5;export function rampStep(t,e,n,r,o=0){if("diverging"===r){const r=Math.max(Math.abs(n-o),Math.abs(o-e));if(!(r>0))return 2;const a=(t-o)/r;return Math.min(4,Math.max(0,2+Math.round(2*a)))}const a=n-e;return a>0?Math.min(4,Math.max(0,Math.floor((t-e)/a*5))):t>0?4:0}export function rampFill(t,e){return`var(--neba-chart-${"diverging"===e?"div":"seq"}-${t+1})`}export function rampInk(t,e){return`var(--neba-chart-${"diverging"===e?"div":"seq"}-on-${t+1})`}export function squarify(t,e,n){const r=t.reduce((t,e)=>t+Math.max(0,e),0);if(!(r>0)||e<=0||n<=0)return[];const o=e*n/r,a=t.map((t,e)=>({index:e,area:Math.max(0,t)*o})).filter(t=>t.area>0).sort((t,e)=>e.area-t.area),i=[];let u=0,s=0,c=e,l=n,h=[];const m=t=>{const e=Math.min(c,l),n=t.reduce((t,e)=>t+e.area,0);if(!(n>0&&e>0))return 1/0;const r=t[0].area,o=t[t.length-1].area;return Math.max(e*e*r/(n*n),n*n/(e*e*o))},f=()=>{const t=h.reduce((t,e)=>t+e.area,0),e=Math.min(c,l),n=e>0?t/e:0,r=c>=l;let o=0;for(const t of h){const e=n>0?t.area/n:0;i.push(r?{index:t.index,x:u,y:s+o,width:n,height:e}:{index:t.index,x:u+o,y:s,width:e,height:n}),o+=e}r?(u+=n,c-=n):(s+=n,l-=n),h=[]};for(const t of a)0===h.length||m([...h,t])<=m(h)||f(),h.push(t);return h.length>0&&f(),i}const M={month:"short",day:"numeric"},d={notation:"compact",maximumFractionDigits:1},g={maximumFractionDigits:2};export function labelledPoints(t,e){if("all"===e)return()=>!0;if("last"===e){let e=-1;for(let n=t.length-1;n>=0;n--)if(null!==t[n].value){e=n;break}return t=>t===e}let n=1/0,r=-1/0;for(const e of t)null!==e.value&&(n=Math.min(n,e.value),r=Math.max(r,e.value));return e=>{const o=t[e].value;return null!==o&&(o===n||o===r)}}export function formatCategory(t,e){return t instanceof Date?n(e,M).format(t):String(t)}export function compactNumber(t,e){return Math.abs(t)>=1e4?r(e,d).format(t):r(e,g).format(t)}
|
|
1
|
+
import{parseColor as t,readableInk as e}from"./color.js";import{dateFormatter as n,numberFormatter as r}from"./format.js";export const plotHeights={xs:120,sm:160,md:220,lg:280,xl:360};export const sparklineHeights={xs:16,sm:20,md:28,lg:40,xl:56};export const lineWidths={xs:1.5,sm:1.75,md:2,lg:2.25,xl:2.5};export const markerRadii={xs:3,sm:3.5,md:4,lg:4.5,xl:5};export const chartFontSizes={xs:10,sm:11,md:12,lg:13,xl:14};export const barMaxThickness={xs:14,sm:18,md:24,lg:30,xl:36};export const barBandRatio={default:.62,compact:.82};export const markGap=2;export const barRadius=4;export const chartPalette=["var(--neba-chart-1)","var(--neba-chart-2)","var(--neba-chart-3)","var(--neba-chart-4)","var(--neba-chart-5)","var(--neba-chart-6)","var(--neba-chart-7)","var(--neba-chart-8)"];export function inkOn(n,r){if(!n)return`var(--neba-chart-on-${r%chartPalette.length+1})`;const a=o.has(n)?null:t(n);return a?e(a.hsv):"var(--neba-surface)"}export function labelInk(t){return`color-mix(in oklab, ${t} 85%, var(--neba-fg))`}const o=new Set(["primary","secondary","success","warning","danger","info"]);export function resolveColor(t){return o.has(t)?`var(--neba-${t}-accent)`:t}export function seriesColor(t,e,n=chartPalette){return resolveColor(t?.color?t.color:n[e%n.length]??chartPalette[0])}const a=new Set;export function warnPaletteOverflow(t){"production"===process.env.NODE_ENV||t<=chartPalette.length||a.has(t)||(a.add(t),console.warn(`Neba: a chart was given ${t} series and its palette has ${chartPalette.length} colours, so the colours repeat from the ninth series. Fold the smallest into an "Other" series, or draw a second chart.`))}export function toFullShares(t,e,n){const r=[];return t.forEach((t,n)=>{!1!==e[n]&&t.forEach((t,e)=>{r[e]=(r[e]??0)+Math.abs(t.value??0)})}),t.map(t=>t.map((t,e)=>{if(null===t.value)return t;const o=r[e]??0;return{...t,value:0===o?0:t.value/o*100,label:t.label??n(t.value)}}))}export function toValue(t){return null==t?{value:null}:"number"==typeof t?{value:Number.isFinite(t)?t:null}:(t=>"object"==typeof t&&null!==t)(t)?{value:null!==t.y&&Number.isFinite(t.y)?t.y:null,x:t.x,z:t.z,color:t.color?resolveColor(t.color):void 0,label:t.label}:{value:null}}export function toValues(t){return t.map(t=>t.data.map(toValue))}export function zeroGaps(t){return t.map(t=>({...t,data:t.data.map(t=>null==t?0:"number"==typeof t?Number.isFinite(t)?t:0:null!==t.y&&Number.isFinite(t.y)?t:{...t,y:0})}))}export function toNumber(t){return t instanceof Date?Number.isFinite(t.getTime())?t.getTime():null:"number"==typeof t&&Number.isFinite(t)?t:null}export function pointX(t,e,n){return toNumber(t.x??n?.[e]??e)}export function categoryExtent(t,e){let n=1/0,r=-1/0,o=!1;return t.forEach(t=>{t.forEach((t,a)=>{if(null===t.value)return;const i=pointX(t,a,e);null!==i&&(o=!0,n=Math.min(n,i),r=Math.max(r,i))})}),o?{min:n,max:r}:null}export function bubbleRadius(t,e,n,r){return e>0&&Number.isFinite(t)&&!(t<=0)?Math.max(r,Math.sqrt(Math.min(t,e)/e)*n):0===t?0:r}export function categoryCount(t){return t.reduce((t,e)=>Math.max(t,e.data.length),0)}export function categoryAt(t,e,n){if(e&&t<e.length)return e[t];for(const e of n){const n=e[t]?.x;if(void 0!==n)return n}return t}export function extentOf(t,e){let n=1/0,r=-1/0,o=!1;if(e){const e=t.reduce((t,e)=>Math.max(t,e.length),0);for(let a=0;a<e;a++){let e=0,i=0;for(const n of t){const t=n[a]?.value;null!=t&&(o=!0,t>=0?e+=t:i+=t)}n=Math.min(n,i),r=Math.max(r,e)}}else for(const e of t)for(const{value:t}of e)null!==t&&(o=!0,n=Math.min(n,t),r=Math.max(r,t));return o?{min:n,max:r}:null}function i(t){const e=10**Math.floor(Math.log10(t)),n=t/e;return n<=1?e:n<=2?2*e:n<=5?5*e:10*e}export function valueScale(t,e={}){const{tickCount:n=5}=e,{low:r,high:o}=u(t,e),a=void 0!==e.min&&void 0!==e.max?function(t,e){const n=10**Math.floor(Math.log10(t/Math.max(1,e)));let r=i(t/Math.max(1,e)),o=1/0;for(const a of[.1,1,10])for(const i of[1,2,2.5,5]){const u=i*a*n,s=t/u,c=Math.round(s);if(c<1||Math.abs(s-c)>1e-9)continue;const l=Math.abs(c-e);l<o&&(o=l,r=u)}return r}(o-r,n):i((o-r)/Math.max(1,n)),s=void 0!==e.min?r:Number((Math.floor(r/a+1e-9)*a).toFixed(12)),c=void 0!==e.max?o:Number((Math.ceil(o/a-1e-9)*a).toFixed(12)),l=c-s||1,h=[];for(let t=s;t<=c+1e-9*a;t+=a)h.push(Number(t.toFixed(12)));return{min:s,max:c,ticks:h,fraction:t=>(t-s)/l}}export function alignedScale(t,e,n={}){const r=Math.max(1,Math.round(e)),{low:o,high:a}=u(t,n);let s,c=i((a-o)/r);if(void 0!==n.min&&void 0!==n.max)c=(a-o)/r,s=o;else if(void 0!==n.max)s=a-r*c;else if(void 0!==n.min)s=o;else for(s=Math.floor(o/c+1e-9)*c;s+r*c<a-1e-9*c;)c=i(1.000001*c),s=Math.floor(o/c+1e-9)*c;const l=Array.from({length:r+1},(t,e)=>Number((s+e*c).toFixed(12))),h=l[0],m=l[r]-h||1;return{min:h,max:l[r],ticks:l,fraction:t=>(t-h)/m}}function u(t,e){const{includeZero:n=!0}=e;let r=e.min??(t?t.min:0),o=e.max??(t?t.max:1);n&&void 0===e.min&&(r=Math.min(r,0)),n&&void 0===e.max&&(o=Math.max(o,0));const a=void 0!==e.min&&void 0===e.max,i=void 0!==e.max&&void 0===e.min;if(o<=r&&(a||i)){const t=a?r:o,e=Math.abs(t)>0?Math.abs(t):2;a?o=r+e:r=o-e}else if(o===r){const t=Math.abs(o)>0?.5*Math.abs(o):1;r-=t,o+=t}return{low:r,high:o}}const s=1e3,c=6e4,l=36e5,h=24*l,m=[{unit:"second",count:1,size:s},{unit:"second",count:5,size:5e3},{unit:"second",count:15,size:15e3},{unit:"second",count:30,size:3e4},{unit:"minute",count:1,size:c},{unit:"minute",count:5,size:3e5},{unit:"minute",count:15,size:9e5},{unit:"minute",count:30,size:18e5},{unit:"hour",count:1,size:l},{unit:"hour",count:3,size:3*l},{unit:"hour",count:6,size:6*l},{unit:"hour",count:12,size:12*l},{unit:"day",count:1,size:h},{unit:"day",count:2,size:2*h},{unit:"week",count:1,size:7*h},{unit:"week",count:2,size:14*h},{unit:"month",count:1,size:30*h},{unit:"quarter",count:1,size:91*h},{unit:"month",count:6,size:182*h},{unit:"year",count:1,size:365*h}];function f(t,e,n){const r=new Date(t);if("year"===e)r.setFullYear(r.getFullYear()+n);else if("quarter"===e)r.setMonth(r.getMonth()+3*n);else if("month"===e)r.setMonth(r.getMonth()+n);else if("week"===e)r.setDate(r.getDate()+7*n);else if("day"===e)r.setDate(r.getDate()+n);else{if("hour"!==e)return t+n*("minute"===e?c:s);r.setHours(r.getHours()+n)}return r.getTime()}const $={second:"minute",minute:"hour",hour:"day",day:"month",week:"week",month:"year",quarter:"year",year:"year"};function x(t,e,n){let r=function(t,e){const n=new Date(t);if("year"===e)return new Date(n.getFullYear(),0,1).getTime();if("quarter"===e)return new Date(n.getFullYear(),3*Math.floor(n.getMonth()/3),1).getTime();if("month"===e)return new Date(n.getFullYear(),n.getMonth(),1).getTime();if("week"===e){const t=new Date(n.getFullYear(),n.getMonth(),n.getDate());return t.setDate(t.getDate()-t.getDay()),t.getTime()}return"day"===e?new Date(n.getFullYear(),n.getMonth(),n.getDate()).getTime():"hour"===e?new Date(n.getFullYear(),n.getMonth(),n.getDate(),n.getHours()).getTime():"minute"===e?Math.floor(t/c)*c:Math.floor(t/s)*s}(t,$[e]);if("year"===e&&n>1){const t=new Date(r).getFullYear();r=new Date(t-(t%n+n)%n,0,1).getTime()}for(let o=0;o<500;o++){const o=f(r,e,n);if(o>t)return r;r=o}return r}export function timeScale(t,e={}){const{tickCount:n=6}=e;let r=e.min??t?.min??Date.parse("2000-01-01T00:00:00"),o=e.max??t?.max??r+h;o<=r&&(r-=h/2,o+=h/2);const a=o-r;let u=m[0],s=1/0;for(const t of m){const e=Math.abs(a/t.size-n);e<s&&(s=e,u=t)}const c=u.unit,l="year"===c?Math.max(1,Math.round(i(a/n/(365*h)))):u.count,$=e.min??x(r,c,l),M=[];let p=x(r,c,l);for(let t=0;t<500&&(M.push(p),!(p>o));t++)p=f(p,c,l);const d=e.max??M[M.length-1],g=d-$||1;return{min:$,max:d,ticks:M.filter(t=>t>=$&&t<=d),unit:c,step:l,fraction:t=>(t-$)/g}}function M(t,e){if("second"===t)return{hour:"2-digit",minute:"2-digit",second:"2-digit",hourCycle:"h23"};if("minute"===t||"hour"===t)return{hour:"2-digit",minute:"2-digit",hourCycle:"h23"};if("year"===t)return{year:"numeric"};const n="month"===t||"quarter"===t?{month:"short"}:{month:"short",day:"numeric"};return e?{...n,year:"numeric"}:n}export function formatTimeValue(t,e,r,o=!1){const a=M(e,!0);return n(r,o&&void 0===a.hour?{...a,hour:"2-digit",minute:"2-digit",hourCycle:"h23"}:a).format(new Date(t))}export function formatTimeTicks(t,e,r){const o=new Set(t.map(t=>new Date(t).getFullYear())).size>1;return t.map((t,a)=>n(r,M(e,o||0===a)).format(new Date(t)))}export function tickStride(t,e,n){if(t<=1||e<=0)return 1;const r=Math.max(1,Math.floor(e/Math.max(1,n)));return Math.max(1,Math.ceil(t/r))}export function showsTick(t,e,n,r){return t%n===0||r&&t===e-1}export function fitsLast(t,e,n,r){const o=(t-1)%e;return o>0&&o*n>=r+8}export function textWidth(t,e){let n=0;for(const e of t)n+=/[ᄀ-ᇿ⺀-가-豈-︰-﹏]/.test(e)?1:.6;return n*e}export function turnedAxis(t,e){const n=Math.max(-90,Math.min(90,t??0)),r=Math.abs(n)*(Math.PI/180),o=Math.sin(r),a=Math.cos(r);return 0===n?{angle:0,depth:()=>e,room:t=>Math.max(t,1)+12,cut:t=>t,offset:e+6,overhang:t=>t/2,anchor:"middle"}:{angle:n,depth:t=>t*o+e*a,room:()=>e/Math.max(.2,o)+4,cut:t=>Math.max(0,(t-e*a)/Math.max(.05,o)),offset:8+e/2*a,overhang:t=>t*a,anchor:n<0?"end":"start"}}export function truncate(t,e,n){if(e<=0||textWidth(t,n)<=e)return t;const r=e-textWidth("…",n);let o="",a=0;for(const e of t){const t=a+textWidth(e,n);if(t>r)break;a=t,o+=e}return o.length>0?`${o.trimEnd()}…`:"…"}export function bandScale(t,e,n){const r=t>0?e/t:e;return{step:r,band:r*n,centre:t=>r*(t+.5)}}export function linePath(t,e){const n=[];let r=[];const o=()=>{if(0!==r.length){if(1===r.length)n.push(`M${r[0].x} ${r[0].y}h0`);else if("step"===e){n.push(`M${r[0].x} ${r[0].y}`);for(let t=1;t<r.length;t++){const e=(r[t-1].x+r[t].x)/2;n.push(`H${e}V${r[t].y}H${r[t].x}`)}}else if("smooth"===e)n.push(`M${r[0].x} ${r[0].y}`),n.push(function(t){const e=t.length,n=[];for(let r=0;r<e-1;r++){const e=t[r+1].x-t[r].x;n.push(0===e?0:(t[r+1].y-t[r].y)/e)}const r=[n[0]??0];for(let t=1;t<e-1;t++){const e=n[t-1],o=n[t];r.push(e*o<=0?0:2*e*o/(e+o))}r.push(n[e-2]??0);const o=[];for(let n=0;n<e-1;n++){const e=(t[n+1].x-t[n].x)/3;o.push(`C${t[n].x+e} ${t[n].y+r[n]*e} ${t[n+1].x-e} ${t[n+1].y-r[n+1]*e} ${t[n+1].x} ${t[n+1].y}`)}return o.join("")}(r));else{n.push(`M${r[0].x} ${r[0].y}`);for(let t=1;t<r.length;t++)n.push(`L${r[t].x} ${r[t].y}`)}r=[]}};for(const e of t)null===e?o():r.push(e);return o(),n.join("")}export function areaPath(t,e,n){const r=[];let o=0;const a=a=>{const i=t.slice(o,a).filter(Boolean);if(0===i.length)return;const u="number"==typeof e?i.map(t=>({x:t.x,y:e})).reverse():e.slice(o,a).filter(Boolean).reverse();if(0===u.length)return;const s=linePath(i,n),c=linePath(u,n).replace(/^M/,"L");r.push(`${s}${c}Z`)};for(let e=0;e<t.length;e++)null===t[e]&&(a(e),o=e+1);return a(t.length),r.join("")}export function barPath(t,e,n,r,o,a){const i=Math.max(0,Math.min(o,n/2,r/2));if(0===i||n<=0||r<=0)return`M${t} ${e}h${n}v${r}h${-n}Z`;const u=(t,e)=>`a${i} ${i} 0 0 1 ${t} ${e}`;return"up"===a?`M${t} ${e+r}V${e+i}${u(i,-i)}H${t+n-i}${u(i,i)}V${e+r}Z`:"down"===a?`M${t} ${e}H${t+n}V${e+r-i}${u(-i,i)}H${t+i}${u(-i,-i)}Z`:"right"===a?`M${t} ${e}H${t+n-i}${u(i,i)}V${e+r-i}${u(-i,i)}H${t}Z`:`M${t+n} ${e+r}H${t+i}${u(-i,-i)}V${e+i}${u(i,-i)}H${t+n}Z`}export const markShapes=["circle","square","triangle","diamond","cross"];const p={circle:1,square:.8862,triangle:1.5551,diamond:1.2533,cross:1.189};export function markPath(t,e,n,r){const o=Math.max(0,r)*p[t];if(0===o)return"";if("circle"===t)return`M${e-o} ${n}a${o} ${o} 0 1 0 ${2*o} 0a${o} ${o} 0 1 0 ${2*-o} 0Z`;if("square"===t)return`M${e-o} ${n-o}h${2*o}v${2*o}h${2*-o}Z`;if("diamond"===t)return`M${e} ${n-o}L${e+o} ${n}L${e} ${n+o}L${e-o} ${n}Z`;if("triangle"===t){return`M${[0,120,240].map(t=>{const r=(t-90)*Math.PI/180;return`${e+o*Math.cos(r)} ${n+o*Math.sin(r)}`}).join("L")}Z`}const a=o/3;return`M${e-a} ${n-o}h${2*a}v${o-a}h${o-a}v${2*a}h${-(o-a)}v${o-a}h${2*-a}v${-(o-a)}h${-(o-a)}v${2*-a}h${o-a}Z`}export function ringPath(t,e,n,r,o){const a=r=>{const o=(r-90)*Math.PI/180;return`${t+n*Math.cos(o)} ${e+n*Math.sin(o)}`};if(Math.abs(o-r)>=360){const t=r+180;return`M${a(r)}A${n} ${n} 0 1 1 ${a(t)}A${n} ${n} 0 1 1 ${a(r)}`}const i=Math.abs(o-r)>180?1:0;return`M${a(r)}A${n} ${n} 0 ${i} 1 ${a(o)}`}export function arcPath(t,e,n,r,o,a){const i=(n,r)=>{const o=(r-90)*Math.PI/180;return`${t+n*Math.cos(o)} ${e+n*Math.sin(o)}`};if(Math.abs(a-o)>=360){const t=o+180;return r>0?`M${i(n,o)}A${n} ${n} 0 1 1 ${i(n,t)}A${n} ${n} 0 1 1 ${i(n,o)}ZM${i(r,o)}A${r} ${r} 0 1 0 ${i(r,t)}A${r} ${r} 0 1 0 ${i(r,o)}Z`:`M${i(n,o)}A${n} ${n} 0 1 1 ${i(n,t)}A${n} ${n} 0 1 1 ${i(n,o)}Z`}const u=Math.abs(a-o)>180?1:0;return r<=0?`M${t} ${e}L${i(n,o)}A${n} ${n} 0 ${u} 1 ${i(n,a)}Z`:`M${i(n,o)}A${n} ${n} 0 ${u} 1 ${i(n,a)}L${i(r,a)}A${r} ${r} 0 ${u} 0 ${i(r,o)}Z`}export const rampSteps=5;export function rampStep(t,e,n,r,o=0){if("diverging"===r){const r=Math.max(Math.abs(n-o),Math.abs(o-e));if(!(r>0))return 2;const a=(t-o)/r;return Math.min(4,Math.max(0,2+Math.round(2*a)))}const a=n-e;return a>0?Math.min(4,Math.max(0,Math.floor((t-e)/a*5))):t>0?4:0}export function rampFill(t,e){return`var(--neba-chart-${"diverging"===e?"div":"seq"}-${t+1})`}export function rampInk(t,e){return`var(--neba-chart-${"diverging"===e?"div":"seq"}-on-${t+1})`}export function squarify(t,e,n){const r=t.reduce((t,e)=>t+Math.max(0,e),0);if(!(r>0)||e<=0||n<=0)return[];const o=e*n/r,a=t.map((t,e)=>({index:e,area:Math.max(0,t)*o})).filter(t=>t.area>0).sort((t,e)=>e.area-t.area),i=[];let u=0,s=0,c=e,l=n,h=[];const m=t=>{const e=Math.min(c,l),n=t.reduce((t,e)=>t+e.area,0);if(!(n>0&&e>0))return 1/0;const r=t[0].area,o=t[t.length-1].area;return Math.max(e*e*r/(n*n),n*n/(e*e*o))},f=()=>{const t=h.reduce((t,e)=>t+e.area,0),e=Math.min(c,l),n=e>0?t/e:0,r=c>=l;let o=0;for(const t of h){const e=n>0?t.area/n:0;i.push(r?{index:t.index,x:u,y:s+o,width:n,height:e}:{index:t.index,x:u+o,y:s,width:e,height:n}),o+=e}r?(u+=n,c-=n):(s+=n,l-=n),h=[]};for(const t of a)0===h.length||m([...h,t])<=m(h)||f(),h.push(t);return h.length>0&&f(),i}const d={month:"short",day:"numeric"},g={notation:"compact",maximumFractionDigits:1},v={maximumFractionDigits:2};export function labelledPoints(t,e){if("all"===e)return()=>!0;if("last"===e){let e=-1;for(let n=t.length-1;n>=0;n--)if(null!==t[n].value){e=n;break}return t=>t===e}let n=1/0,r=-1/0;for(const e of t)null!==e.value&&(n=Math.min(n,e.value),r=Math.max(r,e.value));return e=>{const o=t[e].value;return null!==o&&(o===n||o===r)}}export function formatCategory(t,e){return t instanceof Date?n(e,d).format(t):String(t)}export function compactNumber(t,e){return Math.abs(t)>=1e4?r(e,g).format(t):r(e,v).format(t)}
|
package/dist/internal/drag.d.ts
CHANGED
|
@@ -23,6 +23,21 @@
|
|
|
23
23
|
* nothing and cost a frame of latency on the one gesture where latency is the
|
|
24
24
|
* whole feel of it.
|
|
25
25
|
*/
|
|
26
|
+
/**
|
|
27
|
+
* How many screen pixels one of an element's own layout pixels is drawn as, on
|
|
28
|
+
* each axis.
|
|
29
|
+
*
|
|
30
|
+
* A pointer moves in screen pixels and an element is laid out in its own.
|
|
31
|
+
* Inside a scaled ancestor — a Mockup's screen, a zoom entrance part way
|
|
32
|
+
* through — the two differ, and a drag taken one to one moves an edge by the
|
|
33
|
+
* wrong amount: at a scale of 0.3, a third as far as the hand did. A pointer
|
|
34
|
+
* delta divided by this is a distance in the element's own pixels. An element
|
|
35
|
+
* with no box is taken as unscaled rather than divided by.
|
|
36
|
+
*/
|
|
37
|
+
export declare function drawnScale(element: HTMLElement): {
|
|
38
|
+
x: number;
|
|
39
|
+
y: number;
|
|
40
|
+
};
|
|
26
41
|
export interface PointerDragOptions {
|
|
27
42
|
/**
|
|
28
43
|
* The element the three listeners go on, and the one the pointer is captured
|
package/dist/internal/drag.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export function beginPointerDrag({target:e,pointerId:t,onMove:
|
|
1
|
+
export function drawnScale(e){const t=e.getBoundingClientRect();return{x:e.offsetWidth>0&&t.width/e.offsetWidth||1,y:e.offsetHeight>0&&t.height/e.offsetHeight||1}}export function beginPointerDrag({target:e,pointerId:t,onMove:n,onEnd:r,capture:o=!0,selectable:i=!0,mark:s=!0}){const c=i?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,a=o?e:e.ownerDocument;if(s&&(e.dataset.dragging="true"),o)try{e.setPointerCapture?.(t)}catch{}let d=!0;const u=()=>{d&&(d=!1,a.removeEventListener("pointermove",n),a.removeEventListener("pointerup",l),a.removeEventListener("pointercancel",l),s&&delete e.dataset.dragging,c?.())},l=()=>{u(),r?.()};return a.addEventListener("pointermove",n),a.addEventListener("pointerup",l),a.addEventListener("pointercancel",l),u}
|
package/dist/internal/drop.d.ts
CHANGED
|
@@ -4,9 +4,9 @@
|
|
|
4
4
|
* Two components take dropped files — a
|
|
5
5
|
* [FilePicker](../components/inputs/file-picker), and a
|
|
6
6
|
* [PromptInput](../components/agent/prompt-input) whose shell is a drop target
|
|
7
|
-
* — and both have to get the same
|
|
8
|
-
* the kind of thing that is written correctly once and approximately
|
|
9
|
-
* time.
|
|
7
|
+
* — and both have to get the same things right. None of them is hard; all of
|
|
8
|
+
* them are the kind of thing that is written correctly once and approximately
|
|
9
|
+
* the second time.
|
|
10
10
|
*/
|
|
11
11
|
import * as React from 'react';
|
|
12
12
|
/**
|
|
@@ -40,12 +40,16 @@ export interface DropZone {
|
|
|
40
40
|
/**
|
|
41
41
|
* An area that takes dropped files.
|
|
42
42
|
*
|
|
43
|
-
* `accept` is called with the files, folders already filtered out
|
|
44
|
-
* `undefined` and the zone is off: no listeners at all, and
|
|
45
|
-
* true — which is what a disabled or read-only control
|
|
46
|
-
* component with nothing to do with files wants.
|
|
43
|
+
* `accept` is called with the files, folders already filtered out, and never
|
|
44
|
+
* with none. Pass `undefined` and the zone is off: no listeners at all, and
|
|
45
|
+
* `over` never turns true — which is what a disabled or read-only control
|
|
46
|
+
* wants, and what a component with nothing to do with files wants.
|
|
47
47
|
*
|
|
48
|
-
*
|
|
48
|
+
* Three details are the whole reason this is shared rather than written twice.
|
|
49
|
+
*
|
|
50
|
+
* **Only a drag with files in it.** Every other drag is let through untouched:
|
|
51
|
+
* text dragged into a PromptInput is the field's to insert, and a zone that
|
|
52
|
+
* took it would light up, swallow the text and report no files.
|
|
49
53
|
*
|
|
50
54
|
* **The depth count.** `dragenter` and `dragleave` fire for every child the
|
|
51
55
|
* pointer crosses, so a boolean flickers the entire time a file is over a box
|
package/dist/internal/drop.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import*as e from"react";export function droppedFiles(e){const r=[...e.items],t=[...e.files];return r.length!==t.length?t:t.filter((e,t)=>{const n=r[t]?.webkitGetAsEntry?.();return!n||n.isFile})}export function useDropZone(
|
|
1
|
+
"use client";import*as e from"react";export function droppedFiles(e){const r=[...e.items],t=[...e.files];return r.length!==t.length?t:t.filter((e,t)=>{const n=r[t]?.webkitGetAsEntry?.();return!n||n.isFile})}function r(e){return[...e.dataTransfer?.types??[]].includes("Files")}export function useDropZone(t){const n=e.useRef(0),[o,s]=e.useState(!1),u=void 0!==t;return e.useEffect(()=>{if(!u)return;const e=()=>{n.current=0,s(!1)};return document.addEventListener("dragend",e,!0),document.addEventListener("drop",e,!0),()=>{document.removeEventListener("dragend",e,!0),document.removeEventListener("drop",e,!0)}},[u]),u?{over:o,handlers:{onDragEnter:e=>{r(e)&&(e.preventDefault(),n.current+=1,s(!0))},onDragOver:e=>{r(e)&&(e.preventDefault(),e.dataTransfer.dropEffect="copy")},onDragLeave:e=>{r(e)&&(n.current=Math.max(0,n.current-1),0===n.current&&s(!1))},onDrop:e=>{if(!r(e))return;e.preventDefault(),n.current=0,s(!1);const o=droppedFiles(e.dataTransfer);o.length>0&&t(o)}}}:{over:!1,handlers:{}}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const t={bash:()=>import("highlight.js/lib/languages/bash"),c:()=>import("highlight.js/lib/languages/c"),cpp:()=>import("highlight.js/lib/languages/cpp"),csharp:()=>import("highlight.js/lib/languages/csharp"),css:()=>import("highlight.js/lib/languages/css"),diff:()=>import("highlight.js/lib/languages/diff"),dockerfile:()=>import("highlight.js/lib/languages/dockerfile"),go:()=>import("highlight.js/lib/languages/go"),graphql:()=>import("highlight.js/lib/languages/graphql"),ini:()=>import("highlight.js/lib/languages/ini"),java:()=>import("highlight.js/lib/languages/java"),javascript:()=>import("highlight.js/lib/languages/javascript"),json:()=>import("highlight.js/lib/languages/json"),kotlin:()=>import("highlight.js/lib/languages/kotlin"),less:()=>import("highlight.js/lib/languages/less"),lua:()=>import("highlight.js/lib/languages/lua"),makefile:()=>import("highlight.js/lib/languages/makefile"),markdown:()=>import("highlight.js/lib/languages/markdown"),objectivec:()=>import("highlight.js/lib/languages/objectivec"),perl:()=>import("highlight.js/lib/languages/perl"),php:()=>import("highlight.js/lib/languages/php"),plaintext:()=>import("highlight.js/lib/languages/plaintext"),powershell:()=>import("highlight.js/lib/languages/powershell"),python:()=>import("highlight.js/lib/languages/python"),r:()=>import("highlight.js/lib/languages/r"),ruby:()=>import("highlight.js/lib/languages/ruby"),rust:()=>import("highlight.js/lib/languages/rust"),scss:()=>import("highlight.js/lib/languages/scss"),shell:()=>import("highlight.js/lib/languages/shell"),sql:()=>import("highlight.js/lib/languages/sql"),swift:()=>import("highlight.js/lib/languages/swift"),typescript:()=>import("highlight.js/lib/languages/typescript"),xml:()=>import("highlight.js/lib/languages/xml"),yaml:()=>import("highlight.js/lib/languages/yaml")},i={"c++":"cpp",cc:"cpp",cjs:"javascript",console:"bash",cs:"csharp",cts:"typescript",docker:"dockerfile",gql:"graphql",golang:"go",h:"cpp",hpp:"cpp",htm:"xml",html:"xml",js:"javascript",jsx:"javascript",kt:"kotlin",kts:"kotlin",md:"markdown",mdx:"markdown",mjs:"javascript",mm:"objectivec",mts:"typescript",mysql:"sql",node:"javascript",none:"plaintext",objc:"objectivec",plain:"plaintext",posh:"powershell",ps1:"powershell",psql:"sql",py:"python",rb:"ruby",rs:"rust",sh:"bash",svelte:"xml",svg:"xml",text:"plaintext",toml:"ini",ts:"typescript",tsx:"typescript",txt:"plaintext",vue:"xml",yml:"yaml",zsh:"bash"},l={dockerfile:["bash"],javascript:["xml"],markdown:["xml"],shell:["bash"],typescript:["xml"],xml:["javascript","css"]},s=new Map;export function registerLanguage(t,i){const l=t.toLowerCase();
|
|
1
|
+
const t={bash:()=>import("highlight.js/lib/languages/bash"),c:()=>import("highlight.js/lib/languages/c"),cpp:()=>import("highlight.js/lib/languages/cpp"),csharp:()=>import("highlight.js/lib/languages/csharp"),css:()=>import("highlight.js/lib/languages/css"),diff:()=>import("highlight.js/lib/languages/diff"),dockerfile:()=>import("highlight.js/lib/languages/dockerfile"),go:()=>import("highlight.js/lib/languages/go"),graphql:()=>import("highlight.js/lib/languages/graphql"),ini:()=>import("highlight.js/lib/languages/ini"),java:()=>import("highlight.js/lib/languages/java"),javascript:()=>import("highlight.js/lib/languages/javascript"),json:()=>import("highlight.js/lib/languages/json"),kotlin:()=>import("highlight.js/lib/languages/kotlin"),less:()=>import("highlight.js/lib/languages/less"),lua:()=>import("highlight.js/lib/languages/lua"),makefile:()=>import("highlight.js/lib/languages/makefile"),markdown:()=>import("highlight.js/lib/languages/markdown"),objectivec:()=>import("highlight.js/lib/languages/objectivec"),perl:()=>import("highlight.js/lib/languages/perl"),php:()=>import("highlight.js/lib/languages/php"),plaintext:()=>import("highlight.js/lib/languages/plaintext"),powershell:()=>import("highlight.js/lib/languages/powershell"),python:()=>import("highlight.js/lib/languages/python"),r:()=>import("highlight.js/lib/languages/r"),ruby:()=>import("highlight.js/lib/languages/ruby"),rust:()=>import("highlight.js/lib/languages/rust"),scss:()=>import("highlight.js/lib/languages/scss"),shell:()=>import("highlight.js/lib/languages/shell"),sql:()=>import("highlight.js/lib/languages/sql"),swift:()=>import("highlight.js/lib/languages/swift"),typescript:()=>import("highlight.js/lib/languages/typescript"),xml:()=>import("highlight.js/lib/languages/xml"),yaml:()=>import("highlight.js/lib/languages/yaml")},i={"c++":"cpp",cc:"cpp",cjs:"javascript",console:"bash",cs:"csharp",cts:"typescript",docker:"dockerfile",gql:"graphql",golang:"go",h:"cpp",hpp:"cpp",htm:"xml",html:"xml",js:"javascript",jsx:"javascript",kt:"kotlin",kts:"kotlin",md:"markdown",mdx:"markdown",mjs:"javascript",mm:"objectivec",mts:"typescript",mysql:"sql",node:"javascript",none:"plaintext",objc:"objectivec",plain:"plaintext",posh:"powershell",ps1:"powershell",psql:"sql",py:"python",rb:"ruby",rs:"rust",sh:"bash",svelte:"xml",svg:"xml",text:"plaintext",toml:"ini",ts:"typescript",tsx:"typescript",txt:"plaintext",vue:"xml",yml:"yaml",zsh:"bash"},l={dockerfile:["bash"],javascript:["xml"],markdown:["xml"],shell:["bash"],typescript:["xml"],xml:["javascript","css"]},s=[["css`","css"],["gql`","graphql"]],a=new Map;export function registerLanguage(t,i){const l=t.toLowerCase();a.set(l,i),e.delete(l)}let g=null;const e=new Map;export function canonicalLanguage(t){if(!t)return null;const l=t.trim().toLowerCase();return l?a.has(l)?l:i[l]??l:null}function h(i){let s=e.get(i);return s||(s=async function(i){const s=a.get(i),e=s||!Object.hasOwn(t,i)?void 0:t[i];if(!s&&!e)return null;g??=import("highlight.js/lib/core").then(t=>t.default).catch(t=>{throw g=null,t});const h=await g;s?h.registerLanguage(i,s):h.getLanguage(i)||h.registerLanguage(i,(await e()).default);const n=Object.hasOwn(l,i)?l[i]:[];return await Promise.all(n.map(async i=>{if(h.getLanguage(i))return;const l=a.get(i);h.registerLanguage(i,l??(await t[i]()).default)})),i}(i).catch(t=>{throw e.delete(i),t}),e.set(i,s)),s}export async function highlight(i,l){if(!a.has(l)&&!Object.hasOwn(t,l))return null;const e=await h(l);if(!e||!g)return null;"javascript"!==e&&"typescript"!==e||await Promise.all(s.filter(([t])=>i.includes(t)).map(([,t])=>h(t).catch(()=>null)));return tokenize((await g).highlight(i,{language:e,ignoreIllegals:!0}).value)}const n={"&":"&","<":"<",">":">",""":'"',"'":"'"};export function tokenize(t){const i=[[]],l=[],s=/<span class="([^"]*)">|<\/span>/g;let a=0;const g=t=>{if(!t)return;const s=l[l.length-1];t.replace(/&(?:amp|lt|gt|quot|#x27);/g,t=>n[t]).split("\n").forEach((t,l)=>{l>0&&i.push([]),t&&i[i.length-1].push(s?{text:t,token:s}:{text:t})})};for(const i of t.matchAll(s))g(t.slice(a,i.index)),a=i.index+i[0].length,void 0===i[1]?l.pop():l.push(i[1]);return g(t.slice(a)),i}export function plainLines(t){return t.split("\n").map(t=>t?[{text:t}]:[])}
|