neba 1.17.1 → 1.18.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/dist/a2ui/adapter-catalog.json +1 -1
- package/dist/a2ui/catalog.json +2 -2
- package/dist/a2ui/index.d.ts +2 -0
- package/dist/a2ui/schema.d.ts +11 -1
- package/dist/a2ui/schema.js +1 -1
- package/dist/components/alert/Alert.js +1 -1
- package/dist/components/animate-counter/AnimateCounter.d.ts +6 -0
- package/dist/components/animate-counter/AnimateCounter.js +1 -1
- package/dist/components/animate-headline/AnimateHeadline.js +1 -1
- package/dist/components/animate-scramble/AnimateScramble.d.ts +9 -3
- package/dist/components/animate-scramble/AnimateScramble.js +1 -1
- package/dist/components/animate-split/AnimateSplit.d.ts +7 -1
- package/dist/components/animate-split/AnimateSplit.js +1 -1
- package/dist/components/animate-typing/AnimateTyping.d.ts +6 -0
- 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/breadcrumb/Breadcrumb.d.ts +16 -0
- package/dist/components/breadcrumb/Breadcrumb.js +1 -1
- package/dist/components/calendar/Calendar.js +1 -1
- package/dist/components/card/Card.js +1 -1
- package/dist/components/carousel/Carousel.d.ts +3 -2
- package/dist/components/carousel/Carousel.js +1 -1
- package/dist/components/chat-bubble/ChatBubble.d.ts +6 -0
- package/dist/components/chat-bubble/ChatBubble.js +1 -1
- package/dist/components/checkbox/Checkbox.js +1 -1
- package/dist/components/checkbox-group/CheckboxGroup.d.ts +84 -0
- package/dist/components/checkbox-group/CheckboxGroup.js +1 -0
- package/dist/components/checkbox-group/index.d.ts +2 -0
- package/dist/components/checkbox-group/index.js +1 -0
- package/dist/components/code-block/CodeBlock.d.ts +2 -2
- package/dist/components/code-block/CodeBlock.js +1 -1
- package/dist/components/code-block/index.d.ts +2 -1
- package/dist/components/code-block/index.js +1 -1
- package/dist/components/color-picker/ColorPicker.js +1 -1
- package/dist/components/combobox/Combobox.js +1 -1
- package/dist/components/context-window/ContextWindow.js +1 -1
- package/dist/components/data-table/DataTable.d.ts +13 -1
- package/dist/components/data-table/DataTable.js +1 -1
- package/dist/components/date-picker/DatePicker.js +1 -1
- package/dist/components/date-range-picker/DateRangePicker.js +1 -1
- package/dist/components/date-time-picker/DateTimePicker.js +1 -1
- package/dist/components/drawer/Drawer.d.ts +21 -0
- package/dist/components/drawer/Drawer.js +1 -1
- package/dist/components/empty/Empty.js +1 -1
- package/dist/components/fieldset/Fieldset.d.ts +12 -1
- package/dist/components/fieldset/Fieldset.js +1 -1
- package/dist/components/file-picker/FilePicker.d.ts +0 -8
- package/dist/components/file-picker/FilePicker.js +1 -1
- package/dist/components/file-picker/formatFileSize.d.ts +8 -0
- package/dist/components/file-picker/formatFileSize.js +1 -0
- package/dist/components/file-picker/index.d.ts +2 -1
- package/dist/components/file-picker/index.js +1 -1
- package/dist/components/floating-bottom-navigation/FloatingBottomNavigation.js +1 -1
- package/dist/components/form/Form.d.ts +8 -2
- package/dist/components/form/Form.js +1 -1
- package/dist/components/gallery/Gallery.d.ts +45 -3
- package/dist/components/gallery/Gallery.js +1 -1
- package/dist/components/gallery/GalleryViewer.js +1 -1
- package/dist/components/gauge-chart/GaugeChart.js +1 -1
- package/dist/components/heatmap-chart/HeatmapChart.js +1 -1
- package/dist/components/how-to-steps/HowToSteps.d.ts +14 -0
- package/dist/components/how-to-steps/HowToSteps.js +1 -1
- package/dist/components/image/Image.d.ts +31 -6
- package/dist/components/image/Image.js +1 -1
- package/dist/components/list/List.d.ts +9 -0
- package/dist/components/list/List.js +1 -1
- package/dist/components/menu/Menu.d.ts +17 -0
- package/dist/components/menu/Menu.js +1 -1
- package/dist/components/meter/Meter.js +1 -1
- package/dist/components/mockup/Mockup.js +1 -1
- package/dist/components/number-field/NumberField.js +1 -1
- package/dist/components/page-layout/PageLayout.js +1 -1
- 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/progress-box/ProgressBox.js +1 -1
- package/dist/components/progress-circular/ProgressCircular.js +1 -1
- package/dist/components/progress-linear/ProgressLinear.js +1 -1
- package/dist/components/prompt-input/PromptInput.js +1 -1
- package/dist/components/provider/NebaProvider.d.ts +3 -22
- package/dist/components/provider/NebaProvider.js +1 -1
- package/dist/components/provider/colorSchemeScript.d.ts +23 -0
- package/dist/components/provider/colorSchemeScript.js +1 -0
- package/dist/components/provider/index.d.ts +2 -1
- package/dist/components/provider/index.js +1 -1
- package/dist/components/radio-group/RadioGroup.d.ts +13 -0
- package/dist/components/radio-group/RadioGroup.js +1 -1
- package/dist/components/reasoning/Reasoning.d.ts +21 -0
- package/dist/components/reasoning/Reasoning.js +1 -1
- package/dist/components/scatter-chart/ScatterChart.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.js +1 -1
- package/dist/components/sidebar/Sidebar.d.ts +13 -0
- package/dist/components/sidebar/Sidebar.js +1 -1
- package/dist/components/slider/Slider.js +1 -1
- package/dist/components/sources/Sources.d.ts +11 -0
- package/dist/components/sources/Sources.js +1 -1
- package/dist/components/spoiler/Spoiler.js +1 -1
- package/dist/components/statistic/Statistic.js +1 -1
- package/dist/components/streaming-text/StreamingText.d.ts +22 -11
- package/dist/components/streaming-text/StreamingText.js +1 -1
- package/dist/components/tabs/Tabs.d.ts +12 -1
- package/dist/components/tabs/Tabs.js +1 -1
- package/dist/components/text-link/TextLink.d.ts +7 -0
- package/dist/components/text-link/TextLink.js +1 -1
- package/dist/components/time-picker/TimePicker.js +1 -1
- package/dist/components/timeline-chart/TimelineChart.js +1 -1
- package/dist/components/toast/Toast.js +1 -1
- package/dist/components/tool-call/ToolCall.d.ts +11 -0
- package/dist/components/tool-call/ToolCall.js +1 -1
- package/dist/components/tour/Tour.js +1 -1
- package/dist/components/tree-view/TreeView.d.ts +13 -1
- package/dist/components/tree-view/TreeView.js +1 -1
- package/dist/components/typography/Typography.d.ts +7 -0
- package/dist/components/typography/Typography.js +1 -1
- package/dist/components/window-pane/WindowPane.js +1 -1
- package/dist/hooks/useElementSize.js +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -1
- package/dist/internal/animate.js +1 -1
- package/dist/internal/calendar.d.ts +2 -2
- package/dist/internal/calendar.js +1 -1
- package/dist/internal/chart-frame.d.ts +59 -2
- package/dist/internal/chart-frame.js +1 -1
- package/dist/internal/chart-line.js +1 -1
- package/dist/internal/checkbox-group.d.ts +29 -0
- package/dist/internal/checkbox-group.js +1 -0
- package/dist/internal/defaults.d.ts +14 -2
- package/dist/internal/format.d.ts +7 -0
- package/dist/internal/format.js +1 -1
- package/dist/internal/highlight.d.ts +9 -0
- package/dist/internal/highlight.js +1 -1
- package/dist/internal/layout-effect.d.ts +17 -0
- package/dist/internal/layout-effect.js +1 -0
- package/dist/internal/media.d.ts +20 -0
- package/dist/internal/media.js +1 -1
- package/dist/internal/menu.d.ts +5 -0
- package/dist/internal/observe.d.ts +4 -1
- package/dist/internal/observe.js +1 -1
- package/dist/internal/overrides.d.ts +55 -0
- package/dist/internal/overrides.js +1 -0
- package/dist/internal/page-layout.d.ts +26 -1
- package/dist/internal/page-layout.js +1 -1
- package/dist/internal/run.d.ts +6 -1
- package/dist/internal/run.js +1 -1
- package/dist/internal/sizer.d.ts +10 -0
- package/dist/internal/sizer.js +1 -1
- package/dist/internal/styles.d.ts +41 -3
- package/dist/internal/styles.js +1 -1
- package/dist/internal/text.d.ts +25 -3
- package/dist/internal/text.js +1 -1
- package/dist/styles.css +1 -1
- package/dist/tailwind.css +94 -73
- package/package.json +3 -3
|
@@ -92,7 +92,13 @@ export interface ChartBaseProps extends Omit<BoxProps, 'children' | 'title'> {
|
|
|
92
92
|
* four labels of seven digits is a chart with a column of numbers beside it.
|
|
93
93
|
*/
|
|
94
94
|
format?: Intl.NumberFormatOptions;
|
|
95
|
-
/**
|
|
95
|
+
/**
|
|
96
|
+
* Which language the chart's own words, its numbers and its dates are in.
|
|
97
|
+
* Without it, `en-US` on the server and while the page hydrates, and the
|
|
98
|
+
* reader's after that. It sets no time zone: a `Date` is written in the zone
|
|
99
|
+
* of whatever renders it.
|
|
100
|
+
* @default the reader's
|
|
101
|
+
*/
|
|
96
102
|
locale?: string;
|
|
97
103
|
/**
|
|
98
104
|
* The chart's accessible name — what it is a chart *of*. Read out in place of
|
|
@@ -208,6 +214,10 @@ interface Visibility {
|
|
|
208
214
|
* list. A series nobody has toggled follows its own `hidden`, on every render
|
|
209
215
|
* and not only the first. The colours still come off the index the series was
|
|
210
216
|
* passed at, so hiding Europe leaves Asia exactly the colour it was.
|
|
217
|
+
*
|
|
218
|
+
* `visible` is the same array until the series or a choice changes. Everything
|
|
219
|
+
* a chart lays out reads it, and a fresh one per render made every memo keyed on
|
|
220
|
+
* it miss each time the pointer moved.
|
|
211
221
|
*/
|
|
212
222
|
declare function useVisibility(series: readonly NebaChartSeries[]): Visibility;
|
|
213
223
|
interface LegendProps {
|
|
@@ -361,6 +371,50 @@ declare function ChartStatus({ heading, items }: {
|
|
|
361
371
|
heading?: React.ReactNode;
|
|
362
372
|
items: readonly ChartTooltipItem[];
|
|
363
373
|
}): React.JSX.Element;
|
|
374
|
+
/**
|
|
375
|
+
* How many data points a chart may hold before its hidden table fills in after
|
|
376
|
+
* the first paint rather than with it.
|
|
377
|
+
*
|
|
378
|
+
* The table is a row per point, so it is most of what a large chart puts in the
|
|
379
|
+
* document: on a dashboard of four three-series line charts of a thousand points
|
|
380
|
+
* each, a scatter of five thousand, a heatmap and a bar chart, forty thousand of
|
|
381
|
+
* its fifty-one thousand elements were table cells, they were all built in one
|
|
382
|
+
* long task before the first frame, and they were two thirds of a megabyte of
|
|
383
|
+
* server HTML that nobody had asked for yet. Past this many points, the caption
|
|
384
|
+
* and the header row are written at once and the body follows in idle slices.
|
|
385
|
+
* At or under it nothing changes, and every row is in the server's HTML.
|
|
386
|
+
*/
|
|
387
|
+
export declare const deferredTablePoints = 500;
|
|
388
|
+
/**
|
|
389
|
+
* The classes every hidden chart table carries. A fixed layout takes the
|
|
390
|
+
* columns from the header row rather than from every cell, so a row added later
|
|
391
|
+
* lays out nothing above it; `contain` keeps that work inside the table.
|
|
392
|
+
*/
|
|
393
|
+
export declare const chartTableClasses = "absolute size-px overflow-hidden whitespace-nowrap [clip-path:inset(50%)] table-fixed [contain:content]";
|
|
394
|
+
/**
|
|
395
|
+
* How many of a hidden table's rows to render now.
|
|
396
|
+
*
|
|
397
|
+
* Every one of them on a chart at or under `deferredTablePoints`, on the server
|
|
398
|
+
* and in the browser alike. Past it, none on the server or in the render that
|
|
399
|
+
* hydrates what the server sent, which is what keeps the two in agreement, and
|
|
400
|
+
* then a slice more each time the browser is idle until all of them are there.
|
|
401
|
+
*
|
|
402
|
+
* What it counts is how many rows are in the document, never which: a row reads
|
|
403
|
+
* the chart's current data whenever it renders, so data that changes while the
|
|
404
|
+
* table is filling in cannot leave a stale row behind. Rows already written stay
|
|
405
|
+
* written when the data changes — a table that emptied on each refresh would
|
|
406
|
+
* take a screen reader's place in it away — and only rows that are new to it
|
|
407
|
+
* are deferred. A change in the row count, or the table unmounting, cancels the
|
|
408
|
+
* slice that was waiting.
|
|
409
|
+
*/
|
|
410
|
+
declare function useDeferredRows({ rows, points, columns }: {
|
|
411
|
+
/** How many rows the body has. */
|
|
412
|
+
rows: number;
|
|
413
|
+
/** How many data points the chart holds, which decides whether it waits. */
|
|
414
|
+
points: number;
|
|
415
|
+
/** How many cells each row has, which sizes a slice. */
|
|
416
|
+
columns: number;
|
|
417
|
+
}): number;
|
|
364
418
|
interface DataTableProps {
|
|
365
419
|
id: string;
|
|
366
420
|
caption?: string;
|
|
@@ -392,6 +446,9 @@ interface DataTableProps {
|
|
|
392
446
|
* reconciled again for each pixel the pointer travels across the picture, on a
|
|
393
447
|
* table nobody is looking at. Every prop it takes is either a primitive or
|
|
394
448
|
* something already memoised above.
|
|
449
|
+
*
|
|
450
|
+
* Past `deferredTablePoints` its body fills in after the first paint — see
|
|
451
|
+
* `useDeferredRows`.
|
|
395
452
|
*/
|
|
396
453
|
declare const ChartDataTable: React.MemoExoticComponent<({ id, caption, corner, categories, series, values, format, formatFor, locale }: DataTableProps) => React.JSX.Element>;
|
|
397
454
|
interface ExportProps {
|
|
@@ -649,5 +706,5 @@ interface CartesianProps extends CartesianChartProps {
|
|
|
649
706
|
* component never has to know which way round the axes are.
|
|
650
707
|
*/
|
|
651
708
|
export declare function CartesianChart(rawProps: CartesianProps): React.JSX.Element;
|
|
652
|
-
export { ChartDataTable, ChartExport, ChartLegendBar, ChartScaleLegend, ChartStatus, ChartSummary, ChartSurface, ChartTooltipPanel, summarise, chartHeight, useMeasuredHeight, useMeasuredWidth, useReleaseOutside, useVisibility };
|
|
709
|
+
export { ChartDataTable, ChartExport, ChartLegendBar, ChartScaleLegend, ChartStatus, ChartSummary, ChartSurface, ChartTooltipPanel, summarise, chartHeight, useDeferredRows, useMeasuredHeight, useMeasuredWidth, useReleaseOutside, useVisibility };
|
|
653
710
|
export type { Visibility };
|
|
@@ -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{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
|
+
"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{useLayoutEffectOnClient as r}from"./layout-effect.js";import{Box as i}from"../components/box/Box.js";import{alignedScale as o,bandScale as s,categoryAt as c,categoryCount as u,categoryExtent as d,chartFontSizes as h,compactNumber as m,extentOf as f,fitsLast as x,formatCategory as g,markerRadii as p,plotHeights as v,resolveColor as b,seriesColor as y,showsTick as k,textWidth as M,tickStride as w,toFullShares as C,toValues as S,truncate as N,turnedAxis as z,valueScale as P,warnPaletteOverflow as A}from"./chart.js";import{numberFormatter as T}from"./format.js";import{useHydrated as B,useIntlLocale as j}from"./media.js";import{observeResize as $}from"./observe.js";import{chartMessages as I,emptyMessages as E,fillMessage as R,useMessages as W}from"./i18n.js";import{cx as _,hasContent as F,metaTextClasses as L,srOnlyClasses as D,transitionClasses as H}from"./styles.js";const O=[];function V(e){const[t,n]=l.useState(0);return r(()=>{const t=e.current;if(!t)return;const a=()=>n(t.clientWidth);return a(),$(t,a)},[e]),t}function Z(e,t){const[n,a]=l.useState(0);return r(()=>{const n=e.current;if(!t||!n)return;const l=()=>a(n.clientHeight);return l(),$(n,l)},[e,t]),n}function q(e,t,n){return"number"==typeof e?e:void 0===e?v[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 X(e){const[t,n]=l.useState(()=>new Map),[a,r]=l.useState(null),i=l.useMemo(()=>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),[e]),o=l.useMemo(()=>e.map((e,n)=>t.get(i[n])??!e.hidden),[e,i,t]),s=l.useRef({series:e,keys:i});l.useEffect(()=>{s.current={series:e,keys:i}});return{visible:o,hovered:a,toggle:l.useCallback(e=>{const{series:t,keys:a}=s.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})},[]),setHovered:r}}const Y={top:"flex-col-reverse",bottom:"flex-col",left:"flex-row-reverse",right:"flex-row"},J={start:"justify-start",center:"justify-center",end:"justify-end"};function K(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":"",J[r.align??"center"],L[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] ${H}`,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?"":J[o]),children:n("div",{className:_("grid grid-cols-[auto_auto_auto] items-center gap-x-2",L[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)]",L[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=T(o,{});return n("span",{id:e,hidden:!0,children:[R(t,{count:s.format(a),min:l,max:r}),i&&i.count>0?` ${R(i.template,{count:s.format(i.count),min:i.min,max:i.max})}`:null]})}function U(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:D,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))]})})}export const deferredTablePoints=500;export const chartTableClasses=`${D} table-fixed [contain:content]`;function G({rows:e,points:t,columns:n}){const a=t>500,[r,i]=l.useState(()=>a?0:e),o=a?Math.min(r,e):e;o!==r&&i(o);const s=Math.max(1,Math.floor(1e3/Math.max(1,n)));return l.useEffect(()=>{if(!(r>=e))return function(e){if("function"==typeof requestIdleCallback&&"function"==typeof cancelIdleCallback){const t=requestIdleCallback(e,{timeout:500});return()=>cancelIdleCallback(t)}const t=setTimeout(e,16);return()=>clearTimeout(t)}(()=>i(Math.min(e,r+s)))},[r,e,s]),o}const Q=/*@__PURE__*/l.memo(function ChartDataTable({id:t,caption:a,corner:l,categories:r,series:i,values:o,format:s,formatFor:c,locale:u}){const d=G({rows:r.length,points:o.reduce((e,t)=>e+t.length,0),columns:i.length+1});return n("table",{id:t,className:chartTableClasses,"aria-busy":d<r.length||void 0,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.slice(0,d).map((t,a)=>n("tr",{children:[e("th",{scope:"row",children:g(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))})]})}),ee=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",H),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:r,className:o,...s}){return n(i,{...s,className:_("relative flex gap-3",Y[a],o??void 0),children:[e("div",{className:"relative min-w-0 flex-1",children:l}),t,r]})}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,v=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?v:Math.min(v,y),w=null===y?v:Math.max(v,y),C=t.color?b(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:i,categories:x,xAxis:v,yAxis:b,secondaryAxis:k,brush:w,references:$,horizontal:R=!1,stacked:F=!1,stackedFull:H=!1,includeZero:Y=!0,bandRatio:J=1,inset:G=!1,headroom:ne=0,markInset:ae=0,xScale:le="band",marks:re,markRadius:ie=24,table:oe,exportRows:se,summary:ce,swatch:ue,scale:de,markTooltip:he,height:me,format:fe,locale:xe,label:ge,legend:pe,tooltip:ve,empty:be,exportable:ye=!1,exportFileName:ke="chart.csv",onExport:Me,size:we="md",variant:Ce="text",padded:Se=!1,className:Ne,children:ze,...Pe}=a(r,["size","variant","locale"]),Ae=l.useRef(null),Te=V(Ae),Be=W(E,xe),je=W(I,xe),$e=j(xe),Ie=B(),Ee=l.useId(),Re=l.useId(),We=X(i);l.useEffect(()=>{A(i.length)},[i.length]);const _e=u(i),Fe=!0===w?{}:!1===w||void 0===w?null:w,[Le,De]=l.useState(null),He=Fe?Fe.range??Le??Fe.defaultRange??[0,Math.max(0,_e-1)]:[0,Math.max(0,_e-1)],Oe=Math.min(Math.max(0,Math.round(He[0])),Math.max(0,_e-1)),Ve=Math.min(Math.max(Oe,Math.round(He[1])),Math.max(0,_e-1)),Ze=null!==Fe&&(Oe>0||Ve<_e-1),qe=l.useMemo(()=>Ze?i.map(e=>({...e,data:e.data.slice(Oe,Ve+1)})):i,[i,Ze,Oe,Ve]),Xe=l.useMemo(()=>Ze&&x?x.slice(Oe,Ve+1):x,[x,Ze,Oe,Ve]),[Ye,Je]=l.useState(null),[Ke,Ue]=l.useState(null),[Ge,Qe]=l.useState(null),et=fe?JSON.stringify(fe):"",tt=l.useCallback(e=>fe?T($e,fe).format(e):m(e,$e),[et,$e]),nt=l.useMemo(()=>S(qe),[qe]),at=We.visible,lt=l.useMemo(()=>H?C(nt,at,tt):nt,[nt,H,at,tt]),rt=l.useMemo(()=>qe.map((e,t)=>y(e,t)),[qe]),it=u(qe),ot=l.useMemo(()=>Array.from({length:it},(e,t)=>c(t,Xe,lt)),[it,Xe,lt]),st=Ze||H,ct=l.useMemo(()=>st?S(i):null,[st,i]),ut=ct??lt,dt=l.useMemo(()=>Ze&&ct?Array.from({length:_e},(e,t)=>c(t,x,ct)):null,[Ze,_e,x,ct])??ot,ht=Math.max(0,We.visible.indexOf(!0)),mt=null!==Fe,ft=l.useMemo(()=>mt?(ut[ht]??[]).map(e=>e.value):[],[mt,ut,ht]),xt=Boolean(k)&&!F&&!H,gt=i.map(e=>"secondary"===e.axis?"1":"0").join(""),pt=l.useCallback(e=>xt&&"1"===gt[e],[xt,gt]),vt=l.useMemo(()=>{const e=f(lt.filter((e,t)=>at[t]&&!pt(t)),F),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)}},[lt,at,pt,F,$]),bt=l.useMemo(()=>xt?f(lt.filter((e,t)=>at[t]&&pt(t)),!1):null,[xt,lt,at,pt]),yt=k?.tickFormat,kt=l.useMemo(()=>ce??U(lt.filter((e,t)=>at[t]&&!pt(t)),tt),[ce,lt,at,pt,tt]),Mt=l.useMemo(()=>void 0===ce&&xt?U(lt.filter((e,t)=>at[t]&&pt(t)),yt?e=>String(yt(e,0)):tt):null,[ce,xt,lt,at,pt,yt,tt]),wt=Z(Ae,"string"==typeof me),Ct=q(me,we,wt),St=h[we],Nt=b,zt=v,Pt=Nt?.min,At=Nt?.max,Tt=Nt?.tickCount,Bt=l.useMemo(()=>de??P(vt,{min:Pt,max:At,tickCount:Tt,includeZero:Y}),[de,vt,Pt,At,Tt,Y]),jt=k?.min,$t=k?.max,It=k?.tickCount,Et=Bt.ticks.length-1,Rt=l.useMemo(()=>null===bt?null:void 0===It?o(bt,Et,{min:jt,max:$t,includeZero:Y}):P(bt,{min:jt,max:$t,tickCount:It,includeZero:Y}),[bt,Et,jt,$t,It,Y]),Wt=l.useMemo(()=>"value"===le?d(lt.filter((e,t)=>at[t]),Xe):null,[le,lt,at,Xe]),_t=zt?.min,Ft=zt?.max,Lt=zt?.tickCount,Dt=l.useMemo(()=>"value"===le?P(Wt,{min:_t,max:Ft,tickCount:Lt,includeZero:!1}):null,[le,Wt,_t,Ft,Lt]),Ht=Nt?.tickFormat,Ot=l.useMemo(()=>Bt.ticks.map((e,t)=>Ht?String(Ht(e,t)):tt(e)),[Bt,Ht,tt]),Vt=zt?.tickFormat,Zt=l.useMemo(()=>Dt?Dt.ticks.map((e,t)=>Vt?String(Vt(e,t)):m(e,$e)):ot.map((e,t)=>Vt?String(Vt(e,t)):g(e,$e)),[Dt,ot,Vt,$e]),qt=Ot.reduce((e,t)=>Math.max(e,M(t,St)),0),Xt=l.useMemo(()=>(Rt?.ticks??[]).map((e,t)=>yt?String(yt(e,t)):tt(e)),[Rt,yt,tt]),Yt=Xt.reduce((e,t)=>Math.max(e,M(t,St)),0),Jt=St+6,Kt=Rt&&!k?.hidden?k?.thickness??(R?St+12:Yt+10):0,Ut=R?zt:Nt,Gt=Boolean(Ut?.label)&&!Ut?.hidden,Qt=Boolean(Rt&&k?.label&&!k.hidden),en=R||zt?.hidden?0:zt?.tickAngle,tn=l.useMemo(()=>z(en,St),[en,St]),nn=0!==tn.angle,an=Nt?.hidden?0:qt+10,ln=(Te-(R?0:an)-16)/Math.max(1,it),rn=Math.min(140,.4*Ct),on=!Dt&&(R||nn||ln-6>=2.4*St),sn=R?150:nn?tn.cut(rn):ln-6,cn=l.useMemo(()=>on?Zt.map(e=>N(e,sn,St)):Zt,[Zt,on,sn,St]),un=l.useMemo(()=>cn.reduce((e,t)=>Math.max(e,M(t,St)),0),[cn,St]),dn=R?zt?.hidden?0:un+10:an,hn=tn.depth(un),mn=Fe?(Fe.height??32)+10:0,fn=R?Nt?.hidden?0:St+12+(Nt?.label?Jt:0):zt?.hidden?0:hn+12+(zt?.label?Jt:0),xn=(R?zt:Nt)?.thickness??dn,gn=((R?Nt:zt)?.thickness??fn)+mn,pn=(R||Dt?12:nn?tn.angle>0?tn.overhang(un)+8:8:Math.max(8,cn.length?tn.overhang(un):8))+ae+(R?0:Kt),vn=p[we]+4+ne+ae+(Gt||Qt?Jt+2:0)+(ye?20:0)+(R?Kt:0),bn=Ct,yn=xn+ae,kn=Math.max(0,Te-xn-ae-pn),Mn=Math.max(0,bn-vn-gn-ae),wn=l.useMemo(()=>({left:yn,top:vn,width:kn,height:Mn}),[yn,vn,kn,Mn]),Cn=R?wn.height:wn.width,Sn=G?Math.max(1,it-1):it,Nn=l.useMemo(()=>s(Sn,Cn,J),[Sn,Cn,J]),zn=l.useCallback(e=>G?it<=1?Cn/2:Cn*e/(it-1):Nn.centre(e),[G,it,Cn,Nn]),Pn=l.useCallback((e,t)=>{return n=void 0!==t&&pt(t)&&Rt?Rt:Bt,R?wn.left+n.fraction(e)*wn.width:wn.top+(1-n.fraction(e))*wn.height;var n},[R,wn.left,wn.top,wn.width,wn.height,Bt,Rt,pt]),An=l.useCallback((e,t,n)=>R?{x:Pn(t,n),y:wn.top+zn(e)}:{x:wn.left+zn(e),y:Pn(t,n)},[R,Pn,zn,wn.left,wn.top]),Tn=l.useCallback(e=>R?wn.top+(1-(Dt?.fraction(e)??0))*wn.height:wn.left+(Dt?.fraction(e)??0)*wn.width,[R,wn.left,wn.top,wn.width,wn.height,Dt]),Bn=l.useCallback(e=>{const t=void 0!==e&&pt(e)&&Rt?Rt:Bt;return Pn(Math.min(Math.max(0,t.min),t.max),e)},[Pn,Bt,Rt,pt]),jn=Bn(),$n=k?.tickFormat,In=l.useCallback(e=>pt(e)&&$n?e=>String($n(e,0)):tt,[pt,$n,tt]),En=l.useMemo(()=>({plot:wn,values:lt,visible:at,colors:rt,scale:Bt,secondScale:Rt,onSecond:pt,band:Nn,horizontal:R,valuePx:Pn,categoryPx:zn,point:An,categoryScale:Dt,categoryValuePx:Tn,zeroPx:jn,zeroPxOf:Bn,categories:ot,format:tt,formatFor:In,size:we}),[wn,lt,at,rt,Bt,Rt,pt,Nn,R,Pn,zn,An,Dt,Tn,jn,Bn,ot,tt,In,we]),Rn=l.useMemo(()=>re?re(En):O,[re,En]),Wn=($??[]).filter(e=>Boolean(e.label)),_n=e=>{const t=t=>"value"===(e.axis??"value")?tt(t):g(Dt?t:dt[t]??t,$e);return void 0===e.to?t(e.value):`${t(e.value)}–${t(e.to)}`},Fn=!1===ve?{mode:"none"}:!0===ve||void 0===ve?{}:ve,Ln=Fn.mode??(re?"item":"index"),Dn=null===Ke?null:Rn[Ke]??null,Hn=re?Dn?Dn.index:null:Ye,On=re?Rn.length:it,Vn=()=>{Je(null),Ue(null),Qe(null)};K(Ae,null!==Hn,Vn);const Zn=e=>{if("none"!==Ln){if(re){const t=((e,t)=>{const n=Ae.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<=ie&&(u<o||u===o&&c<s)&&(o=u,s=c,i=t)}),i})(e.clientX,e.clientY);t!==Ke&&Ue(t)}else{const t=((e,t)=>{const n=Ae.current;if(!n||0===it)return null;const a=n.getBoundingClientRect(),l=R?t-a.top-wn.top:e-a.left-wn.left;if(l<-Nn.step||l>Cn+Nn.step)return null;const r=G?it<=1?0:Math.round(l/Cn*(it-1)):Math.floor(l/Nn.step);return Math.min(it-1,Math.max(0,r))})(e.clientX,e.clientY);t!==Ye&&Je(t)}"item"!==Ln||re||Qe(((e,t)=>{const n=Ae.current;if(!n)return null;const a=n.getBoundingClientRect();return R?e-a.left:t-a.top})(e.clientX,e.clientY))}},qn=e=>{const t=null===e?null:Math.min(On-1,Math.max(0,e));re?Ue(t):Je(t)},Xn=e=>{Qe(null);qn(((re?Ke:Ye)??(e>0?-1:On))+e)},Yn=null===Hn?[]:qe.flatMap((e,t)=>{if(!We.visible[t]||Dn&&Dn.series!==t)return[];const n=lt[t]?.[Hn];return n&&null!==n.value?[{seriesIndex:t,name:e.name,color:n.color??rt[t],value:n.value,formatted:In(t)(n.value),label:n.label}]:[]}),Jn=Dn&&he?he(Dn):null,Kn=new Map;let Un=0,Gn=0;for(const e of Yn){const t=e.value??0,n=F?t<0?Gn:Un:t,a=F?n+t:t;F&&t<0?Gn=a:F&&(Un=a),Kn.set(e.seriesIndex,[Pn(n,e.seriesIndex),Pn(a,e.seriesIndex)])}const Qn=(e,t)=>{const[n,a]=Kn.get(e.seriesIndex)??[t,t];return Math.max(0,Math.min(n,a)-t,t-Math.max(n,a))},ea=Jn?Jn.items:"item"===Ln&&Yn.length>1&&null!==Ge?[Yn.reduce((e,t)=>Qn(t,Ge)<Qn(e,Ge)?t:e)]:Yn,ta=Dn?lt[Dn.series]?.[Dn.index]?.x??Xe?.[Dn.index]??Dn.index:void 0,na=e=>"number"==typeof e&&Dt?T($e,{}).format(e):g(e,$e),aa=Dn?Dn.x:R?Kn.get(ea[0]?.seriesIndex??-1)?.[1]??Pn(ea[0]?.value??0,ea[0]?.seriesIndex):wn.left+zn(Hn??0),la=Dn?Dn.y:R?wn.top+zn(Hn??0):wn.top,ra=Dn?(Dn.x-wn.left)/Math.max(1,wn.width)>.6:(R?(aa-wn.left)/Math.max(1,wn.width):zn(Hn??0)/Math.max(1,Cn))>.6,ia=!1===pe?{interactive:!1}:!0===pe||void 0===pe?{}:pe,oa=!0===pe||!1!==pe&&qe.length>1,sa=ia.side??"bottom",ca={...En,hovered:We.hovered,activeIndex:Hn,marks:Rn,activeMark:Dn},ua=0===it||null===vt||"value"===le&&null===Wt,da=Ze&&ua&&ut.some((e,t)=>We.visible[t]&&e.some(e=>null!==e.value)),ha=ua&&!da;return n(ChartSurface,{...Pe,size:we,variant:Ce,padded:Se,className:Ne,legendSide:sa,legend:oa?e(ChartLegendBar,{series:qe,colors:rt,options:ia,visibility:We,size:we,swatch:ue,values:ia.showValue&&null!==Hn?qe.map((e,t)=>{const n=lt[t]?.[Hn]?.value;return null==n?void 0:In(t)(n)}):void 0}):null,table:ha?null:n(t,{children:[oe?.(Ee,tt)??e(Q,{id:Ee,caption:ge,corner:zt?.label,categories:dt,series:i,values:ut,format:tt,formatFor:xt?In:void 0,locale:$e}),Wn.length>0?e("ul",{className:D,children:Wn.map((e,t)=>n("li",{children:[e.label,": ",_n(e)]},t))}):null]}),children:[ye&&!ha?e(ChartExport,{rows:se??(()=>[["string"==typeof zt?.label?zt.label:"",...qe.map((e,t)=>e.name??`${t+1}`)],...dt.map((e,t)=>[e,...ut.map(e=>e[t]?.value??null)])]),fileName:ke,onExport:Me,label:je.exportCsv}):null,n("div",{ref:Ae,role:"img",tabIndex:ua?void 0:0,"aria-label":ge??je.label,"aria-describedby":ua?void 0:Re,onPointerMove:Zn,onPointerDown:e=>{"touch"===e.pointerType&&Zn(e)},onPointerLeave:e=>{"touch"!==e.pointerType&&Vn()},onKeyDown:"none"===Ln?void 0:e=>{const t=R?"ArrowDown":"ArrowRight",n=R?"ArrowUp":"ArrowLeft";if(e.key===t)Xn(1);else if(e.key===n)Xn(-1);else if("Home"===e.key)qn(0);else if("End"===e.key)qn(On-1);else{if("Escape"!==e.key)return;Vn()}e.preventDefault()},onBlur:Vn,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 me?me:Ct},children:[ua?e("div",{className:_("flex h-full items-center justify-center text-(--neba-muted-fg)",L[we]),style:da?{paddingBottom:mn}:void 0,children:be??Be.title}):Te>0?n("svg",{width:Te,height:bn||"100%",viewBox:`0 0 ${Te} ${bn}`,"aria-hidden":"true",className:"block overflow-visible",children:[e(te,{plot:wn,scale:Bt,band:Nn,horizontal:R,inset:G,categoryPx:zn,valuePx:Pn,tickTexts:Ot,widestTick:qt,categoryTexts:cn,widestCategory:un,categoryScale:Dt,categoryValuePx:Tn,valueAxis:Nt,categoryAxis:zt,secondScale:Rt,secondTickTexts:Xt,secondaryAxis:k,fontSize:St,turn:tn,labelDepth:hn,zeroPx:jn}),$&&$.length>0?e(ChartReferences,{references:$,plot:wn,horizontal:R,valuePx:Pn,categoryPx:zn,categoryScale:Dt,categoryValuePx:Tn,categoryBounds:Dt?[Dt.min,Dt.max]:G?[Oe,Oe+it-1]:[Oe-.5,Oe+it-.5],categoryOffset:Oe,fontSize:St}):null,null===Hn||re||"index"!==Ln||!1===Fn.crosshair?null:(()=>{const t=zn(Hn);return e("line",R?{x1:wn.left,x2:wn.left+wn.width,y1:wn.top+t,y2:wn.top+t,stroke:"var(--neba-chart-baseline)",strokeWidth:1}:{x1:wn.left+t,x2:wn.left+t,y1:wn.top,y2:wn.top+wn.height,stroke:"var(--neba-chart-baseline)",strokeWidth:1})})(),ze(ca)]}):null,null!==Hn&&ea.length>0&&"none"!==Ln?Fn.render?e("div",{className:"pointer-events-none absolute z-10",style:ra?{right:`calc(100% - ${aa}px + 10px)`,top:la}:{left:aa+10,top:la},children:Fn.render({index:Hn,category:ta??ot[Hn],items:ea})}):e(ChartTooltipPanel,{heading:Jn?Jn.heading:na(ta??ot[Hn]),items:ea,x:aa,y:la,flip:ra,size:we}):null]}),Fe&&!ha&&Ie?e(l.Suspense,{fallback:null,children:e(ee,{outline:ft,count:_e,range:[Oe,Ve],onRange:e=>{De(e),Fe.onRangeChange?.(e)},color:rt[Math.max(0,We.visible.indexOf(!0))]??rt[0],height:Fe.height??32,words:{start:je.start,end:je.end},label:ge??je.label,categories:dt,locale:$e,width:Te})}):null,ua?null:e(ChartSummary,{id:Re,template:je.summary,locale:$e,...kt,second:Mt?{template:je.summarySecondary,...Mt}:null}),"none"===Ln?null:e(ChartStatus,{heading:null===Hn?void 0:Jn?.heading??na(ta??ot[Hn]),items:ea})]})}const te=/*@__PURE__*/l.memo(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:f,categoryAxis:g,secondScale:p,secondTickTexts:v,secondaryAxis:b,fontSize:y,turn:C,labelDepth:S,zeroPx:N}){const z=!1!==f?.grid&&!f?.hidden,P=r?g:f,A=r?f:g,T=!g?.hidden&&(g?.grid??null!==h),B=e=>h?m(h.ticks[e]):(r?a.top:a.left)+i(e),j=0!==C.angle,$=C.room(d),I=w(u.length,r?a.height:a.width,r?1.8*y:$),E=w(l.ticks.length,r?a.width:a.height,r?Math.max(c,1)+16:2*y),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,_=x(u.length,I,R,r?1.8*y:j?$:M(u[u.length-1]??"",y)),F=a.top+a.height+C.offset,L=x(l.ticks.length,E,W,r?M(s[s.length-1]??"",y):1.6*y);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,f?.hidden||!k(i,l.ticks.length,E,L)?null:e("text",r?{x:c,y:a.top+a.height+y+6,textAnchor:0===i?"start":i===l.ticks.length-1?"end":"middle",fontSize:y,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:s[i]}:{x:a.left-8,y:c,textAnchor:"end",dominantBaseline:"central",fontSize:y,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=k(l,u.length,I,_);if(!i&&(r||!T))return null;const o=B(l);return r?e("text",{x:a.left-8,y:o,textAnchor:"end",dominantBaseline:"central",fontSize:y,fill:"var(--neba-muted-fg)",className:h?"tabular-nums":void 0,children:t},l):n("g",{children:[T?e("line",{x1:o,x2:o,y1:a.top,y2:a.top+a.height,stroke:"var(--neba-chart-grid)",strokeWidth:1}):null,i?e("text",{x:o,y:F,textAnchor:j?C.anchor:h?0===l?"start":l===u.length-1?"end":"middle":"middle",transform:j?`rotate(${C.angle} ${o} ${F})`:void 0,dominantBaseline:j?"central":void 0,fontSize:y,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 k(n,p.ticks.length,E,L)?e("text",r?{x:l,y:a.top-8,textAnchor:0===n?"start":n===p.ticks.length-1?"end":"middle",fontSize:y,fill:"var(--neba-muted-fg)",className:"tabular-nums",children:v[n]}:{x:a.left+a.width+8,y:l,textAnchor:"start",dominantBaseline:"central",fontSize:y,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:y+2,textAnchor:"end",fontSize:y,fill:"var(--neba-muted-fg)",fontWeight:500,children:b.label}):null,P?.label&&!P.hidden?e("text",{x:a.left,y:y+2,textAnchor:"start",fontSize:y,fill:"var(--neba-muted-fg)",fontWeight:500,children:P.label}):null,A?.label&&!A.hidden?e("text",{x:a.left+a.width,y:a.top+a.height+S+y+12,textAnchor:"end",fontSize:y,fill:"var(--neba-muted-fg)",fontWeight:500,children:A.label}):null]})});export{Q as ChartDataTable,ChartExport,ChartLegendBar,ChartScaleLegend,ChartStatus,ChartSummary,ChartSurface,ChartTooltipPanel,U as summarise,q as chartHeight,G as useDeferredRows,Z as useMeasuredHeight,V as useMeasuredWidth,K as useReleaseOutside,X as useVisibility};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as l,jsxs as e}from"react/jsx-runtime";import{areaPath as
|
|
1
|
+
import{jsx as l,jsxs as e}from"react/jsx-runtime";import*as r from"react";import{areaPath as t,chartFontSizes as n,labelInk as o,labelledPoints as a,linePath as s,lineWidths as i,markerRadii as u,markGap as c}from"./chart.js";import{markTransitionClasses as p}from"./chart-frame.js";const f=l=>l.filter(Boolean);export function LineSeries({context:d,curve:m,filled:x,stacked:h,markers:k,valueLabels:v,connectNulls:$,gradient:b,idPrefix:g}){const{values:y,visible:j,colors:C,hovered:L,activeIndex:N,plot:W,point:z,zeroPxOf:O,size:S,formatFor:w}=d,E=i[S],G=u[S],P=r.useMemo(()=>{const l=j.indexOf(!0),e=[],r=[],n=[];return y.forEach((l,t)=>{const o=l.map((l,e)=>(l.value??0)<0?n[e]??0:r[e]??0);e.push(o),h&&j[t]&&l.forEach((l,e)=>{const t=l.value??0;t<0?n[e]=(n[e]??0)+t:r[e]=(r[e]??0)+t})}),y.map((r,n)=>{if(!j[n])return null;const o=r.map((l,r)=>{if(null===l.value)return null;const t=h?e[n][r]+l.value:l.value;return z(r,t,n)}),i=$?f(o):o,u=O(n),c=r.map((l,r)=>null===l.value?null:h?z(r,e[n][r],n):{x:z(r,l.value,n).x,y:u}),p=$?f(c):c,d=x&&h;return{tops:o,area:x?t(i,p,m):null,gap:d&&n!==l?s(p,m):null,line:d?null:s(i,m),labelled:a(r,v)}})},[y,j,h,x,$,m,z,O,v]);return e("g",{children:[e("defs",{children:[b?C.map((r,t)=>e("linearGradient",{id:`${g}-stroke-${t}`,gradientUnits:"userSpaceOnUse",x1:W.left,y1:0,x2:W.left+W.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,x&&!h?C.map((r,t)=>e("linearGradient",{id:`${g}-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]}),y.map((r,t)=>{const a=P[t];if(!a)return null;const{tops:s,labelled:i}=a,u=C[t],f=null!==L&&L!==t,d="all"===k||"auto"===k&&r.length<=14?s.map((l,e)=>e):null===N?[]:[N];return e("g",{opacity:f?.28:1,className:p,children:[null===a.area?null:l("path",{d:a.area,fill:h?`color-mix(in oklab, ${u} 70%, transparent)`:`url(#${g}-fill-${t})`,stroke:"none"}),null===a.gap?null:l("path",{d:a.gap,fill:"none",stroke:"var(--neba-chart-gap)",strokeWidth:c}),null===a.line?null:l("path",{d:a.line,fill:"none",stroke:b?`url(#${g}-stroke-${t})`:u,strokeWidth:E,strokeLinecap:"round",strokeLinejoin:"round"}),d.map(e=>{const t=s[e];return t?l("circle",{cx:t.x,cy:t.y,r:e===N?G+1:G,fill:r[e].color??u,stroke:"var(--neba-chart-gap)",strokeWidth:c,className:p},e):null}),"none"===v?null:s.map((e,a)=>{const s=r[a].value;return e&&null!==s&&i(a)?l("text",{x:e.x,y:e.y-G-5,textAnchor:e.x>W.left+W.width-24?"end":e.x<W.left+24?"start":"middle",fontSize:n[S],fontWeight:500,fill:o(r[a].color??u),className:"tabular-nums",children:r[a].label??w(t)(s)},`label-${a}`):null})]},t)})]})}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { NebaColor, NebaSize } from '../types.js';
|
|
3
|
+
/**
|
|
4
|
+
* What a Checkbox inherits from the CheckboxGroup around it.
|
|
5
|
+
*
|
|
6
|
+
* A Checkbox is a component in its own right and a group of them is a second
|
|
7
|
+
* one, so the context lives here rather than in either folder: Checkbox reads
|
|
8
|
+
* it without importing the group, which is the arrangement `button-group.ts`
|
|
9
|
+
* makes for a Button and the ButtonGroup around it.
|
|
10
|
+
*
|
|
11
|
+
* Unlike that context every field here is filled in, because the group has
|
|
12
|
+
* already settled each of them. A Checkbox's own prop still wins over `size`,
|
|
13
|
+
* `color`, `readOnly` and `name`. `invalid` and `disabled` win over the
|
|
14
|
+
* Checkbox instead: a question that was answered wrongly is wrong in every
|
|
15
|
+
* option, and a disabled group cannot hold an option that answers.
|
|
16
|
+
*
|
|
17
|
+
* `name` is the half Base UI does not carry. Its group takes the name from the
|
|
18
|
+
* Field around it, and each Neba Checkbox draws a Field of its own, so without
|
|
19
|
+
* this the inputs would reach a native submit with no name at all.
|
|
20
|
+
*/
|
|
21
|
+
export interface CheckboxGroupContextValue {
|
|
22
|
+
size: NebaSize;
|
|
23
|
+
color: NebaColor;
|
|
24
|
+
invalid: boolean;
|
|
25
|
+
disabled: boolean;
|
|
26
|
+
readOnly: boolean;
|
|
27
|
+
name: string | undefined;
|
|
28
|
+
}
|
|
29
|
+
export declare const CheckboxGroupContext: React.Context<CheckboxGroupContextValue | null>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use client";import*as t from"react";export const CheckboxGroupContext=/*@__PURE__*/t.createContext(null);
|
|
@@ -3,7 +3,7 @@ import type { NebaDensity, NebaLabelPlacement, NebaSize, NebaVariant } from '../
|
|
|
3
3
|
/**
|
|
4
4
|
* The prop values an application can set once instead of at every call site.
|
|
5
5
|
*
|
|
6
|
-
*
|
|
6
|
+
* Six, and the list is closed on purpose. These are the axes whose right value
|
|
7
7
|
* is a property of the *product* rather than of the control — a dense
|
|
8
8
|
* application is dense everywhere, a Korean one is Korean everywhere, and a
|
|
9
9
|
* form whose fields put their labels in two different places looks assembled
|
|
@@ -24,8 +24,20 @@ export interface NebaDefaults {
|
|
|
24
24
|
locale?: string;
|
|
25
25
|
/** Where every field-shaped component draws its label. */
|
|
26
26
|
labelPlacement?: NebaLabelPlacement;
|
|
27
|
+
/**
|
|
28
|
+
* The gap a Form and a Fieldset stand their fields at, on Tailwind's spacing
|
|
29
|
+
* scale: `4` is `1rem`.
|
|
30
|
+
*
|
|
31
|
+
* Only those two read it. The options of a RadioGroup or a CheckboxGroup and
|
|
32
|
+
* the rows of a List take a `spacing` of their own: they start on the same
|
|
33
|
+
* step at `md`, but a product that spreads its fields apart should not spread
|
|
34
|
+
* every set of options with them, until the options stop reading as a set.
|
|
35
|
+
* Flex and GridContainer are layout, and a page-wide gutter would move every
|
|
36
|
+
* layout in the product.
|
|
37
|
+
*/
|
|
38
|
+
spacing?: number;
|
|
27
39
|
}
|
|
28
|
-
/** Which of the
|
|
40
|
+
/** Which of the six a given component actually accepts. */
|
|
29
41
|
export type DefaultableKey = keyof NebaDefaults;
|
|
30
42
|
/**
|
|
31
43
|
* `null` when there is no provider, which is the common case and the one worth
|
|
@@ -23,6 +23,13 @@
|
|
|
23
23
|
* writing `format={{ style: 'currency', currency: 'USD' }}` inline hands over a
|
|
24
24
|
* new object on every render — which is the ordinary way that prop gets written
|
|
25
25
|
* — and keying on identity would miss every time and cache nothing but garbage.
|
|
26
|
+
*
|
|
27
|
+
* Writing that key is the other cost, and in a table it is most of it:
|
|
28
|
+
* `JSON.stringify` and a fresh string to hash on every lookup, which across
|
|
29
|
+
* thirty thousand cells was several milliseconds of a dashboard's mount for a
|
|
30
|
+
* formatter that was already built. So a lookup first asks the last few it
|
|
31
|
+
* answered, comparing the options key by key, and only a lookup none of them
|
|
32
|
+
* matches writes a key.
|
|
26
33
|
*/
|
|
27
34
|
/** A memoised `Intl.DateTimeFormat`. */
|
|
28
35
|
export declare function dateFormatter(locale: string | undefined, options: Intl.DateTimeFormatOptions): Intl.DateTimeFormat;
|
package/dist/internal/format.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{memoise as
|
|
1
|
+
import{memoise as e}from"./cache.js";function n(e,n,t){const r=e.keys;if(!n||!r)return n===r;if(n.length!==r.length)return!1;for(let o=0;o<n.length;o+=1)if(n[o]!==r[o]||t[n[o]]!==e.values[o])return!1;return!0}function t(t,r,o,u){const c=o,l=c?Object.keys(c):null;for(const e of t.recent)if(e.locale===r&&n(e,l,c))return e.value;const a=e(t.store,function(e,n){return`${e??""}\0${n?JSON.stringify(n):""}`}(r,o),u);return t.recent[t.next]={locale:r,keys:l,values:l?l.map(e=>c[e]):[],value:a},t.next=(t.next+1)%8,a}const r={store:new Map,recent:[],next:0};export function dateFormatter(e,n){return t(r,e,n,()=>new Intl.DateTimeFormat(e,n))}const o=new Map;export function segmenter(n,t){return"undefined"!=typeof Intl&&"Segmenter"in Intl?e(o,`${n??""}\0${t??""}`,()=>new Intl.Segmenter(n,{granularity:t})):null}const u={store:new Map,recent:[],next:0};export function numberFormatter(e,n){return t(u,e,n,()=>new Intl.NumberFormat(e,n))}
|
|
@@ -68,6 +68,15 @@ type LanguageDefinition = Parameters<Hljs['registerLanguage']>[1];
|
|
|
68
68
|
export declare function registerLanguage(name: string, definition: LanguageDefinition): void;
|
|
69
69
|
/** The canonical name a caller's spelling means, whether or not it can be loaded. */
|
|
70
70
|
export declare function canonicalLanguage(language: string | undefined): string | null;
|
|
71
|
+
/**
|
|
72
|
+
* Starts fetching a language's grammar without colouring anything with it.
|
|
73
|
+
*
|
|
74
|
+
* For a block that is not on screen yet. The download is what takes time and
|
|
75
|
+
* it holds nothing up, so it starts as early as it always did; the colouring
|
|
76
|
+
* is what holds the main thread, and that waits until the block is wanted.
|
|
77
|
+
* Quiet on failure, which `highlight` meets again and answers for itself.
|
|
78
|
+
*/
|
|
79
|
+
export declare function preloadLanguage(language: string): void;
|
|
71
80
|
/**
|
|
72
81
|
* Colours `code`, or returns `null` when the language is unknown or the chunk
|
|
73
82
|
* has not arrived yet.
|
|
@@ -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=[["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
|
|
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 function preloadLanguage(i){(a.has(i)||Object.hasOwn(t,i))&&h(i).catch(()=>{})}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)));const n=await g;return await new Promise(t=>setTimeout(t,0)),tokenize(n.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}]:[])}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* `useLayoutEffect` in a browser and `useEffect` on a server.
|
|
4
|
+
*
|
|
5
|
+
* A layout effect is how a component measures itself or corrects a value before
|
|
6
|
+
* the frame is painted, which is why the library has so many of them. On a
|
|
7
|
+
* server there is nothing to measure and nothing to paint, and React 18's server
|
|
8
|
+
* renderer says so with a warning for every component that asks — once per
|
|
9
|
+
* component per request, in the console of whoever renders the page. React 19
|
|
10
|
+
* dropped the warning; the peer range still promises 18.
|
|
11
|
+
*
|
|
12
|
+
* Chosen once, when the module is evaluated, rather than per call: the choice is
|
|
13
|
+
* about the environment, which does not change between renders, and a hook that
|
|
14
|
+
* is sometimes one function and sometimes the other within one process would
|
|
15
|
+
* break the rules of hooks.
|
|
16
|
+
*/
|
|
17
|
+
export declare const useLayoutEffectOnClient: typeof React.useEffect;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use client";import*as e from"react";export const useLayoutEffectOnClient="undefined"==typeof document?e.useEffect:e.useLayoutEffect;
|
package/dist/internal/media.d.ts
CHANGED
|
@@ -52,4 +52,24 @@ export declare const reducedMotionQuery = "(prefers-reduced-motion: reduce)";
|
|
|
52
52
|
* client-only tree does not render once without the value and then again with it.
|
|
53
53
|
*/
|
|
54
54
|
export declare function useHydrated(): boolean;
|
|
55
|
+
/** What an unnamed locale formats as on the server and in the hydrating render. */
|
|
56
|
+
export declare const HYDRATION_LOCALE = "en-US";
|
|
57
|
+
/**
|
|
58
|
+
* The locale an `Intl` formatter is built with.
|
|
59
|
+
*
|
|
60
|
+
* A locale the caller left out means "whatever the runtime defaults to", and a
|
|
61
|
+
* server and the reader's browser rarely default to the same thing: a server in
|
|
62
|
+
* en-US writes "October 2026", a browser in ko-KR hydrates it as "2026년 10월",
|
|
63
|
+
* and React throws the server's HTML away and renders the whole tree again. So
|
|
64
|
+
* the server and the hydrating render both write `en-US`, and every render after
|
|
65
|
+
* that goes back to the runtime's own answer — which is the only answer a tree
|
|
66
|
+
* that was never server-rendered ever sees. A locale the caller named is never
|
|
67
|
+
* touched.
|
|
68
|
+
*
|
|
69
|
+
* For `Intl` only. `useMessages` must keep reading the caller's own `locale`: an
|
|
70
|
+
* unnamed one is the built-in English table, while `en-US` would pick up an
|
|
71
|
+
* `en` table a consumer registered, and the hydrating render would then disagree
|
|
72
|
+
* with the server about the library's own words instead.
|
|
73
|
+
*/
|
|
74
|
+
export declare function useIntlLocale(locale: string | undefined): string | undefined;
|
|
55
75
|
export declare function usePrefersReducedMotion(): boolean;
|
package/dist/internal/media.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import*as e from"react";import{memoise as t}from"./cache.js";const r=new Map;function n(e){return t(r,e,()=>"undefined"!=typeof window&&window.matchMedia?window.matchMedia(e):null)}export function subscribeToQuery(e,t){const r=n(e);return r?(r.addEventListener("change",t),()=>r.removeEventListener("change",t)):()=>{}}export function queryMatches(e){return n(e)?.matches??!1}export function noMatchOnServer(){return!1}export const breakpointWidths={xs:"0rem",sm:"40rem",md:"48rem",lg:"64rem",xl:"80rem"};let o=null;function u(){if(o)return o;if("undefined"==typeof window||!window.getComputedStyle)return breakpointWidths;const e=getComputedStyle(document.documentElement),t={...breakpointWidths};for(const r of["sm","md","lg","xl"]){const n=e.getPropertyValue(`--neba-breakpoint-${r}`).trim();n&&(t[r]=n)}return o=t,t}export function widthBelow(e){return"xs"===e?null:`(width < ${u()[e]})`}export function widthAtLeast(e){return`(width >= ${u()[e]})`}export function useMediaQuery(t){const r=e.useCallback(e=>t?subscribeToQuery(t,e):()=>{},[t]),n=e.useCallback(()=>!!t&&queryMatches(t),[t]);return e.useSyncExternalStore(r,n,noMatchOnServer)}export const reducedMotionQuery="(prefers-reduced-motion: reduce)";const c=e=>subscribeToQuery(reducedMotionQuery,e),i=()=>queryMatches(reducedMotionQuery),s=()=>()=>{},d=()=>!0,a=()=>!1;export function useHydrated(){return e.useSyncExternalStore(s,d,a)}export function usePrefersReducedMotion(){return e.useSyncExternalStore(c,i,noMatchOnServer)}
|
|
1
|
+
"use client";import*as e from"react";import{memoise as t}from"./cache.js";const r=new Map;function n(e){return t(r,e,()=>"undefined"!=typeof window&&window.matchMedia?window.matchMedia(e):null)}export function subscribeToQuery(e,t){const r=n(e);return r?(r.addEventListener("change",t),()=>r.removeEventListener("change",t)):()=>{}}export function queryMatches(e){return n(e)?.matches??!1}export function noMatchOnServer(){return!1}export const breakpointWidths={xs:"0rem",sm:"40rem",md:"48rem",lg:"64rem",xl:"80rem"};let o=null;function u(){if(o)return o;if("undefined"==typeof window||!window.getComputedStyle)return breakpointWidths;const e=getComputedStyle(document.documentElement),t={...breakpointWidths};for(const r of["sm","md","lg","xl"]){const n=e.getPropertyValue(`--neba-breakpoint-${r}`).trim();n&&(t[r]=n)}return o=t,t}export function widthBelow(e){return"xs"===e?null:`(width < ${u()[e]})`}export function widthAtLeast(e){return`(width >= ${u()[e]})`}export function useMediaQuery(t){const r=e.useCallback(e=>t?subscribeToQuery(t,e):()=>{},[t]),n=e.useCallback(()=>!!t&&queryMatches(t),[t]);return e.useSyncExternalStore(r,n,noMatchOnServer)}export const reducedMotionQuery="(prefers-reduced-motion: reduce)";const c=e=>subscribeToQuery(reducedMotionQuery,e),i=()=>queryMatches(reducedMotionQuery),s=()=>()=>{},d=()=>!0,a=()=>!1;export function useHydrated(){return e.useSyncExternalStore(s,d,a)}export const HYDRATION_LOCALE="en-US";export function useIntlLocale(e){const t=useHydrated();return e??(t?void 0:"en-US")}export function usePrefersReducedMotion(){return e.useSyncExternalStore(c,i,noMatchOnServer)}
|
package/dist/internal/menu.d.ts
CHANGED
|
@@ -21,5 +21,10 @@ export interface MenuContextValue {
|
|
|
21
21
|
* opens beside it rather than downward over the next word.
|
|
22
22
|
*/
|
|
23
23
|
orientation?: NebaOrientation;
|
|
24
|
+
/**
|
|
25
|
+
* Whether a closed popup stays in the DOM, set by the menu a submenu is
|
|
26
|
+
* inside, so the rows one level down are kept along with the rest.
|
|
27
|
+
*/
|
|
28
|
+
keepMounted?: boolean;
|
|
24
29
|
}
|
|
25
30
|
export declare const MenuContext: React.Context<MenuContextValue>;
|
|
@@ -32,12 +32,15 @@ type VisibilityCallback = (visible: boolean) => void;
|
|
|
32
32
|
/**
|
|
33
33
|
* Watches whether one element is on screen. Returns the function that stops.
|
|
34
34
|
*
|
|
35
|
+
* `rootMargin` grows the screen it is measured against, for work that should
|
|
36
|
+
* start before the element arrives rather than as it does.
|
|
37
|
+
*
|
|
35
38
|
* `null` where there is no `IntersectionObserver`, rather than a no-op: a
|
|
36
39
|
* caller cannot know the answer without one, and the right fallback is to show
|
|
37
40
|
* the thing rather than to hide it forever — which is a decision only the
|
|
38
41
|
* caller can make.
|
|
39
42
|
*/
|
|
40
|
-
export declare function observeVisibility(element: Element, threshold: number, onVisible: VisibilityCallback): (() => void) | null;
|
|
43
|
+
export declare function observeVisibility(element: Element, threshold: number, onVisible: VisibilityCallback, rootMargin?: string): (() => void) | null;
|
|
41
44
|
/**
|
|
42
45
|
* A ref object that says when an element is put on it or taken off.
|
|
43
46
|
*
|
package/dist/internal/observe.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=new Map;let t=null;export function observeResize(r,n){const s="undefined"==typeof ResizeObserver?null:(t??=new ResizeObserver(t=>{for(const r of t){const t=e.get(r.target);if(t)for(const e of[...t])e(r)}}),t);if(!s)return()=>{};let o=e.get(r);return o||(o=new Set,e.set(r,o),s.observe(r)),o.add(n),()=>{const t=e.get(r);t&&(t.delete(n),0===t.size&&(e.delete(r),s.unobserve(r)))}}const r=new Map;export function observeVisibility(e,t,n){const
|
|
1
|
+
const e=new Map;let t=null;export function observeResize(r,n){const s="undefined"==typeof ResizeObserver?null:(t??=new ResizeObserver(t=>{for(const r of t){const t=e.get(r.target);if(t)for(const e of[...t])e(r)}}),t);if(!s)return()=>{};let o=e.get(r);return o||(o=new Set,e.set(r,o),s.observe(r)),o.add(n),()=>{const t=e.get(r);t&&(t.delete(n),0===t.size&&(e.delete(r),s.unobserve(r)))}}const r=new Map;export function observeVisibility(e,t,n,s="0px"){const o=Number.isNaN(t)?0:Math.min(1,Math.max(0,t)),c=function(e,t){if("undefined"==typeof IntersectionObserver)return null;const n=`${e} ${t}`;let s=r.get(n);if(!s){const o=new Map;s={watchers:o,observer:new IntersectionObserver(e=>{for(const t of e){const e=o.get(t.target);if(e)for(const r of[...e])r(t.isIntersecting)}},{threshold:e,rootMargin:t})},r.set(n,s)}return s}(o,s);if(!c)return null;let i=c.watchers.get(e);return i||(i=new Set,c.watchers.set(e,i),c.observer.observe(e)),i.add(n),()=>{const t=c.watchers.get(e);t&&(t.delete(n),0===t.size&&(c.watchers.delete(e),c.observer.unobserve(e),0===c.watchers.size&&(c.observer.disconnect(),r.delete(`${o} ${s}`))))}}export function attachedRef(e){let t=null;return{get current(){return t},set current(r){t=r,e(r)}}}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Which properties a caller's `className` sets, read off Tailwind's own names.
|
|
3
|
+
*
|
|
4
|
+
* Typography and TextLink write their defaults at two-class strength, through
|
|
5
|
+
* `[&.neba-typography]` and `[&.neba-link]`, because the tags they render are
|
|
6
|
+
* the ones a host stylesheet styles by name: `.prose h2` and `.vp-doc a` are a
|
|
7
|
+
* class plus a tag, which a one-class utility cannot outrank. A caller's own
|
|
8
|
+
* utility is one class too, so the guard that held off the host held off the
|
|
9
|
+
* caller as well — `className="mb-8"` on a Typography came out with no margin
|
|
10
|
+
* and nothing said why. No specificity sits above the host's rule and below a
|
|
11
|
+
* plain utility, so the cascade cannot settle it; the component has to know
|
|
12
|
+
* what the caller asked for.
|
|
13
|
+
*
|
|
14
|
+
* So it asks this, once per render. A property the caller's classes set leaves
|
|
15
|
+
* the guard, and the component states its default through `[:where(&)]`
|
|
16
|
+
* instead, at zero specificity: any utility the caller wrote beats it, under
|
|
17
|
+
* any variant, and it is still there below a class that only applies at a
|
|
18
|
+
* breakpoint or on hover. What the caller gives up is the guard against the
|
|
19
|
+
* host for that one property, and that is a fight the caller's class is in on
|
|
20
|
+
* any other element too.
|
|
21
|
+
*
|
|
22
|
+
* Two rules decide what counts:
|
|
23
|
+
*
|
|
24
|
+
* - **A class it cannot place counts as everything it might set.** `text-brand`
|
|
25
|
+
* is a colour in one theme and a size in another, and the stylesheet that
|
|
26
|
+
* would say which is not something a render can read. Counting a property
|
|
27
|
+
* wrongly costs one element its guard against a host stylesheet; missing one
|
|
28
|
+
* is the silent loss this module exists to end.
|
|
29
|
+
* - **An important class does not count.** `mb-8!` wins already, and keeping the
|
|
30
|
+
* guard under it is what leaves a call site written with `!` exactly as it
|
|
31
|
+
* was.
|
|
32
|
+
*
|
|
33
|
+
* It reads Tailwind's names and nothing else. A class from the caller's own
|
|
34
|
+
* stylesheet, `.hero-title`, is invisible to it and still needs two classes or
|
|
35
|
+
* `!important` to beat the guard.
|
|
36
|
+
*/
|
|
37
|
+
export declare const MARGIN_TOP = 1;
|
|
38
|
+
export declare const MARGIN_BOTTOM = 2;
|
|
39
|
+
export declare const FONT_SIZE = 4;
|
|
40
|
+
export declare const LINE_HEIGHT = 8;
|
|
41
|
+
export declare const LETTER_SPACING = 16;
|
|
42
|
+
export declare const FONT_WEIGHT = 32;
|
|
43
|
+
export declare const COLOR = 64;
|
|
44
|
+
export declare const TEXT_DECORATION_LINE = 128;
|
|
45
|
+
export declare const TEXT_DECORATION_THICKNESS = 256;
|
|
46
|
+
export declare const TEXT_DECORATION_COLOR = 512;
|
|
47
|
+
export declare const TEXT_UNDERLINE_OFFSET = 1024;
|
|
48
|
+
export declare const TEXT_UNDERLINE_POSITION = 2048;
|
|
49
|
+
/**
|
|
50
|
+
* The properties `className` sets, as the flags above.
|
|
51
|
+
*
|
|
52
|
+
* Variants are read past rather than weighed: `md:mb-4` and `hover:text-red-500`
|
|
53
|
+
* count, since the default beneath them is the floor, not the guard.
|
|
54
|
+
*/
|
|
55
|
+
export declare function overriddenBy(className: string | undefined): number;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export const MARGIN_TOP=1;export const MARGIN_BOTTOM=2;export const FONT_SIZE=4;export const LINE_HEIGHT=8;export const LETTER_SPACING=16;export const FONT_WEIGHT=32;export const COLOR=64;export const TEXT_DECORATION_LINE=128;export const TEXT_DECORATION_THICKNESS=256;export const TEXT_DECORATION_COLOR=512;export const TEXT_UNDERLINE_OFFSET=1024;export const TEXT_UNDERLINE_POSITION=2048;const t=/^(xs|sm|base|lg|[2-9]?xl)$/,e=/^(left|center|right|justify|start|end|wrap|nowrap|balance|pretty|ellipsis|clip)$|^shadow(-|$)/,s=/^(inherit|current|transparent|black|white)$|-\d+$/,n=/^(\d+|from-font|auto)$/,o=/^(sans|serif|mono)$|^(stretch|features)-|^[[(]family:/,r={margin:3,"margin-block":3,"margin-top":1,"margin-block-start":1,"margin-bottom":2,"margin-block-end":2,font:44,"font-size":4,"line-height":8,"letter-spacing":16,"font-weight":32,color:64,"text-decoration":896,"text-decoration-line":128,"text-decoration-thickness":256,"text-decoration-color":512,"text-underline-offset":1024,"text-underline-position":2048};function i(t,e){let s=0,n=-1;for(let o=0;o<t.length;o+=1){const r=t[o];"["===r||"("===r?s+=1:"]"===r||")"===r?s-=1:r===e&&0===s&&(n=o)}return n}function c(t,e,s){const n=t.slice(1,-1);return/^(length|percentage|absolute-size|relative-size):/.test(n)?e:n.startsWith("color:")||t.startsWith("(")?s:/^([\d.]|(calc|clamp|min|max)\()/.test(n)?e:/^[a-z-]+$/.test(n)?e|s:s}function a(a){const l=a.startsWith("-")?a.slice(1):a;if(l.startsWith("[")&&l.endsWith("]"))return r[l.slice(1,l.indexOf(":"))]??0;const h=/^m(bs|be|[tby])?-/.exec(l);if(h){const t=h[1];return"t"===t||"bs"===t?1:"b"===t||"be"===t?2:3}return l.startsWith("text-")?function(n){const o=i(n,"/"),r=-1===o?n:n.slice(0,o),a=4|(-1===o?0:8);return e.test(r)?0:t.test(r)?a:s.test(r)?64:r.startsWith("[")||r.startsWith("(")?c(r,a,64):64|a}(l.slice(5)):l.startsWith("font-")?o.test(l.slice(5))?0:32:l.startsWith("leading-")?8:l.startsWith("tracking-")?16:l.startsWith("decoration-")?function(t){const e=i(t,"/"),o=-1===e?t:t.slice(0,e);return/^(solid|double|dotted|dashed|wavy)$/.test(o)?0:n.test(o)?256:s.test(o)?512:o.startsWith("[")||o.startsWith("(")?c(o,256,512):768}(l.slice(11)):l.startsWith("underline-offset-")?1024:/^(underline|overline|line-through|no-underline)$/.test(l)?128:0}export function overriddenBy(t){let e=0;for(const s of t?t.split(/\s+/):[]){const t=s.slice(i(s,":")+1);!t||t.startsWith("!")||t.endsWith("!")||(e|=a(t))}return e}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import type { NebaBreakpoint, NebaSide } from '../types.js';
|
|
2
|
+
import type { NebaBreakpoint, NebaSide, NebaSize } from '../types.js';
|
|
3
3
|
/**
|
|
4
4
|
* The vocabulary a page's structure is written in, and the context the four
|
|
5
5
|
* components that build one share.
|
|
@@ -105,6 +105,31 @@ export declare const PageLayoutSlotContext: React.Context<PageLayoutSlot | null>
|
|
|
105
105
|
* "nobody said", which a standalone sidebar reads as `start`.
|
|
106
106
|
*/
|
|
107
107
|
export declare const SidebarSideContext: React.Context<SidebarSide | null>;
|
|
108
|
+
/**
|
|
109
|
+
* A Header's floor at each size, in steps of Tailwind's spacing scale.
|
|
110
|
+
*
|
|
111
|
+
* The same numbers as Header's `barMinHeightClasses`, which have to stay
|
|
112
|
+
* literal class names for Tailwind to find them, so the two are kept in step by
|
|
113
|
+
* hand and `Header.test.tsx` holds them there. They are here because the layout
|
|
114
|
+
* needs them as a length, for the reason `headerFloor` gives.
|
|
115
|
+
*/
|
|
116
|
+
export declare const headerFloorSteps: Record<NebaSize, number>;
|
|
117
|
+
/**
|
|
118
|
+
* How much a `fixed` header takes off the top of the page before anybody has
|
|
119
|
+
* measured it, or `undefined` when the header is not one.
|
|
120
|
+
*
|
|
121
|
+
* The measured height reaches the page from an effect, which on a page the
|
|
122
|
+
* server rendered is after the first paint, so everything under a fixed header
|
|
123
|
+
* would be drawn behind it and then drop by its height. A Header's height is
|
|
124
|
+
* its floor unless what is in it is taller, and the floor follows from three of
|
|
125
|
+
* its props — so the layout reads them off the element it was handed, as a
|
|
126
|
+
* Panes reads its panes' sizes, and reserves that much from the first render.
|
|
127
|
+
* The measurement then only corrects a bar that came out taller.
|
|
128
|
+
*
|
|
129
|
+
* A header wrapped in a component of the caller's own has props this cannot
|
|
130
|
+
* read, and has its room reserved only once it has been measured.
|
|
131
|
+
*/
|
|
132
|
+
export declare function headerFloor(header: React.ReactNode, providedSize: NebaSize | undefined): string | undefined;
|
|
108
133
|
/**
|
|
109
134
|
* The five widths as Tailwind variants, for the parts of this that are
|
|
110
135
|
* decided in CSS rather than in JavaScript.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import*as e from"react";import{useMediaQuery as t,widthBelow as o}from"./media.js";import{hiddenBelowClasses as n,hiddenFromClasses as r}from"./responsive.js";export const PageLayoutContext=/*@__PURE__*/e.createContext({present:!1,register:()=>{},collapseBelow:"none",open:{start:!1,end:!1},setOpen:()=>{},scroll:"page"});export const PageLayoutSlotContext=/*@__PURE__*/e.createContext(null);export const SidebarSideContext=/*@__PURE__*/e.createContext(null);export const collapsedOnlyClasses={none:"hidden",...r};export const expandedOnlyClasses={none:"",...n};export function useCollapsed(e){return t("none"===e?null:o(e))}export function drawerSide(e){const t="undefined"!=typeof document&&"rtl"===getComputedStyle(document.documentElement).direction;return"start"===e?t?"right":"left":t?"left":"right"}
|
|
1
|
+
"use client";import*as e from"react";import{useMediaQuery as t,widthBelow as o}from"./media.js";import{hiddenBelowClasses as n,hiddenFromClasses as r}from"./responsive.js";export const PageLayoutContext=/*@__PURE__*/e.createContext({present:!1,register:()=>{},collapseBelow:"none",open:{start:!1,end:!1},setOpen:()=>{},scroll:"page"});export const PageLayoutSlotContext=/*@__PURE__*/e.createContext(null);export const SidebarSideContext=/*@__PURE__*/e.createContext(null);export const headerFloorSteps={xs:10,sm:12,md:14,lg:16,xl:20};export function headerFloor(t,o){if(!e.isValidElement(t)||"fixed"!==t.props.position)return;const n=headerFloorSteps[t.props.size??o??"md"]??headerFloorSteps.md;return!1===t.props.divider?`calc(var(--spacing) * ${n})`:`calc(var(--spacing) * ${n} + 1px)`}export const collapsedOnlyClasses={none:"hidden",...r};export const expandedOnlyClasses={none:"",...n};export function useCollapsed(e){return t("none"===e?null:o(e))}export function drawerSide(e){const t="undefined"!=typeof document&&"rtl"===getComputedStyle(document.documentElement).direction;return"start"===e?t?"right":"left":t?"left":"right"}
|