neba 1.15.0 → 1.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/area-chart/AreaChart.d.ts +16 -5
- package/dist/components/area-chart/AreaChart.js +1 -1
- package/dist/components/bar-chart/BarChart.js +1 -1
- package/dist/components/combobox/Combobox.js +1 -1
- package/dist/components/gauge-chart/GaugeChart.d.ts +1 -1
- package/dist/components/heatmap-chart/HeatmapChart.d.ts +20 -1
- package/dist/components/heatmap-chart/HeatmapChart.js +1 -1
- package/dist/components/line-chart/LineChart.d.ts +16 -5
- package/dist/components/line-chart/LineChart.js +1 -1
- package/dist/components/menu/Menu.d.ts +18 -7
- package/dist/components/menu/Menu.js +1 -1
- package/dist/components/number-field/NumberField.js +1 -1
- package/dist/components/pie-chart/PieChart.d.ts +29 -0
- package/dist/components/pie-chart/PieChart.js +1 -1
- package/dist/components/prompt-input/PromptInput.js +1 -1
- package/dist/components/scatter-chart/ScatterChart.js +1 -1
- package/dist/components/select/Select.js +1 -1
- package/dist/components/sparkline/Sparkline.d.ts +14 -1
- package/dist/components/sparkline/Sparkline.js +1 -1
- package/dist/components/switch/Switch.js +1 -1
- package/dist/components/tabs/Tabs.d.ts +17 -1
- package/dist/components/tabs/Tabs.js +1 -1
- package/dist/components/text-field/TextField.js +1 -1
- package/dist/internal/chart-brush.d.ts +53 -0
- package/dist/internal/chart-brush.js +1 -0
- package/dist/internal/chart-frame.d.ts +123 -9
- package/dist/internal/chart-frame.js +1 -1
- package/dist/internal/chart-line.js +1 -1
- package/dist/internal/chart.d.ts +78 -2
- package/dist/internal/chart.js +1 -1
- package/dist/internal/glow.d.ts +44 -0
- package/dist/internal/glow.js +1 -1
- package/dist/internal/i18n.d.ts +2 -0
- package/dist/internal/i18n.js +1 -1
- package/dist/internal/picker.js +1 -1
- package/dist/locales/ar.js +1 -1
- package/dist/locales/de.js +1 -1
- package/dist/locales/es.js +1 -1
- package/dist/locales/fr.js +1 -1
- package/dist/locales/hi.js +1 -1
- package/dist/locales/id.js +1 -1
- package/dist/locales/it.js +1 -1
- package/dist/locales/ja.js +1 -1
- package/dist/locales/ko.js +1 -1
- package/dist/locales/nl.js +1 -1
- package/dist/locales/pl.js +1 -1
- package/dist/locales/pt.js +1 -1
- package/dist/locales/ru.js +1 -1
- package/dist/locales/th.js +1 -1
- package/dist/locales/tr.js +1 -1
- package/dist/locales/vi.js +1 -1
- package/dist/locales/zh-hans.js +1 -1
- package/dist/locales/zh-hant.js +1 -1
- package/dist/styles.css +1 -1
- package/dist/tailwind.css +15 -0
- package/dist/types.d.ts +133 -0
- package/package.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { type CartesianChartProps } from '../../internal/chart-frame.js';
|
|
3
3
|
import { type ChartMarkers } from '../../internal/chart-line.js';
|
|
4
|
-
import type { NebaChartCurve, NebaChartValueLabels } from '../../types.js';
|
|
4
|
+
import type { NebaChartCurve, NebaChartNulls, NebaChartValueLabels } from '../../types.js';
|
|
5
5
|
export interface AreaChartProps extends CartesianChartProps {
|
|
6
6
|
/**
|
|
7
7
|
* How the edge of the band gets from one point to the next. The same three
|
|
@@ -30,9 +30,20 @@ export interface AreaChartProps extends CartesianChartProps {
|
|
|
30
30
|
/** @default 'none' */
|
|
31
31
|
valueLabels?: NebaChartValueLabels;
|
|
32
32
|
/**
|
|
33
|
-
*
|
|
34
|
-
*
|
|
35
|
-
*
|
|
33
|
+
* What the band does where a value is missing, and it matters more here than
|
|
34
|
+
* on a line: a fill that closes over a missing month paints a made-up number
|
|
35
|
+
* across a whole region rather than along a segment.
|
|
36
|
+
*
|
|
37
|
+
* `gap` is the default. `zero` reads the hole as a nought everywhere — the
|
|
38
|
+
* axis, the tooltip and the table with it — which on a stacked chart is often
|
|
39
|
+
* what a caller actually meant, since a band that breaks takes the bands
|
|
40
|
+
* above it with it.
|
|
41
|
+
* @default 'gap'
|
|
42
|
+
*/
|
|
43
|
+
nulls?: NebaChartNulls;
|
|
44
|
+
/**
|
|
45
|
+
* Draws the band straight through a `null` instead of breaking at it.
|
|
46
|
+
* @deprecated Pass `nulls="connect"`. Read only when `nulls` is left out.
|
|
36
47
|
* @default false
|
|
37
48
|
*/
|
|
38
49
|
connectNulls?: boolean;
|
|
@@ -51,4 +62,4 @@ export interface AreaChartProps extends CartesianChartProps {
|
|
|
51
62
|
* so two of them overlapping stay readable. Stacked bands are opaquer, because
|
|
52
63
|
* there the fill *is* the mark rather than a hint at the line above it.
|
|
53
64
|
*/
|
|
54
|
-
export declare function AreaChart({ curve, stacked, markers, valueLabels, connectNulls, series, yAxis, format, ...props }: AreaChartProps): React.JSX.Element;
|
|
65
|
+
export declare function AreaChart({ curve, stacked, markers, valueLabels, nulls, connectNulls, series, yAxis, format, ...props }: AreaChartProps): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{CartesianChart as t}from"../../internal/chart-frame.js";import{LineSeries as
|
|
1
|
+
"use client";import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{CartesianChart as t}from"../../internal/chart-frame.js";import{LineSeries as n}from"../../internal/chart-line.js";import{zeroGaps as a}from"../../internal/chart.js";export function AreaChart({curve:o="linear",stacked:s=!1,markers:c="none",valueLabels:i="none",nulls:l,connectNulls:m=!1,series:u,yAxis:f,format:d,...p}){const x=r.useId().replace(/:/g,""),k="full"===s,h=l??(m?"connect":"gap"),j=r.useMemo(()=>"zero"===h?a(u):u,[u,h]);return e(t,{...p,series:j,stackedFull:k,format:d,yAxis:k?{min:0,max:100,tickFormat:e=>`${e}%`,...f}:f,stacked:!1!==s,inset:!0,includeZero:!0,headroom:"none"===i?0:10,children:r=>e(n,{context:r,curve:o,filled:!0,stacked:!1!==s,markers:c,valueLabels:i,connectNulls:"connect"===h,gradient:!1,idPrefix:x})})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{CartesianChart as a,markTransitionClasses as n}from"../../internal/chart-frame.js";import{barBandRatio as l,barMaxThickness as r,barPath as i,barRadius as o,chartFontSizes as s,
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{CartesianChart as a,markTransitionClasses as n}from"../../internal/chart-frame.js";import{barBandRatio as l,barMaxThickness as r,barPath as i,barRadius as o,chartFontSizes as s,labelInk as u,labelledPoints as d,markGap as c}from"../../internal/chart.js";import{useStyleDefaults as h}from"../../internal/defaults.js";export function BarChart(t){const{orientation:n="vertical",stacked:i=!1,rounded:o=!0,barSize:s,valueLabels:u="none",series:d,yAxis:c,size:m="md",density:x="default",...f}=h(t,["size","density"]),v="full"===i;return e(a,{...f,series:d,stackedFull:v,size:m,density:x,horizontal:"horizontal"===n,stacked:!1!==i,yAxis:v?{min:0,max:100,tickFormat:e=>`${e}%`,...c}:c,includeZero:!0,bandRatio:l[x],headroom:"none"===u?0:12,children:t=>e(Bars,{context:t,stacked:!1!==i,rounded:o,barSize:s??r[m],valueLabels:u,size:m})})}function Bars({context:a,stacked:l,rounded:r,barSize:h,valueLabels:m,size:x}){const{values:f,visible:v,colors:b,hovered:p,activeIndex:z,plot:y,band:k,horizontal:g,valuePx:j,categoryPx:M,zeroPx:B,zeroPxOf:P,format:S}=a,A=f.map((e,t)=>({one:e,index:t})).filter(e=>v[e.index]),L=l?1:Math.max(1,A.length),N=Math.min(h,Math.max(1,(k.band-c*(L-1))/L)),W=N*L+c*(L-1),w=[],F=[],C=s[x];return t("g",{children:[A.map(({one:a,index:s},h)=>{const x=b[s],f=null!==p&&p!==s,v="extremes"===m||"last"===m?d(a,m):null;return e("g",{opacity:f?.28:1,className:n,children:a.map((a,d)=>{if(null===a.value)return null;const f=M(d),b=l?0:h*(N+c)-W/2+N/2,p=l?a.value>=0?w[d]??0:F[d]??0:0,k=0===p?P(s):j(p,s),B=j(p+a.value,s);l&&(a.value>=0?w[d]=p+a.value:F[d]=p+a.value);const A=l&&0!==p?c:0,L=Math.abs(B-k)-A;if(L<=0)return null;const I=B<k,O=d===z,R=g?i(Math.min(k,B)+(I?0:A),y.top+f+b-N/2,L,N,r&&!l?o:r?o/2:0,a.value>=0?"right":"left"):i(y.left+f+b-N/2,Math.min(k,B)+(I?0:A),N,L,r&&!l?o:r?o/2:0,a.value>=0?"up":"down");return t("g",{children:[e("path",{d:R,fill:a.color??x,opacity:O?1:.92,className:n}),"none"===m||v&&!v(d)?null:e("text",{x:g?B+(a.value>=0?5:-5):y.left+f+b,y:g?y.top+f+b:a.value>=0?B-5:B+C+2,textAnchor:g?a.value>=0?"start":"end":"middle",dominantBaseline:g?"central":void 0,fontSize:C,fontWeight:500,fill:u(a.color??x),className:"tabular-nums",children:a.label??S(a.value)})]},d)})},s)}),e("line",g?{x1:B,x2:B,y1:y.top,y2:y.top+y.height,stroke:"var(--neba-chart-baseline)",strokeWidth:1}:{x1:y.left,x2:y.left+y.width,y1:B,y2:B,stroke:"var(--neba-chart-baseline)",strokeWidth:1})]})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{Combobox as t}from"@base-ui/react/combobox";import{Field as n}from"@base-ui/react/field";import{Chip as i}from"../chip/Chip.js";import{actionMessages as r,comboboxMessages as o,fillMessage as s,useMessages as c}from"../../internal/i18n.js";import{CheckIcon as d,ChevronIcon as m,CloseIcon as u,PlusIcon as p}from"../../internal/icons.js";import{keyHandler as b}from"../../internal/keys.js";import{chipRemoveClasses as h,controlTextLeadingClasses as f,cx as g,disabledClasses as v,fieldFocusTransitionClasses as x,fieldHeightClasses as y,fieldReadOnlyClasses as N,fieldRestClasses as w,fieldRingClasses as j,gapClasses as C,hasContent as L,iconClasses as I,metaTextClasses as S,paddingXClasses as z,popupFadeClasses as V,radiusClasses as O,stackGapClasses as $,surfaceClasses as _,surfaceSlots as
|
|
1
|
+
"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{Combobox as t}from"@base-ui/react/combobox";import{Field as n}from"@base-ui/react/field";import{Chip as i}from"../chip/Chip.js";import{actionMessages as r,comboboxMessages as o,fillMessage as s,useMessages as c}from"../../internal/i18n.js";import{CheckIcon as d,ChevronIcon as m,CloseIcon as u,PlusIcon as p}from"../../internal/icons.js";import{keyHandler as b}from"../../internal/keys.js";import{chipRemoveClasses as h,controlTextLeadingClasses as f,cx as g,disabledClasses as v,fieldFocusTransitionClasses as x,fieldHeightClasses as y,fieldReadOnlyClasses as N,fieldRestClasses as w,fieldRingClasses as j,gapClasses as C,hasContent as L,iconClasses as I,metaTextClasses as S,paddingXClasses as z,popupFadeClasses as V,radiusClasses as O,stackGapClasses as $,surfaceClasses as _,surfaceSlots as k,transitionClasses as M}from"../../internal/styles.js";import{useStyleDefaults as A}from"../../internal/defaults.js";import{fieldLight as F,fieldSpotlightSlot as R,glowClasses as T}from"../../internal/glow.js";import{useFieldsetDisabled as q}from"../../internal/fieldset.js";const E=["group relative flex w-full cursor-text items-center","[-webkit-tap-highlight-color:transparent]",M,x,j,I].join(" "),P={xs:"min-h-5.5 py-0",sm:"min-h-6.5 py-[2px]",md:"min-h-8 py-[3px]",lg:"min-h-10 py-[4px]",xl:"min-h-12 py-[4px]"},B=[_,"max-h-[min(20rem,var(--available-height))] overflow-y-auto overscroll-contain","w-[var(--anchor-width)] border bg-(--n-panel-press) p-1","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]","[outline:none]",V].join(" "),D=["relative flex cursor-pointer items-center gap-2 select-none","rounded-(--neba-radius-xs) py-1.5 pe-2 ps-7",M,"data-[highlighted]:bg-(--n-soft-hover) data-[highlighted]:text-(--n-on-tint)","data-[selected]:text-(--n-on-tint) data-[selected]:font-medium","data-[disabled]:cursor-not-allowed data-[disabled]:text-(--neba-disabled-fg)","[outline:none]"].join(" "),G=["inline-flex h-[1lh] shrink-0 cursor-pointer items-center justify-center","rounded-(--neba-radius-xs) text-(--neba-muted-fg)","[transition:color_var(--neba-duration)_var(--neba-ease)]","hover:text-(--n-accent)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1","disabled:cursor-not-allowed disabled:text-(--neba-disabled-fg)"].join(" ");function H(e){return null==e?[]:Array.isArray(e)?e.slice():[e]}export function Combobox(x){const{variant:j="outline",size:I="md",color:V="primary",density:_="default",elevation:M=0,items:K,multiple:W,value:J,defaultValue:Q,onValueChange:U,filter:X,onInputValueChange:Y,allowCustom:Z=!0,customLabel:ee,clearable:ae=!1,locale:le,emptyMessage:te,limit:ne,placeholder:ie,label:re,description:oe,error:se,invalid:ce,startIcon:de,fullWidth:me=!1,disabled:ue,readOnly:pe=!1,required:be=!1,name:he,open:fe,defaultOpen:ge,onOpenChange:ve,clearLabel:xe,openLabel:ye,removeLabel:Ne,inputRef:we,shortcuts:je,id:Ce,className:Le,classNames:Ie,style:Se,"aria-label":ze,"aria-labelledby":Ve,...Oe}=A(x,["size","density","variant","locale"]),$e=q(ue),_e=!$e&&!pe,ke=c(o,le),Me=c(r,le),Ae=Ne??(e=>s(ke.remove,{label:e})),Fe=L(se),Re=ce??Fe,Te=Re?"danger":V,qe=!0===W,Ee=l.useMemo(()=>K.map(e=>({value:e.value,label:e.label??String(e.value),disabled:e.disabled})),[K]),[Pe,Be]=l.useState(()=>H(Q)),De=void 0===J?Pe:H(J),[Ge,He]=l.useState(""),Ke=l.useMemo(()=>new Map(Ee.map(e=>[e.value,e])),[Ee]),We=l.useCallback(e=>Ke.get(e)??{value:e,label:String(e),custom:!0},[Ke]),Je=Ge.trim(),Qe=Je.toLocaleLowerCase(),Ue=""===Je||Ee.some(e=>e.label.toLocaleLowerCase()===Qe||String(e.value).toLocaleLowerCase()===Qe)||De.some(e=>String(e).toLocaleLowerCase()===Qe),Xe=!Z||pe||$e||Ue?null:Je,Ye=t.useFilter({locale:le}),Ze=null!==Xe&&void 0!==ne&&ne>-1,ea=l.useMemo(()=>{if(null===Xe)return Ee;const e={value:Xe,label:Xe,custom:!0};if(!Ze)return[...Ee,e];return[...(!1===X?Ee:Ee.filter(e=>X?X(e,Xe):Ye.contains(e.label,Xe))).slice(0,ne),e]},[Ee,Xe,Ze,X,Ye,ne]),aa=qe?De.map(We):De.length>0?We(De[0]):null;const la=z[_][I],ta=[E,f[I],O[I],C[I],qe?P[I]:y[I],`${la} pe-1.5`,$e?v[j]:pe?N[j]:`${w[j]} ${T}`,Ie?.shell].filter(Boolean).join(" "),na=["neba-input min-w-0 flex-1 self-stretch bg-transparent [font:inherit] text-inherit","[outline:none]","placeholder:text-(--neba-muted-fg)","caret-(--n-accent) selection:bg-(--n-soft-press)","disabled:cursor-not-allowed",Ie?.control].filter(Boolean).join(" "),ia=a=>e(t.Input,{ref:we,"aria-label":ze,"aria-labelledby":Ve,onKeyDown:b(je),placeholder:ie,className:qe?`${na} min-w-16 ${a?"ms-1.5":""}`:na});return a(n.Root,{disabled:$e,invalid:Re,className:g("flex-col align-top",$[I],me?"flex w-full":"inline-flex",Le??""),style:{...k(Te,M),..._e?R:void 0,...Se},...Oe,children:[re?e(n.Label,{className:g(S[I],"font-medium",$e?"text-(--neba-disabled-fg)":"text-(--neba-fg)",Ie?.label),children:re}):null,a(t.Root,{id:Ce,name:he,items:ea,multiple:qe,value:aa,onValueChange:e=>{!function(e){void 0===J&&Be(e),U?.(qe?e:e[0]??null)}((null===e?[]:Array.isArray(e)?e:[e]).map(e=>e.value))},onInputValueChange:e=>{He(e),Y?.(e)},open:fe,defaultOpen:ge,onOpenChange:e=>ve?.(e),autoHighlight:!0,itemToStringLabel:e=>e.label,itemToStringValue:e=>String(e.value),isItemEqualToValue:(e,a)=>e.value===a.value,limit:Ze?-1:ne,filter:Ze||!1===X?null:X?(e,a)=>!0===e.custom||X(e,a):void 0,disabled:$e,readOnly:pe,required:be,children:[a(t.InputGroup,{className:ta,...F(_e),children:[de?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:de}):null,qe?e(t.Chips,{className:"flex min-w-0 flex-1 flex-wrap items-center gap-1",children:e(t.Value,{children:n=>a(l.Fragment,{children:[n.map(a=>e(t.Chip,{render:e(i,{variant:"outline",size:I,color:Te,density:"compact",disabled:$e,className:Ie?.chip,endIcon:pe||$e?null:e(t.ChipRemove,{"aria-label":Ae(a.label),className:h,children:e(u,{})})}),children:a.label},String(a.value))),ia(n.length>0)]})})}):ia(!1),ae&&!pe?e(t.Clear,{"aria-label":xe??Me.clear,className:G,children:e(u,{})}):null,e(t.Trigger,{"aria-label":"string"==typeof re?void 0:ye??ke.open,className:G,children:e(t.Icon,{className:["flex items-center","[transition:rotate_var(--neba-duration)_var(--neba-ease)]","data-[popup-open]:rotate-180"].join(" "),children:e(m,{})})})]}),e(t.Portal,{children:e(t.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",sideOffset:6,children:a(t.Popup,{className:g(B,O[I],f[I],Ie?.popup),style:k(Te,3),children:[e(t.Empty,{className:"px-2 py-1.5 text-(--neba-muted-fg) empty:hidden",children:te??ke.empty}),e(t.List,{children:n=>e(t.Item,{value:n,disabled:n.disabled,className:g(D,Ie?.item),children:n.custom?a(l.Fragment,{children:[e("span",{className:"absolute start-1.5 flex size-4 items-center justify-center text-(--n-accent) [&_svg]:size-4",children:e(p,{})}),e("span",{className:"truncate",children:ee?ee(n.label):s(ke.add,{label:n.label})})]}):a(l.Fragment,{children:[e(t.ItemIndicator,{className:"absolute start-1.5 flex size-4 items-center justify-center",children:e(d,{})}),e("span",{className:"truncate",children:n.label})]})},`${n.custom?"custom:":""}${String(n.value)}`)})]})})})]}),oe?e(n.Description,{className:g(S[I],"text-(--neba-muted-fg)",Ie?.description),children:oe}):null,e(n.Error,Fe?{match:!0,className:g(S[I],"text-(--n-accent)",Ie?.error),children:se}:{className:g(S[I],"text-(--n-accent)",Ie?.error)})]})}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { type ChartBaseProps } from '../../internal/chart-frame.js';
|
|
3
3
|
import type { NebaThreshold } from '../../types.js';
|
|
4
|
-
export interface GaugeChartProps extends Omit<ChartBaseProps, 'legend' | 'tooltip'> {
|
|
4
|
+
export interface GaugeChartProps extends Omit<ChartBaseProps, 'legend' | 'tooltip' | 'exportable' | 'exportFileName' | 'onExport'> {
|
|
5
5
|
/**
|
|
6
6
|
* The reading. `null` draws the dial with nothing on it, which is the honest
|
|
7
7
|
* picture of an instrument that has not been told anything.
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { type ChartScaleKind } from '../../internal/chart.js';
|
|
3
|
-
import type { NebaChartCategory, NebaChartLegend, NebaChartSeries } from '../../types.js';
|
|
3
|
+
import type { NebaChartAxis, NebaChartCategory, NebaChartLegend, NebaChartSeries } from '../../types.js';
|
|
4
4
|
import type { ChartBaseProps } from '../../internal/chart-frame.js';
|
|
5
5
|
export interface HeatmapChartProps extends Omit<ChartBaseProps, 'legend'> {
|
|
6
6
|
/**
|
|
@@ -50,6 +50,25 @@ export interface HeatmapChartProps extends Omit<ChartBaseProps, 'legend'> {
|
|
|
50
50
|
valueLabels?: 'none' | 'all';
|
|
51
51
|
/** Where the scale legend sits. `false` leaves it off. */
|
|
52
52
|
legend?: boolean | Pick<NebaChartLegend, 'side' | 'align'>;
|
|
53
|
+
/**
|
|
54
|
+
* The column axis — the names along the bottom of a `grid`.
|
|
55
|
+
*
|
|
56
|
+
* Both of a heatmap's axes are **category** axes: what the magnitude is drawn
|
|
57
|
+
* on is the colour ramp, which the scale legend describes rather than an
|
|
58
|
+
* axis. So `min`, `max`, `tickCount` and `grid` mean nothing here and are not
|
|
59
|
+
* read; the chart's own `min` and `max` are the ones that set the ramp.
|
|
60
|
+
* `hidden`, `label`, `tickFormat`, `tickAngle` and `thickness` all work.
|
|
61
|
+
*
|
|
62
|
+
* A `treemap` names its tiles on their own faces, so it has no axes and reads
|
|
63
|
+
* neither of these.
|
|
64
|
+
*/
|
|
65
|
+
xAxis?: NebaChartAxis;
|
|
66
|
+
/**
|
|
67
|
+
* The row axis — the names down the side of a `grid`. The same five fields as
|
|
68
|
+
* `xAxis`, less `tickAngle`: a row already has a line of its own, and turning
|
|
69
|
+
* its name would take room it is not short of.
|
|
70
|
+
*/
|
|
71
|
+
yAxis?: NebaChartAxis;
|
|
53
72
|
}
|
|
54
73
|
/**
|
|
55
74
|
* A magnitude per cell, coloured rather than measured.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as l from"react";import{
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as l from"react";import{ChartExport as n,ChartScaleLegend as a,ChartStatus as r,ChartSummary as i,ChartSurface as o,ChartTooltipPanel as d,markTransitionClasses as h,summarise as s,useMeasuredWidth as m,useReleaseOutside as c,chartHeight as u,useMeasuredHeight as x}from"../../internal/chart-frame.js";import{categoryAt as f,chartFontSizes as p,compactNumber as g,formatCategory as w,markGap as v,rampFill as b,rampInk as y,rampStep as M,rampSteps as k,squarify as A,textWidth as $,toValues as z,truncate as N,turnedAxis as j}from"../../internal/chart.js";import{numberFormatter as E}from"../../internal/format.js";import{cx as S,metaTextClasses as B,srOnlyClasses as C}from"../../internal/styles.js";import{chartMessages as D,emptyMessages as I,useMessages as F}from"../../internal/i18n.js";import{useStyleDefaults as L}from"../../internal/defaults.js";export function HeatmapChart(P){const{series:R,categories:U,shape:_="grid",scale:q="sequential",midpoint:H=0,min:K,max:T,valueLabels:G="none",xAxis:J,yAxis:O,height:Q,format:V,locale:X,label:Y,legend:Z,tooltip:ee,empty:te,exportable:le=!1,exportFileName:ne="chart.csv",onExport:ae,size:re="md",variant:ie="text",padded:oe=!1,className:de,...he}=L(P,["size","variant","locale"]),se=l.useRef(null),me=m(se),ce=F(I,X),ue=F(D,X),xe=l.useId(),[fe,pe]=l.useState(null);c(se,null!==fe,()=>pe(null));const ge=l.useId(),we=l.useCallback(e=>V?E(X,V).format(e):g(e,X),[V,X]),ve=l.useMemo(()=>z(R),[R]),be=ve.reduce((e,t)=>Math.max(e,t.length),0),ye=l.useMemo(()=>Array.from({length:be},(e,t)=>f(t,U,ve)),[be,U,ve]),Me=l.useMemo(()=>R.map((e,t)=>e.name??`${t+1}`),[R]),ke=l.useMemo(()=>{let e=1/0,t=-1/0,l=!1;for(const n of ve)for(const a of n)null!==a.value&&(l=!0,e=Math.min(e,a.value),t=Math.max(t,a.value));return l?{min:e,max:t}:null},[ve]),Ae=K??ke?.min??0,$e=T??ke?.max??1,ze=l.useCallback(e=>M(e,Ae,$e,q,H),[Ae,$e,q,H]),Ne=x(se,"string"==typeof Q),je=u(Q,re,Ne),Ee=p[re],Se=!0===Z||void 0===Z||!1===Z?{}:Z,Be=!1!==Z,Ce=Se.side??"bottom",De=!1===ee?{mode:"none"}:!0===ee||void 0===ee?{}:ee,Ie="none"===De.mode,Fe=null===ke||0===be||0===R.length,Le=O?.tickFormat,We="treemap"===_||O?.hidden,Pe=l.useMemo(()=>{if(We||me<=0)return{texts:[],band:0};const e=Math.min(150,.25*me),t=Me.map((t,l)=>N(Le?String(Le(t,l)):t,e,Ee));return{texts:t,band:t.reduce((e,t)=>Math.max(e,$(t,Ee)),0)+10}},[We,Me,Le,me,Ee]),Re="treemap"===_?0:J?.tickAngle,Ue=l.useMemo(()=>j(Re,Ee),[Re,Ee]),_e=J?.tickFormat,qe=l.useMemo(()=>ye.map((e,t)=>_e?String(_e(e,t)):w(e,X)),[ye,_e,X]),He=Math.min(140,.4*je),Ke=l.useMemo(()=>0===Ue.angle?qe:qe.map(e=>N(e,Ue.cut(He),Ee)),[qe,Ue,He,Ee]),Te=Ke.reduce((e,t)=>Math.max(e,$(t,Ee)),0),Ge=Ee+6,Je="treemap"===_||J?.hidden?0:Ue.depth(Te)+8+(J?.label?Ge:0),Oe=Boolean(O?.label)&&!We,Qe=(Oe?Ge+2:0)+(le?20:0),Ve={left:O?.thickness??Pe.band,top:Qe,width:Math.max(0,me-(O?.thickness??Pe.band)),height:Math.max(0,je-(J?.thickness??Je)-Qe)},Xe=l.useMemo(()=>{if(Ve.width<=0||Ve.height<=0)return[];if("treemap"===_){const e=[];return ve.forEach((t,l)=>t.forEach((t,n)=>{null!==t.value&&e.push({row:l,index:n,cell:t})})),A(e.map(e=>Math.max(0,e.cell.value??0)),Ve.width,Ve.height).map(t=>({row:e[t.index].row,index:e[t.index].index,cell:e[t.index].cell,x:Ve.left+t.x,y:Ve.top+t.y,width:t.width,height:t.height}))}const e=Ve.height/Math.max(1,R.length),t=Ve.width/Math.max(1,be),l=[];return ve.forEach((n,a)=>n.forEach((n,r)=>{null!==n.value&&l.push({row:a,index:r,cell:n,x:Ve.left+r*t,y:Ve.top+a*e,width:t,height:e})})),l},[_,ve,R.length,be,Ve.left,Ve.top,Ve.width,Ve.height]),Ye=l.useCallback(e=>w(e.cell.x??U?.[e.index]??ye[e.index]??e.index,X),[U,ye,X]),Ze=l.useMemo(()=>{if("treemap"!==_)return{heads:ye.map(e=>w(e,X)),rows:ve.map(e=>ye.map((t,l)=>e[l]))};const e=[],t=new Map,l=ve.map(l=>{const n=[];return l.forEach((l,a)=>{const r=w(l.x??U?.[a]??ye[a]??a,X);let i=t.get(r);void 0===i&&(i=e.length,t.set(r,i),e.push(r)),n[i]=l}),n});return{heads:e,rows:l}},[_,ye,ve,U,X]),et=null===fe?null:Xe.find(e=>e.row===fe.row&&e.index===fe.index)??null,tt=null===et?[]:[{seriesIndex:et.row,color:et.cell.color??b(ze(et.cell.value??0),q),value:et.cell.value,formatted:we(et.cell.value??0),label:et.cell.label}],lt=Array.from({length:k},(e,t)=>b(t,q));return t(o,{...he,size:re,variant:ie,padded:oe,className:de,legendSide:Ce,legend:Be&&!Fe?e(a,{steps:lt,from:we("diverging"===q?-W(Ae,$e,H)+H:Ae),to:we("diverging"===q?W(Ae,$e,H)+H:$e),middle:"diverging"===q?we(H):void 0,align:Se.align??"center",vertical:"left"===Ce||"right"===Ce,size:re}):null,table:Fe?null:t("table",{id:xe,className:C,children:[Y?e("caption",{children:Y}):null,e("thead",{children:t("tr",{children:[e("th",{scope:"col"}),Ze.heads.map((t,l)=>e("th",{scope:"col",children:t},l))]})}),e("tbody",{children:Ze.rows.map((l,n)=>t("tr",{children:[e("th",{scope:"row",children:Me[n]}),Ze.heads.map((t,n)=>{const a=l[n];return e("td",{children:void 0!==a?.label?a.label:null==a?.value?"":we(a.value)},n)})]},n))})]}),children:[le&&!Fe?e(n,{rows:()=>[["",...Ze.heads],...Ze.rows.map((e,t)=>[Me[t],...e.map(e=>e?.value??null)])],fileName:ne,onExport:ae,label:ue.exportCsv}):null,t("div",{ref:se,role:"img",tabIndex:Fe?void 0:0,"aria-label":Y??ue.label,"aria-describedby":Fe?void 0:ge,onPointerLeave:e=>{"touch"!==e.pointerType&&pe(null)},onBlur:()=>pe(null),onKeyDown:e=>{if(Ie||0===Xe.length)return;const t=null===fe?-1:Xe.findIndex(e=>e.row===fe.row&&e.index===fe.index),l="treemap"!==_&&-1!==t,n="ArrowRight"===e.key||"ArrowDown"===e.key;if(!l||"ArrowDown"!==e.key&&"ArrowUp"!==e.key)if(n||"ArrowLeft"===e.key||"ArrowUp"===e.key){const e=n?Xe[Math.min(Xe.length-1,t+1)]:Xe[Math.max(0,(-1===t?Xe.length:t)-1)];pe({row:e.row,index:e.index})}else{if("Escape"!==e.key)return;pe(null)}else{const l=Xe[t],n="ArrowDown"===e.key,a=Xe.filter(e=>e.index===l.index&&(n?e.row>l.row:e.row<l.row)).sort((e,t)=>n?e.row-t.row:t.row-e.row)[0];a&&pe({row:a.row,index:a.index})}e.preventDefault()},className:S("relative w-full rounded-(--neba-radius-xs)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"),style:{height:"string"==typeof Q?Q:je},children:[Fe?e("div",{className:S("flex h-full items-center justify-center text-(--neba-muted-fg)",B[re]),children:te??ce.title}):me>0?t("svg",{width:me,height:je,viewBox:`0 0 ${me} ${je}`,"aria-hidden":"true",className:"block",children:[Xe.map(l=>{const n=ze(l.cell.value??0),a=fe?.row===l.row&&fe?.index===l.index,r=Math.max(0,l.width-v),i=Math.max(0,l.height-v);if(r<=0||i<=0)return null;const o=we(l.cell.value??0),d="treemap"===_?"all"===G?[Ye(l),o]:[Ye(l)]:"all"===G?[o]:[],s=d.filter(e=>function(e,t,l,n){return l>=1.8*n&&t>=Math.min($(e,n),2.5*n)+8}(e,r,i/d.length,Ee)),m=l.cell.color?"var(--neba-surface)":y(n,q);return t("g",{children:[e("rect",{x:l.x+v/2,y:l.y+v/2,width:r,height:i,rx:Math.min(3,r/2,i/2),fill:l.cell.color??b(n,q),opacity:a?1:.94,onPointerEnter:Ie?void 0:()=>pe({row:l.row,index:l.index}),className:h}),s.map((t,n)=>e("text",{x:l.x+l.width/2,y:l.y+l.height/2+(n-(s.length-1)/2)*(Ee+2),textAnchor:"middle",dominantBaseline:"central",fontSize:Ee,fontWeight:0===n?500:400,fill:m,opacity:0===n?1:.85,pointerEvents:"none",className:0===n&&"treemap"===_?void 0:"tabular-nums",children:N(t,l.width-8,Ee)},n))]},`${l.row}-${l.index}`)}),"grid"!==_||O?.hidden?null:Pe.texts.map((t,l)=>e("text",{x:Ve.left-8,y:Ve.top+(l+.5)*Ve.height/Math.max(1,R.length),textAnchor:"end",dominantBaseline:"central",fontSize:Ee,fill:"var(--neba-muted-fg)",children:t},`row-${l}`)),"grid"!==_||J?.hidden?null:Ke.map((t,l)=>{const n=Ve.width/Math.max(1,be);if(l%Math.max(1,Math.ceil(Ue.room(Te)/Math.max(1,n)))!==0)return null;const a=Ve.left+(l+.5)*n,r=Ve.top+Ve.height+Ue.offset-6;return e("text",{x:a,y:r,textAnchor:Ue.anchor,transform:0===Ue.angle?void 0:`rotate(${Ue.angle} ${a} ${r})`,dominantBaseline:0===Ue.angle?void 0:"central",fontSize:Ee,fill:"var(--neba-muted-fg)",children:t},`col-${l}`)}),Oe?e("text",{x:Ve.left,y:Ee+2,textAnchor:"start",fontSize:Ee,fill:"var(--neba-muted-fg)",fontWeight:500,children:O?.label}):null,"grid"===_&&J?.label&&!J.hidden?e("text",{x:Ve.left+Ve.width,y:Ve.top+Ve.height+Ue.depth(Te)+Ee+8,textAnchor:"end",fontSize:Ee,fill:"var(--neba-muted-fg)",fontWeight:500,children:J.label}):null]}):null,et&&!Ie?De.render?e("div",{className:"pointer-events-none absolute z-10",style:{left:et.x+et.width/2,top:et.y},children:De.render({index:et.index,category:et.cell.x??ye[et.index]??et.index,items:tt})}):e(d,{heading:`${Me[et.row]} · ${Ye(et)}`,items:tt,x:et.x+et.width/2,y:et.y,flip:et.x+et.width/2>.6*me,size:re}):null]}),Fe?null:e(i,{id:ge,template:ue.summary,locale:X,...s(ve,we)}),Ie?null:e(r,{heading:et?`${Me[et.row]} · ${Ye(et)}`:void 0,items:tt})]})}function W(e,t,l){return Math.max(Math.abs(t-l),Math.abs(l-e))}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { type CartesianChartProps } from '../../internal/chart-frame.js';
|
|
3
3
|
import { type ChartMarkers } from '../../internal/chart-line.js';
|
|
4
|
-
import type { NebaChartCurve, NebaChartValueLabels } from '../../types.js';
|
|
4
|
+
import type { NebaChartCurve, NebaChartNulls, NebaChartValueLabels } from '../../types.js';
|
|
5
5
|
export interface LineChartProps extends CartesianChartProps {
|
|
6
6
|
/**
|
|
7
7
|
* How the line gets from one point to the next.
|
|
@@ -33,10 +33,21 @@ export interface LineChartProps extends CartesianChartProps {
|
|
|
33
33
|
*/
|
|
34
34
|
gradient?: boolean;
|
|
35
35
|
/**
|
|
36
|
-
*
|
|
36
|
+
* What the line does where a value is missing: break at it, bridge it, or
|
|
37
|
+
* read it as a nought.
|
|
37
38
|
*
|
|
38
|
-
*
|
|
39
|
-
*
|
|
39
|
+
* `gap` is the default and the honest one. `connect` is for a gap that came
|
|
40
|
+
* from the collection rather than from the world, and `zero` is for a count
|
|
41
|
+
* where a missing row really does mean none — it rewrites the data, so the
|
|
42
|
+
* axis, the tooltip and the table all say nought too.
|
|
43
|
+
* @default 'gap'
|
|
44
|
+
*/
|
|
45
|
+
nulls?: NebaChartNulls;
|
|
46
|
+
/**
|
|
47
|
+
* Draws the line straight through a `null` instead of breaking at it.
|
|
48
|
+
* @deprecated Pass `nulls="connect"`. `nulls` says the same thing and has a
|
|
49
|
+
* third answer this one cannot express; this is read only when `nulls` is
|
|
50
|
+
* left out.
|
|
40
51
|
* @default false
|
|
41
52
|
*/
|
|
42
53
|
connectNulls?: boolean;
|
|
@@ -71,4 +82,4 @@ export interface LineChartProps extends CartesianChartProps {
|
|
|
71
82
|
* from the shared frame, which is what makes a LineChart and a BarChart on one
|
|
72
83
|
* dashboard read as one drawing rather than two.
|
|
73
84
|
*/
|
|
74
|
-
export declare function LineChart({ curve, markers, gradient, connectNulls, valueLabels, stacked, ...props }: LineChartProps): React.JSX.Element;
|
|
85
|
+
export declare function LineChart({ curve, markers, gradient, nulls, connectNulls, valueLabels, stacked, series, ...props }: LineChartProps): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{CartesianChart as
|
|
1
|
+
"use client";import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{CartesianChart as n}from"../../internal/chart-frame.js";import{LineSeries as t}from"../../internal/chart-line.js";import{zeroGaps as a}from"../../internal/chart.js";export function LineChart({curve:o="linear",markers:s="auto",gradient:c=!1,nulls:i,connectNulls:l=!1,valueLabels:m="none",stacked:u=!1,series:d,...f}){const p=r.useId().replace(/:/g,""),h=i??(l?"connect":"gap"),j=r.useMemo(()=>"zero"===h?a(d):d,[d,h]);return e(n,{...f,series:j,stacked:u,inset:!0,includeZero:!1,headroom:"none"===m?0:10,children:r=>e(t,{context:r,curve:o,filled:!1,stacked:u,markers:s,valueLabels:m,connectNulls:"connect"===h,gradient:c,idPrefix:p})})}
|
|
@@ -60,10 +60,13 @@ export interface ContextMenuProps extends MenuSurfaceProps {
|
|
|
60
60
|
/** The rows, exactly as they are written inside a `Menu`. */
|
|
61
61
|
content: React.ReactNode;
|
|
62
62
|
/**
|
|
63
|
-
* The area that answers a right-click or a long press.
|
|
64
|
-
*
|
|
63
|
+
* The area that answers a right-click or a long press. Exactly one element,
|
|
64
|
+
* which must accept a ref and spread props — every Neba component does.
|
|
65
|
+
*
|
|
66
|
+
* Base UI's Trigger merges itself onto it rather than wrapping it, so the
|
|
67
|
+
* menu adds no element to the layout and the area stays whatever it was.
|
|
65
68
|
*/
|
|
66
|
-
children: React.
|
|
69
|
+
children: React.ReactElement;
|
|
67
70
|
open?: boolean;
|
|
68
71
|
defaultOpen?: boolean;
|
|
69
72
|
onOpenChange?: (open: boolean) => void;
|
|
@@ -222,10 +225,18 @@ export declare function Menu(rawProps: MenuProps): React.JSX.Element;
|
|
|
222
225
|
* The same menu, opened by a right-click or a long press instead of by a button.
|
|
223
226
|
*
|
|
224
227
|
* It takes the rows as `content` and the area as `children`, which is Tooltip's
|
|
225
|
-
* shape rather than Menu's — because here the trigger is
|
|
226
|
-
*
|
|
227
|
-
*
|
|
228
|
-
*
|
|
228
|
+
* shape rather than Menu's — because here the trigger is a region of the page
|
|
229
|
+
* rather than a control, and a region is almost always an element the caller
|
|
230
|
+
* already had: the table, the list, the box. So it is that element that answers
|
|
231
|
+
* the gesture. Base UI's Trigger merges onto it exactly as Tooltip's does, and
|
|
232
|
+
* the menu costs the layout nothing.
|
|
233
|
+
*
|
|
234
|
+
* That last part is not a nicety. The trigger is an element in the flow, so a
|
|
235
|
+
* box of Base UI's between a caller's scroll container and the thing inside it
|
|
236
|
+
* is a box with no height to scroll in, and the content spills instead.
|
|
237
|
+
*
|
|
238
|
+
* Base UI positions the popup at the pointer rather than against an anchor, and
|
|
239
|
+
* the long press is what makes it reachable on a touch screen at all.
|
|
229
240
|
*/
|
|
230
241
|
export declare function ContextMenu(rawProps: ContextMenuProps): React.JSX.Element;
|
|
231
242
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as n,Fragment as t}from"react/jsx-runtime";import*as l from"react";import{glowClasses as a,spotlightSlot as s,trackPointer as o}from"../../internal/glow.js";import{Menu as r}from"@base-ui/react/menu";import{useDirection as i}from"@base-ui/react/direction-provider";import{ContextMenu as c}from"@base-ui/react/context-menu";import{MenuContext as d}from"../../internal/menu.js";import{CheckIcon as u,ChevronIcon as m,DotIcon as p}from"../../internal/icons.js";import{safeHref as h,safeRel as f}from"../../internal/link.js";import{controlTextLeadingClasses as x,cx as b,gapClasses as g,hasContent as y,iconClasses as N,metaTextClasses as v,popupFadeClasses as C,radiusClasses as k,surfaceClasses as z,surfaceSlots as O,transitionClasses as M}from"../../internal/styles.js";import{useStyleDefaults as w}from"../../internal/defaults.js";const I=[z,"max-h-[min(24rem,var(--available-height))] min-w-40 overflow-y-auto overscroll-contain","border bg-(--n-panel-press) p-1","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]","[outline:none]",C].join(" "),P={default:{xs:"px-1.5 py-0.5",sm:"px-2 py-1",md:"px-2.5 py-1.5",lg:"px-3 py-2",xl:"px-3.5 py-2.5"},compact:{xs:"px-1 py-0.5",sm:"px-1.5 py-0.5",md:"px-2 py-1",lg:"px-2.5 py-1",xl:"px-3 py-1.5"}},j={xs:k.xs,sm:k.xs,md:k.sm,lg:k.sm,xl:k.md};function $(e,n,t,l,s){return b("relative flex w-full cursor-pointer items-center select-none",l?a:"",t?"text-(--n-on-tint)":"text-(--neba-fg)",P[n][e],j[e],g[e],x[e],M,N,"data-[highlighted]:bg-(--n-soft-hover)","data-[popup-open]:bg-(--n-soft)","data-[disabled]:cursor-not-allowed data-[disabled]:text-(--neba-disabled-fg)","[outline:none]",s??"")}const R="flex h-[1lh] w-[1.2em] shrink-0 items-center justify-center";function RowBody({children:t,description:l,size:a}){return y(l)?n("span",{className:"flex min-w-0 flex-1 flex-col text-start",children:[e("span",{className:"truncate",children:t}),e("span",{className:`truncate text-(--neba-muted-fg) ${v[a]}`,children:l})]}):e("span",{className:"min-w-0 flex-1 truncate text-start",children:t})}export function MenuItem({onClick:a,href:i,target:c,rel:u,startIcon:m,endIcon:p,shortcut:x,description:b,color:g,closeOnClick:N=!0,disabled:C=!1,label:k,children:z,className:M,style:w}){const I=l.useContext(d),{size:P,density:j}=I,B=n(t,{children:[y(m)?e("span",{className:`${R} text-(--neba-muted-fg)`,children:m}):null,e(RowBody,{description:b,size:P,children:z}),y(p)?e("span",{className:`${R} text-(--neba-muted-fg)`,children:p}):null,y(x)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${v[P]}`,children:x}):null]}),F={...g?O(g,0):void 0,...s,...w},G=h(i);return void 0===G||C?e(r.Item,{disabled:C,label:k,closeOnClick:N,onClick:a,className:$(P,j,Boolean(g),!C,M),style:F,onPointerMove:o(void 0,!C),children:B}):e(r.LinkItem,{href:G,target:c,rel:f(c,u),label:k,closeOnClick:N,onClick:a,className:$(P,j,Boolean(g),!C,M),style:F,onPointerMove:o(void 0,!0),children:B})}export function MenuCheckboxItem({checked:t,defaultChecked:a,onCheckedChange:i,endIcon:c,shortcut:m,description:p,color:h,closeOnClick:f=!1,disabled:x=!1,label:b,children:g,className:N,style:C}){const{size:k,density:z}=l.useContext(d),M=h?O(h,0):void 0;return n(r.CheckboxItem,{checked:t,defaultChecked:a,onCheckedChange:e=>i?.(e),disabled:x,label:b,closeOnClick:f,className:$(k,z,Boolean(h),!x,N),style:{...M,...s,...C},onPointerMove:o(void 0,!x),children:[e("span",{className:`${R} text-(--n-accent)`,children:e(r.CheckboxItemIndicator,{className:"flex items-center justify-center",children:e(u,{})})}),e(RowBody,{description:p,size:k,children:g}),y(c)?e("span",{className:`${R} text-(--neba-muted-fg)`,children:c}):null,y(m)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${v[k]}`,children:m}):null]})}export function MenuRadioGroup({value:n,defaultValue:t,onValueChange:l,disabled:a=!1,children:s,className:o}){return e(r.RadioGroup,{value:n,defaultValue:t,onValueChange:e=>l?.(e),disabled:a,className:o,children:s})}export function MenuRadioItem({value:t,endIcon:a,shortcut:i,description:c,color:u,closeOnClick:m=!1,disabled:h=!1,label:f,children:x,className:b,style:g}){const{size:N,density:C}=l.useContext(d),k=u?O(u,0):void 0;return n(r.RadioItem,{value:t,disabled:h,label:f,closeOnClick:m,className:$(N,C,Boolean(u),!h,b),style:{...k,...s,...g},onPointerMove:o(void 0,!h),children:[e("span",{className:`${R} text-(--n-accent)`,children:e(r.RadioItemIndicator,{className:"flex items-center justify-center",children:e(p,{})})}),e(RowBody,{description:c,size:N,children:x}),y(a)?e("span",{className:`${R} text-(--neba-muted-fg)`,children:a}):null,y(i)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${v[N]}`,children:i}):null]})}export function MenuGroup({label:t,children:a,className:s}){const{size:o,density:i}=l.useContext(d);return n(r.Group,{className:s,children:[y(t)?e(r.GroupLabel,{className:[P[i][o],v[o],"font-semibold tracking-wide text-(--neba-muted-fg) uppercase"].join(" "),children:t}):null,a]})}export function MenuSeparator({className:n,...t}){return e(r.Separator,{className:b("-mx-1 my-1 h-px bg-(--n-line)",n??""),...t})}export function MenuSubmenu({label:t,startIcon:a,disabled:c=!1,side:u,sideOffset:p=4,children:h,className:f,style:g}){const N=l.useContext(d),{size:v,density:C,color:z}=N,M=i();return n(r.SubmenuRoot,{children:[n(r.SubmenuTrigger,{disabled:c,className:$(v,C,!1,!c),style:s,onPointerMove:o(void 0,!c),children:[y(a)?e("span",{className:`${R} text-(--neba-muted-fg)`,children:a}):null,e("span",{className:"min-w-0 flex-1 truncate text-start",children:t}),e("span",{className:`${R} text-(--neba-muted-fg) ${"rtl"===M?"rotate-90":"-rotate-90"}`,children:e(m,{})})]}),e(r.Portal,{children:e(r.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",side:u??"inline-end",sideOffset:p,align:"start",children:e(r.Popup,{className:b(I,k[v],x[v],f??""),style:{...O(z,3),...g},children:h})})})]})}export function Menu(t){const{size:a="md",color:s="primary",density:o="default",trigger:i,open:c,defaultOpen:u,onOpenChange:m,side:p="bottom",align:h="start",sideOffset:f=6,modal:g,openOnHover:y=!1,loopFocus:N=!0,disabled:v=!1,className:C,style:z,children:M}=w(t,["size","density"]),P=l.useMemo(()=>({size:a,color:s,density:o}),[a,s,o]);return e(d.Provider,{value:P,children:n(r.Root,{open:c,defaultOpen:u,onOpenChange:e=>m?.(e),modal:g,loopFocus:N,disabled:v,children:[i?e(r.Trigger,{render:i,openOnHover:y,disabled:v}):null,e(r.Portal,{children:e(r.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",side:p,align:h,sideOffset:f,children:e(r.Popup,{className:b(I,k[a],x[a],C??""),style:{...O(s,3),...z},children:M})})})]})})}export function ContextMenu(t){const{size:a="md",color:s="primary",density:o="default",content:r,children:i,open:u,defaultOpen:m,onOpenChange:p,loopFocus:h=!0,disabled:f=!1,className:g,style:y}=w(t,["size","density"]),N=l.useMemo(()=>({size:a,color:s,density:o}),[a,s,o]);return e(d.Provider,{value:N,children:n(c.Root,{open:u,defaultOpen:m,onOpenChange:e=>p?.(e),loopFocus:h,disabled:f,children:[e(c.Trigger,{
|
|
1
|
+
"use client";import{jsx as e,jsxs as n,Fragment as t}from"react/jsx-runtime";import*as l from"react";import{glowClasses as a,spotlightSlot as s,trackPointer as o}from"../../internal/glow.js";import{Menu as r}from"@base-ui/react/menu";import{useDirection as i}from"@base-ui/react/direction-provider";import{ContextMenu as c}from"@base-ui/react/context-menu";import{MenuContext as d}from"../../internal/menu.js";import{CheckIcon as u,ChevronIcon as m,DotIcon as p}from"../../internal/icons.js";import{safeHref as h,safeRel as f}from"../../internal/link.js";import{controlTextLeadingClasses as x,cx as b,gapClasses as g,hasContent as y,iconClasses as N,metaTextClasses as v,popupFadeClasses as C,radiusClasses as k,surfaceClasses as z,surfaceSlots as O,transitionClasses as M}from"../../internal/styles.js";import{useStyleDefaults as w}from"../../internal/defaults.js";const I=[z,"max-h-[min(24rem,var(--available-height))] min-w-40 overflow-y-auto overscroll-contain","border bg-(--n-panel-press) p-1","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]","[outline:none]",C].join(" "),P={default:{xs:"px-1.5 py-0.5",sm:"px-2 py-1",md:"px-2.5 py-1.5",lg:"px-3 py-2",xl:"px-3.5 py-2.5"},compact:{xs:"px-1 py-0.5",sm:"px-1.5 py-0.5",md:"px-2 py-1",lg:"px-2.5 py-1",xl:"px-3 py-1.5"}},j={xs:k.xs,sm:k.xs,md:k.sm,lg:k.sm,xl:k.md};function $(e,n,t,l,s){return b("relative flex w-full cursor-pointer items-center select-none",l?a:"",t?"text-(--n-on-tint)":"text-(--neba-fg)",P[n][e],j[e],g[e],x[e],M,N,"data-[highlighted]:bg-(--n-soft-hover)","data-[popup-open]:bg-(--n-soft)","data-[disabled]:cursor-not-allowed data-[disabled]:text-(--neba-disabled-fg)","[outline:none]",s??"")}const R="flex h-[1lh] w-[1.2em] shrink-0 items-center justify-center";function RowBody({children:t,description:l,size:a}){return y(l)?n("span",{className:"flex min-w-0 flex-1 flex-col text-start",children:[e("span",{className:"truncate",children:t}),e("span",{className:`truncate text-(--neba-muted-fg) ${v[a]}`,children:l})]}):e("span",{className:"min-w-0 flex-1 truncate text-start",children:t})}export function MenuItem({onClick:a,href:i,target:c,rel:u,startIcon:m,endIcon:p,shortcut:x,description:b,color:g,closeOnClick:N=!0,disabled:C=!1,label:k,children:z,className:M,style:w}){const I=l.useContext(d),{size:P,density:j}=I,B=n(t,{children:[y(m)?e("span",{className:`${R} text-(--neba-muted-fg)`,children:m}):null,e(RowBody,{description:b,size:P,children:z}),y(p)?e("span",{className:`${R} text-(--neba-muted-fg)`,children:p}):null,y(x)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${v[P]}`,children:x}):null]}),F={...g?O(g,0):void 0,...s,...w},G=h(i);return void 0===G||C?e(r.Item,{disabled:C,label:k,closeOnClick:N,onClick:a,className:$(P,j,Boolean(g),!C,M),style:F,onPointerMove:o(void 0,!C),children:B}):e(r.LinkItem,{href:G,target:c,rel:f(c,u),label:k,closeOnClick:N,onClick:a,className:$(P,j,Boolean(g),!C,M),style:F,onPointerMove:o(void 0,!0),children:B})}export function MenuCheckboxItem({checked:t,defaultChecked:a,onCheckedChange:i,endIcon:c,shortcut:m,description:p,color:h,closeOnClick:f=!1,disabled:x=!1,label:b,children:g,className:N,style:C}){const{size:k,density:z}=l.useContext(d),M=h?O(h,0):void 0;return n(r.CheckboxItem,{checked:t,defaultChecked:a,onCheckedChange:e=>i?.(e),disabled:x,label:b,closeOnClick:f,className:$(k,z,Boolean(h),!x,N),style:{...M,...s,...C},onPointerMove:o(void 0,!x),children:[e("span",{className:`${R} text-(--n-accent)`,children:e(r.CheckboxItemIndicator,{className:"flex items-center justify-center",children:e(u,{})})}),e(RowBody,{description:p,size:k,children:g}),y(c)?e("span",{className:`${R} text-(--neba-muted-fg)`,children:c}):null,y(m)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${v[k]}`,children:m}):null]})}export function MenuRadioGroup({value:n,defaultValue:t,onValueChange:l,disabled:a=!1,children:s,className:o}){return e(r.RadioGroup,{value:n,defaultValue:t,onValueChange:e=>l?.(e),disabled:a,className:o,children:s})}export function MenuRadioItem({value:t,endIcon:a,shortcut:i,description:c,color:u,closeOnClick:m=!1,disabled:h=!1,label:f,children:x,className:b,style:g}){const{size:N,density:C}=l.useContext(d),k=u?O(u,0):void 0;return n(r.RadioItem,{value:t,disabled:h,label:f,closeOnClick:m,className:$(N,C,Boolean(u),!h,b),style:{...k,...s,...g},onPointerMove:o(void 0,!h),children:[e("span",{className:`${R} text-(--n-accent)`,children:e(r.RadioItemIndicator,{className:"flex items-center justify-center",children:e(p,{})})}),e(RowBody,{description:c,size:N,children:x}),y(a)?e("span",{className:`${R} text-(--neba-muted-fg)`,children:a}):null,y(i)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${v[N]}`,children:i}):null]})}export function MenuGroup({label:t,children:a,className:s}){const{size:o,density:i}=l.useContext(d);return n(r.Group,{className:s,children:[y(t)?e(r.GroupLabel,{className:[P[i][o],v[o],"font-semibold tracking-wide text-(--neba-muted-fg) uppercase"].join(" "),children:t}):null,a]})}export function MenuSeparator({className:n,...t}){return e(r.Separator,{className:b("-mx-1 my-1 h-px bg-(--n-line)",n??""),...t})}export function MenuSubmenu({label:t,startIcon:a,disabled:c=!1,side:u,sideOffset:p=4,children:h,className:f,style:g}){const N=l.useContext(d),{size:v,density:C,color:z}=N,M=i();return n(r.SubmenuRoot,{children:[n(r.SubmenuTrigger,{disabled:c,className:$(v,C,!1,!c),style:s,onPointerMove:o(void 0,!c),children:[y(a)?e("span",{className:`${R} text-(--neba-muted-fg)`,children:a}):null,e("span",{className:"min-w-0 flex-1 truncate text-start",children:t}),e("span",{className:`${R} text-(--neba-muted-fg) ${"rtl"===M?"rotate-90":"-rotate-90"}`,children:e(m,{})})]}),e(r.Portal,{children:e(r.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",side:u??"inline-end",sideOffset:p,align:"start",children:e(r.Popup,{className:b(I,k[v],x[v],f??""),style:{...O(z,3),...g},children:h})})})]})}export function Menu(t){const{size:a="md",color:s="primary",density:o="default",trigger:i,open:c,defaultOpen:u,onOpenChange:m,side:p="bottom",align:h="start",sideOffset:f=6,modal:g,openOnHover:y=!1,loopFocus:N=!0,disabled:v=!1,className:C,style:z,children:M}=w(t,["size","density"]),P=l.useMemo(()=>({size:a,color:s,density:o}),[a,s,o]);return e(d.Provider,{value:P,children:n(r.Root,{open:c,defaultOpen:u,onOpenChange:e=>m?.(e),modal:g,loopFocus:N,disabled:v,children:[i?e(r.Trigger,{render:i,openOnHover:y,disabled:v}):null,e(r.Portal,{children:e(r.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",side:p,align:h,sideOffset:f,children:e(r.Popup,{className:b(I,k[a],x[a],C??""),style:{...O(s,3),...z},children:M})})})]})})}export function ContextMenu(t){const{size:a="md",color:s="primary",density:o="default",content:r,children:i,open:u,defaultOpen:m,onOpenChange:p,loopFocus:h=!0,disabled:f=!1,className:g,style:y}=w(t,["size","density"]),N=l.useMemo(()=>({size:a,color:s,density:o}),[a,s,o]);return e(d.Provider,{value:N,children:n(c.Root,{open:u,defaultOpen:m,onOpenChange:e=>p?.(e),loopFocus:h,disabled:f,children:[e(c.Trigger,{render:i}),e(c.Portal,{children:e(c.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",children:e(c.Popup,{className:b(I,k[a],x[a],g??""),style:{...O(s,3),...y},children:r})})})]})})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{NumberField as n}from"@base-ui/react/number-field";import{Field as l}from"@base-ui/react/field";import{numberMessages as r,useMessages as i}from"../../internal/i18n.js";import{MinusIcon as s,PlusIcon as o}from"../../internal/icons.js";import{keyHandler as c}from"../../internal/keys.js";import{controlTextLeadingClasses as d,cx as m,disabledClasses as u,fieldFocusTransitionClasses as p,fieldHeightClasses as f,fieldReadOnlyClasses as b,fieldRestClasses as h,fieldRingClasses as g,gapClasses as x,hasContent as v,iconClasses as N,metaTextClasses as y,paddingXClasses as j,radiusClasses as w,stackGapClasses as k,surfaceSlots as _,transitionClasses as S}from"../../internal/styles.js";import{useStyleDefaults as V}from"../../internal/defaults.js";import{
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{NumberField as n}from"@base-ui/react/number-field";import{Field as l}from"@base-ui/react/field";import{numberMessages as r,useMessages as i}from"../../internal/i18n.js";import{MinusIcon as s,PlusIcon as o}from"../../internal/icons.js";import{keyHandler as c}from"../../internal/keys.js";import{controlTextLeadingClasses as d,cx as m,disabledClasses as u,fieldFocusTransitionClasses as p,fieldHeightClasses as f,fieldReadOnlyClasses as b,fieldRestClasses as h,fieldRingClasses as g,gapClasses as x,hasContent as v,iconClasses as N,metaTextClasses as y,paddingXClasses as j,radiusClasses as w,stackGapClasses as k,surfaceSlots as _,transitionClasses as S}from"../../internal/styles.js";import{useStyleDefaults as V}from"../../internal/defaults.js";import{fieldLight as z,fieldSpotlightSlot as C,glowClasses as I}from"../../internal/glow.js";import{useFieldsetDisabled as O}from"../../internal/fieldset.js";const D=["group relative flex w-full items-center","[-webkit-tap-highlight-color:transparent]",S,p,g,N].join(" "),F=["relative inline-flex size-[1.7em] shrink-0 cursor-pointer items-center justify-center","neba-hit-row","rounded-(--neba-radius-xs) text-(--neba-muted-fg) select-none","[&_svg]:size-[0.9em] [&_svg]:shrink-0","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]","[transition:background-color_var(--neba-duration)_var(--neba-ease),color_var(--neba-duration)_var(--neba-ease)]","active:[transition-duration:0ms]","hover:bg-(--n-soft) hover:text-(--n-on-tint)","active:bg-(--n-soft-press)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1","disabled:cursor-not-allowed disabled:bg-transparent disabled:text-(--neba-disabled-fg)"].join(" ");export const NumberField=/*@__PURE__*/a.forwardRef(function NumberField(a,p){const{variant:g="outline",size:N="md",color:S="primary",density:L="default",elevation:R=0,value:$,defaultValue:q,onValueChange:W,onValueCommitted:B,min:E,max:G,step:K,largeStep:A,smallStep:H,snapOnStep:J,wheel:M=!0,format:P,locale:Q,steppers:T="end",incrementLabel:U,decrementLabel:X,label:Y,description:Z,error:ee,invalid:te,startIcon:ae,endIcon:ne,fullWidth:le=!1,disabled:re,readOnly:ie=!1,required:se=!1,name:oe,placeholder:ce,id:de,className:me,classNames:ue,shortcuts:pe,style:fe,"aria-label":be,"aria-labelledby":he,...ge}=V(a,["size","density","variant","locale"]),xe=O(re),ve=!xe&&!ie,Ne=i(r,"string"==typeof Q?Q:void 0),ye=v(ee),je=te??ye,we=je?"danger":S,ke=j[L][N],_e={end:`${ke} pe-1`,split:"px-1",none:ke},Se=e(n.Decrement,{"aria-label":X??Ne.decrease,className:m(F,ue?.stepper),children:e(s,{})}),Ve=e(n.Increment,{"aria-label":U??Ne.increase,className:m(F,ue?.stepper),children:e(o,{})}),ze="none"!==T&&!ie;return t(l.Root,{disabled:xe,invalid:je,className:m("flex-col align-top",k[N],le?"flex w-full":"inline-flex",me??""),style:{..._(we,R),...ve?C:void 0,...fe},...ge,children:[Y?e(l.Label,{className:m(y[N],"font-medium",xe?"text-(--neba-disabled-fg)":"text-(--neba-fg)",ue?.label),children:Y}):null,e(n.Root,{id:de,name:oe,className:"contents",value:$,defaultValue:q,onValueChange:e=>W?.(e),onValueCommitted:e=>B?.(e),min:E,max:G,step:K,largeStep:A,smallStep:H,snapOnStep:J,allowWheelScrub:M,format:P,locale:Q,disabled:xe,readOnly:ie,required:se,children:t(n.Group,{...z(ve),className:m(D,f[N],d[N],w[N],x[N],ze?_e[T]:ke,xe?u[g]:ie?b[g]:`${h[g]} ${I}`,xe?"":"cursor-text",ue?.shell),children:[ze&&"split"===T?Se:null,ae?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:ae}):null,e(n.Input,{ref:p,"aria-label":be,"aria-labelledby":he,onKeyDown:c(pe),placeholder:ce,className:["neba-input min-w-0 flex-1 self-stretch bg-transparent [font:inherit] text-inherit","[outline:none]","tabular-nums","split"===T&&ze?"text-center":"","placeholder:text-(--neba-muted-fg)","caret-(--n-accent) selection:bg-(--n-soft-press)","disabled:cursor-not-allowed",ue?.control].filter(Boolean).join(" ")}),ne?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:ne}):null,ze&&"end"===T?t("span",{className:"flex shrink-0 items-center gap-0.5",style:{"--n-hit-gap":"0.125rem"},children:[Se,Ve]}):null,ze&&"split"===T?Ve:null]})}),Z?e(l.Description,{className:m(y[N],"text-(--neba-muted-fg)",ue?.description),children:Z}):null,e(l.Error,ye?{match:!0,className:m(y[N],"text-(--n-accent)",ue?.error),children:ee}:{className:m(y[N],"text-(--n-accent)",ue?.error)})]})});
|
|
@@ -26,6 +26,35 @@ export interface PieChartProps extends ChartBaseProps {
|
|
|
26
26
|
* @default 0
|
|
27
27
|
*/
|
|
28
28
|
startAngle?: number;
|
|
29
|
+
/**
|
|
30
|
+
* How much of the middle is cut out, as a fraction of the radius, from `0`
|
|
31
|
+
* for a filled disc to `0.92` for a hairline ring.
|
|
32
|
+
*
|
|
33
|
+
* `shape` already sets it — `0` for a `pie`, `0.62` for a `donut` and a
|
|
34
|
+
* `semi` — and this is the dial behind that, for the ring that has to be
|
|
35
|
+
* thinner or thicker than the house one. A `pie` given a hole is a donut, so
|
|
36
|
+
* reach for `shape` first and for this only when the default ring is the
|
|
37
|
+
* wrong weight: a thin one reads as a progress track and a thick one as a
|
|
38
|
+
* pie with a hole punched in it.
|
|
39
|
+
*
|
|
40
|
+
* `center` needs a hole to sit in, so setting one is also how a `pie` gets a
|
|
41
|
+
* readout in the middle.
|
|
42
|
+
* @default 0 for `pie`, 0.62 for `donut` and `semi`
|
|
43
|
+
*/
|
|
44
|
+
hole?: number;
|
|
45
|
+
/**
|
|
46
|
+
* The surface showing between two touching slices, in pixels.
|
|
47
|
+
*
|
|
48
|
+
* A constant on screen and not in the data, which is why it is a length: the
|
|
49
|
+
* gap is what separates two slices of the same hue family, and an angle that
|
|
50
|
+
* looked right on a 300px chart is a wedge out of a 60px one. `0` closes it,
|
|
51
|
+
* and the slices then meet at a hairline the eye has to find on its own.
|
|
52
|
+
*
|
|
53
|
+
* It is never taken off a slice too narrow to spare it, so a one-degree
|
|
54
|
+
* sliver stays a sliver rather than inverting.
|
|
55
|
+
* @default 2
|
|
56
|
+
*/
|
|
57
|
+
gap?: number;
|
|
29
58
|
/**
|
|
30
59
|
* What goes in the hole. A `donut` or a `semi` with nothing in the middle is
|
|
31
60
|
* a pie with a bite out of it; the total, or the one figure the chart is
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as t from"react";import{ChartDataTable as n,
|
|
1
|
+
"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as t from"react";import{ChartDataTable as n,ChartExport as a,ChartLegendBar as i,ChartStatus as r,ChartSummary as o,ChartSurface as s,ChartTooltipPanel as u,markTransitionClasses as d,summarise as m,useMeasuredWidth as c,useReleaseOutside as h,useVisibility as f,chartHeight as v,useMeasuredHeight as p}from"../../internal/chart-frame.js";import{arcPath as x,categoryAt as g,chartFontSizes as b,compactNumber as y,formatCategory as M,inkOn as N,markGap as j,seriesColor as w,toValue as k,warnPaletteOverflow as E}from"../../internal/chart.js";import{numberFormatter as I}from"../../internal/format.js";import{cx as z,metaTextClasses as P}from"../../internal/styles.js";import{chartMessages as A,emptyMessages as $,useMessages as L}from"../../internal/i18n.js";import{useStyleDefaults as S}from"../../internal/defaults.js";const B={pie:0,donut:.62,semi:.62};export function PieChart(C){const{data:R,categories:D,shape:O="pie",startAngle:_=0,hole:F,gap:H=j,center:K,valueLabels:T="none",height:V,format:W,locale:q,label:G,legend:J,tooltip:Q,empty:U,exportable:X=!1,exportFileName:Y="chart.csv",onExport:Z,size:ee="md",variant:le="text",padded:te=!1,className:ne,...ae}=S(C,["size","variant","locale"]),ie=t.useRef(null),re=c(ie),oe=L($,q),se=L(A,q),ue=t.useId(),de=t.useCallback(e=>W?I(q,W).format(e):y(e,q),[W,q]),me=t.useMemo(()=>R.map(k),[R]),ce=t.useMemo(()=>me.map((e,l)=>({name:M(g(l,D,[me]),q),data:[R[l]],color:e.color})),[me,D,R,q]),he=f(ce);t.useEffect(()=>{E(ce.length)},[ce.length]);const[fe,ve]=t.useState(null);h(ie,null!==fe,()=>ve(null));const pe=t.useId(),xe=ce.map((e,l)=>w(e,l)),ge=me.reduce((e,l,t)=>he.visible[t]&&null!==l.value?e+Math.max(0,l.value):e,0),be="semi"===O,ye=p(ie,"string"==typeof V),Me=v(V,ee,ye),Ne=b[ee],je=!1===J?{interactive:!1}:!0===J||void 0===J?{}:J,we=!1!==J&&ce.length>1,ke=je.side??"bottom",Ee=!1===Q?{mode:"none"}:!0===Q||void 0===Q?{}:Q,Ie="none"===Ee.mode,ze=re/2,Pe=Math.max(0,Math.min(re/2,be?Me:Me/2)-2),Ae=be?Math.min(Me,Me/2+Pe/2):Me/2,$e=Pe*Math.min(.92,Math.max(0,F??B[O])),Le=ge<=0||Pe<=0,Se=Pe>0?Math.min(15,Math.max(0,H)/Pe*(180/Math.PI)):0,Be=be?180:360,Ce=[];let Re=be?-90:_;me.forEach((e,l)=>{if(!he.visible[l]||null===e.value||e.value<=0)return;const t=e.value/ge,n=t*Be;Ce.push({index:l,start:Re,end:Re+n,value:e.value,share:t}),Re+=n});const De=null===fe?[]:[{seriesIndex:fe,name:ce[fe]?.name,color:me[fe]?.color??xe[fe],value:me[fe]?.value??null,formatted:`${de(me[fe]?.value??0)} · ${Math.round(10*(Math.max(0,me[fe]?.value??0)/ge*100+Number.EPSILON))/10}%`,label:me[fe]?.label}];return l(s,{...ae,size:ee,variant:le,padded:te,className:ne,legendSide:ke,legend:we?e(i,{series:ce,colors:xe,options:je,visibility:he,size:ee,values:je.showValue?me.map(e=>null===e.value?void 0:de(e.value)):void 0}):null,table:Le?null:e(n,{id:ue,caption:G,categories:ce.map(e=>e.name??""),series:[{name:G,data:R}],values:[me],format:de,locale:q}),children:[X&&!Le?e(a,{rows:()=>[["",G??se.label],...ce.map((e,l)=>[e.name??"",me[l]?.value??null])],fileName:Y,onExport:Z,label:se.exportCsv}):null,l("div",{ref:ie,role:"img",tabIndex:Le?void 0:0,"aria-label":G??se.label,"aria-describedby":Le?void 0:pe,onPointerLeave:e=>{"touch"!==e.pointerType&&ve(null)},onBlur:()=>ve(null),onKeyDown:e=>{const l=Ce.map(e=>e.index);if("Escape"===e.key){if(null===fe)return;ve(null)}else{if(Ie||0===l.length)return;if("Home"===e.key)ve(l[0]);else if("End"===e.key)ve(l[l.length-1]);else{if("ArrowRight"!==e.key&&"ArrowLeft"!==e.key)return;{const t=null===fe?-1:l.indexOf(fe),n="ArrowRight"===e.key?t+1:t-1;ve(l[(n+l.length)%l.length])}}}e.preventDefault()},className:z("relative w-full rounded-(--neba-radius-xs)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"),style:{height:"string"==typeof V?V:Me},children:[Le?e("div",{className:z("flex h-full items-center justify-center text-(--neba-muted-fg)",P[ee]),children:U??oe.title}):re>0?l("svg",{width:re,height:Me,viewBox:`0 0 ${re} ${Me}`,"aria-hidden":"true",className:"block",children:[Ce.map(l=>{const t=null!==he.hovered&&he.hovered!==l.index||null!==fe&&fe!==l.index,n=l.end-l.start>2*Se?Se/2:0;return e("path",{d:x(ze,Ae,Pe,$e,l.start+n,l.end-n),fill:me[l.index].color??xe[l.index],opacity:t?.32:1,onPointerEnter:Ie?void 0:()=>ve(l.index),className:d},l.index)}),"all"===T?Ce.map(l=>{const t=((l.start+l.end)/2-90)*(Math.PI/180),n=$e>0?($e+Pe)/2:.68*Pe,a=`${Math.round(100*l.share)}%`;return(l.end-l.start)*(Math.PI/180)*n<2*Ne||Pe-$e<1.6*Ne?null:e("text",{x:ze+n*Math.cos(t),y:Ae+n*Math.sin(t),textAnchor:"middle",dominantBaseline:"central",fontSize:Ne,fontWeight:600,fill:N(me[l.index].color,l.index),className:"tabular-nums",children:a},l.index)}):null]}):null,K&&$e>0?e("div",{className:"pointer-events-none absolute flex flex-col items-center justify-center text-center",style:{left:ze-$e,top:Ae-$e,width:2*$e,height:be?$e:2*$e},children:K}):null,null===fe||Ie?null:Ee.render?e("div",{className:"pointer-events-none absolute top-0 left-1/2 z-10",children:Ee.render({index:fe,category:ce[fe]?.name??fe,items:De})}):e(u,{heading:ce[fe]?.name,items:De,x:ze,y:8,flip:!1,size:ee})]}),Le?null:e(o,{id:pe,template:se.summary,locale:q,...m(me.filter((e,l)=>he.visible[l]).map(e=>[e]),de)}),Ie?null:e(r,{heading:null===fe?void 0:ce[fe]?.name,items:De})]})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{IconButton as r}from"../icon-button/IconButton.js";import{useDropZone as l}from"../../internal/drop.js";import{
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{IconButton as r}from"../icon-button/IconButton.js";import{useDropZone as l}from"../../internal/drop.js";import{fieldLight as o,fieldSpotlightSlot as a,glowClasses as i}from"../../internal/glow.js";import{matchesShortcut as s}from"../../internal/keys.js";import{promptMessages as c,useMessages as m}from"../../internal/i18n.js";import{controlTextLeadingClasses as d,cx as u,disabledClasses as f,fieldFocusTransitionClasses as p,fieldReadOnlyClasses as h,fieldRestClasses as g,fieldRingClasses as x,hasContent as v,iconClasses as b,metaTextClasses as w,paddingXClasses as y,radiusClasses as $,srOnlyClasses as j,surfaceSlots as N,transitionClasses as k}from"../../internal/styles.js";import{useStyleDefaults as I}from"../../internal/defaults.js";import{useFieldsetDisabled as S}from"../../internal/fieldset.js";function SendIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:e("path",{d:"M8 13V3.5m0 0L3.75 7.75M8 3.5l4.25 4.25",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})})}function StopIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:e("rect",{x:"4",y:"4",width:"8",height:"8",rx:"1.5"})})}const C={xs:`${$.sm} ${d.xs}`,sm:`${$.md} ${d.sm}`,md:`${$.lg} ${d.md}`,lg:`${$.xl} ${d.lg}`,xl:`${$.xl} ${d.xl}`},D={xs:"gap-1",sm:"gap-1.5",md:"gap-2",lg:"gap-2.5",xl:"gap-3"};export const PromptInput=/*@__PURE__*/n.forwardRef(function PromptInput(d,$){const{variant:z="outline",size:L="md",color:M="primary",density:R="default",elevation:B=0,value:E,defaultValue:K="",onValueChange:P,onSubmit:V,submitting:F=!1,onStop:O,submitKey:H="Enter",onFiles:T,label:W,minRows:q=1,maxRows:A=8,start:G,end:J,locale:Q,labels:U,classNames:X,disabled:Y,readOnly:Z=!1,onKeyDown:_,className:ee,style:te,children:ne,...re}=I(d,["size","density","variant","locale"]),le=S(Y),oe=!le&&!Z,ae={...m(c,Q),...U},[ie,se]=n.useState(K),ce=void 0!==E,me=ce?E:ie,{over:de,handlers:ue}=l(T),fe=n.useId(),pe=n.useRef(null),he=n.useCallback(e=>{pe.current=e,"function"==typeof $?$(e):$&&($.current=e)},[$]);n.useLayoutEffect(()=>{const e=pe.current;e&&(e.style.height="auto",e.style.height=`${e.scrollHeight}px`)},[me]);const ge=()=>{!me.trim()||le||Z||F||V?.(me)},xe=me.trim().length>0&&!le&&!Z;return t("form",{onSubmit:e=>{e.preventDefault(),ge()},className:u("flex w-full flex-col",ee??""),style:{...N(M,B),...oe?a:void 0,...te},children:[v(W)?e("label",{htmlFor:fe,className:j,children:W}):null,t("div",{"data-dropping":de||void 0,...ue,...o(oe),onPointerDown:e=>{e.target!==e.currentTarget||le||(e.preventDefault(),pe.current?.focus())},className:u("relative flex w-full flex-col py-2","[-webkit-tap-highlight-color:transparent]",C[L],D[L],y[R][L],k,p,x,b,le?f[z]:Z?h[z]:`${g[z]} ${i}`,de?"[border-color:var(--n-ring)] bg-(--n-soft)":"",X?.shell??""),children:[ne,e("textarea",{ref:he,id:fe,rows:q,value:me,disabled:le,readOnly:Z,onChange:e=>{ce||se(e.target.value),P?.(e.target.value)},className:u("neba-input block w-full resize-none bg-transparent [font:inherit] text-inherit","[outline:none]","min-h-(--n-min-rows) max-h-(--n-max-rows) overflow-y-auto","placeholder:text-(--neba-muted-fg)","caret-(--n-accent) selection:bg-(--n-soft-press)","disabled:cursor-not-allowed",X?.control??""),style:{"--n-min-rows":`calc(${Math.max(q,1)} * 1lh)`,"--n-max-rows":`calc(${Math.max(A,q,1)} * 1lh)`},...re,onKeyDown:e=>{!e.nativeEvent.isComposing&&s(e,H)&&(e.preventDefault(),ge()),_?.(e)}}),t("div",{className:u("flex min-w-0 items-center gap-2",w[L],X?.toolbar??""),children:[v(G)?e("div",{className:"flex min-w-0 items-center gap-1",children:G}):null,t("div",{className:"ms-auto flex shrink-0 items-center gap-2",children:[v(J)?e("div",{className:"flex items-center gap-1",children:J}):null,e(r,{type:F?"button":"submit",size:L,color:M,icon:e(F?StopIcon:SendIcon,{}),label:F?ae.stop:ae.send,disabled:!F&&!xe,onClick:F?O:void 0,className:X?.send})]})]}),de?e("div",{"aria-hidden":"true",className:u("pointer-events-none absolute inset-0 flex items-center justify-center","font-medium text-(--n-accent)",C[L]),children:ae.drop}):null]})]})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as t from"react";import{CartesianChart as a,markTransitionClasses as l}from"../../internal/chart-frame.js";import{bubbleRadius as i,formatCategory as s,markerRadii as o,markGap as n,markPath as c,markShapes as u,plotHeights as d,pointX as m}from"../../internal/chart.js";import{numberFormatter as h}from"../../internal/format.js";import{chartMessages as f,useMessages as p}from"../../internal/i18n.js";import{cx as x,srOnlyClasses as b}from"../../internal/styles.js";import{useStyleDefaults as v}from"../../internal/defaults.js";export function ScatterChart(r){const{shape:l="auto",pointRadius:s,maxRadius:n,series:h,categories:f,size:p="md",xAxis:x,...b}=v(r,["size","locale"]),g=s??o[p],z=n??Math.max(g+2,("number"==typeof b.height?b.height:d[p])/12),j=h.reduce((e,r)=>r.color?e:e+1,0),k="auto"===l||"varied"===l?"circle":l,M="varied"===l||"auto"===l&&j>3,S=t.useCallback(e=>M?u[e%u.length]:k,[M,k]),$=t.useCallback(e=>{const r=[];let t=0;return e.values.forEach(e=>{e.forEach(e=>{null!==e.value&&void 0!==e.z&&Number.isFinite(e.z)&&(t=Math.max(t,e.z))})}),e.values.forEach((a,l)=>{e.visible[l]&&a.forEach((a,s)=>{if(null===a.value)return;const o=m(a,s,f);null!==o&&r.push({series:l,index:s,x:e.categoryValuePx(o),y:e.valuePx(a.value),r:void 0===a.z?g:i(a.z,t,z,2)})})}),r},[f,g,z]);return e(a,{...b,series:h,categories:f,size:p,xScale:"value",xAxis:x,marks:$,markInset:z,includeZero:!1,swatch:(r,t)=>e("svg",{viewBox:"0 0 10 10",className:"size-2.5 overflow-visible","aria-hidden":"true",children:e("path",{d:c(S(r),5,5,4),fill:t})}),table:(r,t)=>e(y,{id:r,series:h,categories:f,label:b.label,xLabel:x?.label,yLabel:b.yAxis?.label,locale:b.locale,format:t}),children:r=>e(ScatterMarks,{context:r,shapeOf:S})})}function ScatterMarks({context:r,shapeOf:a}){const{marks:i,values:s,colors:o,hovered:u,activeMark:d}=r,m=t.useMemo(()=>[...i].sort((e,r)=>r.r-e.r),[i]);return e("g",{children:m.map(r=>{const t=s[r.series]?.[r.index],i=null!==u&&u!==r.series,m=d?.series===r.series&&d?.index===r.index;return e("path",{d:c(a(r.series),r.x,r.y,r.r),fill:t?.color??o[r.series],stroke:"var(--neba-chart-gap)",strokeWidth:n,opacity:i?.28:1,className:l,style:{transformBox:"view-box",transformOrigin:`${r.x}px ${r.y}px`,scale:String(m&&r.r>0?(r.r+1)/r.r:1)}},`${r.series}-${r.index}`)})})}const y=/*@__PURE__*/t.memo(function ScatterTable({id:t,series:a,categories:l,label:i,xLabel:o,yLabel:n,locale:c,format:u}){const d=p(f,c),m=a.some(e=>e.data.some(e=>"object"==typeof e&&null!==e&&void 0!==e.z));return r("table",{id:t,className:x(b),children:[i?e("caption",{children:i}):null,e("thead",{children:r("tr",{children:[e("th",{scope:"col"}),e("th",{scope:"col",children:o??"x"}),e("th",{scope:"col",children:n??"y"}),m?e("th",{scope:"col",children:d.size}):null]})}),e("tbody",{children:a.flatMap((t,a)=>t.data.map((i,o)=>{const n="object"==typeof i&&null!==i?i:null,d=n?n.y:"number"==typeof i?i:null,f=n?.x??l?.[o]??o;return r("tr",{children:[e("th",{scope:"row",children:t.name??a+1}),e("td",{children:"number"==typeof f?h(c,{}).format(f):s(f,c)}),e("td",{children:null!==d&&Number.isFinite(d)?u(d):""}),m?e("td",{children:void 0===n?.z?"":h(c,{}).format(n.z)}):null]},`${a}-${o}`)}))})]})});
|
|
1
|
+
"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as t from"react";import{CartesianChart as a,markTransitionClasses as l}from"../../internal/chart-frame.js";import{bubbleRadius as i,formatCategory as s,markerRadii as o,markGap as n,markPath as c,markShapes as u,plotHeights as d,pointX as m}from"../../internal/chart.js";import{numberFormatter as h}from"../../internal/format.js";import{chartMessages as f,useMessages as p}from"../../internal/i18n.js";import{cx as x,srOnlyClasses as b}from"../../internal/styles.js";import{useStyleDefaults as v}from"../../internal/defaults.js";export function ScatterChart(r){const{shape:l="auto",pointRadius:s,maxRadius:n,series:h,categories:f,size:p="md",xAxis:x,...b}=v(r,["size","locale"]),g=s??o[p],z=n??Math.max(g+2,("number"==typeof b.height?b.height:d[p])/12),j=h.reduce((e,r)=>r.color?e:e+1,0),k="auto"===l||"varied"===l?"circle":l,M="varied"===l||"auto"===l&&j>3,S=t.useCallback(e=>M?u[e%u.length]:k,[M,k]),$=t.useCallback(e=>{const r=[];let t=0;return e.values.forEach(e=>{e.forEach(e=>{null!==e.value&&void 0!==e.z&&Number.isFinite(e.z)&&(t=Math.max(t,e.z))})}),e.values.forEach((a,l)=>{e.visible[l]&&a.forEach((a,s)=>{if(null===a.value)return;const o=m(a,s,f);null!==o&&r.push({series:l,index:s,x:e.categoryValuePx(o),y:e.valuePx(a.value,l),r:void 0===a.z?g:i(a.z,t,z,2)})})}),r},[f,g,z]);return e(a,{...b,series:h,categories:f,size:p,xScale:"value",xAxis:x,marks:$,markInset:z,includeZero:!1,swatch:(r,t)=>e("svg",{viewBox:"0 0 10 10",className:"size-2.5 overflow-visible","aria-hidden":"true",children:e("path",{d:c(S(r),5,5,4),fill:t})}),table:(r,t)=>e(y,{id:r,series:h,categories:f,label:b.label,xLabel:x?.label,yLabel:b.yAxis?.label,locale:b.locale,format:t}),children:r=>e(ScatterMarks,{context:r,shapeOf:S})})}function ScatterMarks({context:r,shapeOf:a}){const{marks:i,values:s,colors:o,hovered:u,activeMark:d}=r,m=t.useMemo(()=>[...i].sort((e,r)=>r.r-e.r),[i]);return e("g",{children:m.map(r=>{const t=s[r.series]?.[r.index],i=null!==u&&u!==r.series,m=d?.series===r.series&&d?.index===r.index;return e("path",{d:c(a(r.series),r.x,r.y,r.r),fill:t?.color??o[r.series],stroke:"var(--neba-chart-gap)",strokeWidth:n,opacity:i?.28:1,className:l,style:{transformBox:"view-box",transformOrigin:`${r.x}px ${r.y}px`,scale:String(m&&r.r>0?(r.r+1)/r.r:1)}},`${r.series}-${r.index}`)})})}const y=/*@__PURE__*/t.memo(function ScatterTable({id:t,series:a,categories:l,label:i,xLabel:o,yLabel:n,locale:c,format:u}){const d=p(f,c),m=a.some(e=>e.data.some(e=>"object"==typeof e&&null!==e&&void 0!==e.z));return r("table",{id:t,className:x(b),children:[i?e("caption",{children:i}):null,e("thead",{children:r("tr",{children:[e("th",{scope:"col"}),e("th",{scope:"col",children:o??"x"}),e("th",{scope:"col",children:n??"y"}),m?e("th",{scope:"col",children:d.size}):null]})}),e("tbody",{children:a.flatMap((t,a)=>t.data.map((i,o)=>{const n="object"==typeof i&&null!==i?i:null,d=n?n.y:"number"==typeof i?i:null,f=n?.x??l?.[o]??o;return r("tr",{children:[e("th",{scope:"row",children:t.name??a+1}),e("td",{children:"number"==typeof f?h(c,{}).format(f):s(f,c)}),e("td",{children:null!==d&&Number.isFinite(d)?u(d):""}),m?e("td",{children:void 0===n?.z?"":h(c,{}).format(n.z)}):null]},`${a}-${o}`)}))})]})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{Select as t}from"@base-ui/react/select";import{Field as n}from"@base-ui/react/field";import{CheckIcon as r,ChevronIcon as i}from"../../internal/icons.js";import{WidthSizer as s}from"../../internal/sizer.js";import{controlTextLeadingClasses as o,cx as d,disabledClasses as c,fieldFocusTransitionClasses as m,fieldHeightClasses as u,fieldReadOnlyClasses as p,fieldRestClasses as f,fieldRingClasses as b,gapClasses as h,hasContent as g,iconClasses as v,metaTextClasses as x,paddingXClasses as N,popupFadeClasses as j,radiusClasses as y,stackGapClasses as w,surfaceClasses as I,surfaceSlots as S,transitionClasses as $}from"../../internal/styles.js";import{useStyleDefaults as z}from"../../internal/defaults.js";import{
|
|
1
|
+
"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{Select as t}from"@base-ui/react/select";import{Field as n}from"@base-ui/react/field";import{CheckIcon as r,ChevronIcon as i}from"../../internal/icons.js";import{WidthSizer as s}from"../../internal/sizer.js";import{controlTextLeadingClasses as o,cx as d,disabledClasses as c,fieldFocusTransitionClasses as m,fieldHeightClasses as u,fieldReadOnlyClasses as p,fieldRestClasses as f,fieldRingClasses as b,gapClasses as h,hasContent as g,iconClasses as v,metaTextClasses as x,paddingXClasses as N,popupFadeClasses as j,radiusClasses as y,stackGapClasses as w,surfaceClasses as I,surfaceSlots as S,transitionClasses as $}from"../../internal/styles.js";import{useStyleDefaults as z}from"../../internal/defaults.js";import{fieldSpotlightSlot as V,glowClasses as k,trackPointer as M}from"../../internal/glow.js";import{useFieldsetDisabled as P}from"../../internal/fieldset.js";const O=["group relative flex w-full cursor-pointer items-center select-none","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",$,m,b,v].join(" "),R=[I,"max-h-[min(20rem,var(--available-height))] overflow-y-auto overscroll-contain","min-w-[var(--anchor-width)] border bg-(--n-panel-press) p-1","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]","[outline:none]",j].join(" "),T=["py-1.5 pe-2 ps-7 font-semibold tracking-wide text-(--neba-muted-fg) uppercase"].join(" "),q=["relative flex cursor-pointer items-center gap-2 select-none","rounded-(--neba-radius-xs) py-1.5 pe-2 ps-7",$,"data-[highlighted]:bg-(--n-soft-hover) data-[highlighted]:text-(--n-on-tint)","data-[selected]:text-(--n-on-tint) data-[selected]:font-medium","data-[disabled]:cursor-not-allowed data-[disabled]:text-(--neba-disabled-fg)","[outline:none]"].join(" ");export const Select=/*@__PURE__*/l.forwardRef(function Select(m,b){const{variant:v="outline",size:j="md",color:I="primary",density:$="default",elevation:C=0,items:G,value:L,defaultValue:W,onValueChange:_,placeholder:D,label:E,description:A,error:B,invalid:F,startIcon:H,fullWidth:J=!1,disabled:K,readOnly:Q=!1,required:U=!1,name:X,id:Y,className:Z,classNames:ee,style:ae,"aria-label":le,"aria-labelledby":te,...ne}=z(m,["size","density","variant"]),re=P(K),ie=!re&&!Q,se=null!=B&&!1!==B&&""!==B,oe=F??se,de=oe?"danger":I,ce=l.useMemo(()=>G.map(e=>({label:e.label??String(e.value),value:e.value})),[G]),me=l.useMemo(()=>function(e){const a=[];for(const l of e){const e=a.at(-1);e&&e.label===l.group?e.items.push(l):a.push({label:l.group,items:[l]})}return a}(G),[G]),ue=l.useMemo(()=>[...G.map(e=>e.label??String(e.value)),...g(D)?[D]:[]],[G,D]);return a(n.Root,{disabled:re,invalid:oe,className:d("flex-col align-top",w[j],J?"flex w-full":"inline-flex",Z??""),style:{...S(de,C),...ie?V:void 0,...ae},...ne,children:[E?e(n.Label,{className:d(x[j],"font-medium",re?"text-(--neba-disabled-fg)":"text-(--neba-fg)",ee?.label),children:E}):null,a(t.Root,{id:Y,name:X,items:ce,value:L,defaultValue:W,onValueChange:e=>_?.(e),disabled:re,readOnly:Q,required:U,children:[a(t.Trigger,{ref:b,onPointerMove:M(void 0,ie),"aria-label":le,"aria-labelledby":te,className:d(O,u[j],o[j],y[j],h[j],N[$][j],re?c[v]:Q?`${p[v]} cursor-default`:`${f[v]} ${k}`,ee?.control),children:[H?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:H}):null,a("span",{className:"flex min-w-0 flex-1 flex-col",children:[e(t.Value,{className:["w-full truncate text-start","data-[placeholder]:text-(--neba-muted-fg)"].join(" "),placeholder:D}),e(s,{samples:ue})]}),e(t.Icon,{className:["flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)","[transition:rotate_var(--neba-duration)_var(--neba-ease)]","data-[popup-open]:rotate-180"].join(" "),children:e(i,{})})]}),e(t.Portal,{children:e(t.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",sideOffset:6,alignItemWithTrigger:!1,children:e(t.Popup,{className:d(R,y[j],o[j],ee?.popup),style:S(de,3),children:me.map((l,n)=>{const i=l.items.map(l=>a(t.Item,{value:l.value,disabled:l.disabled,className:d(q,ee?.item),children:[e(t.ItemIndicator,{className:"absolute start-1.5 flex size-4 items-center justify-center",children:e(r,{})}),e(t.ItemText,{className:"truncate",children:l.label??String(l.value)})]},String(l.value)));return void 0===l.label?i:a(t.Group,{children:[e(t.GroupLabel,{className:`${T} ${x[j]}`,children:l.label}),i]},`${l.label}-${n}`)})})})})]}),A?e(n.Description,{className:d(x[j],"text-(--neba-muted-fg)",ee?.description),children:A}):null,e(n.Error,se?{match:!0,className:d(x[j],"text-(--n-accent)",ee?.error),children:B}:{className:d(x[j],"text-(--n-accent)",ee?.error)})]})});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import type { NebaChartCurve, NebaChartDatum, NebaColor, NebaSize } from '../../types.js';
|
|
2
|
+
import type { NebaChartCurve, NebaChartDatum, NebaChartNulls, NebaColor, NebaSize } from '../../types.js';
|
|
3
3
|
export interface SparklineProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'children'> {
|
|
4
4
|
/** The values. `null` is a gap, exactly as it is on every other chart. */
|
|
5
5
|
data: readonly NebaChartDatum[];
|
|
@@ -12,6 +12,19 @@ export interface SparklineProps extends Omit<React.ComponentPropsWithoutRef<'div
|
|
|
12
12
|
shape?: 'line' | 'area' | 'bar';
|
|
13
13
|
/** @default 'linear' */
|
|
14
14
|
curve?: NebaChartCurve;
|
|
15
|
+
/**
|
|
16
|
+
* What the strip does where a value is missing: break at it, bridge it, or
|
|
17
|
+
* read it as a nought. The same three answers a
|
|
18
|
+
* [LineChart](./line-chart) gives, and they mean the same things.
|
|
19
|
+
*
|
|
20
|
+
* It matters more here than on a full chart, because there is no tooltip and
|
|
21
|
+
* no axis to notice the hole with: a strip that quietly closes over three
|
|
22
|
+
* missing weeks is a trend nobody can tell was interpolated. `zero` rewrites
|
|
23
|
+
* the values, so the range the strip scales itself to takes the nought in and
|
|
24
|
+
* the numbers read out to a screen reader say `0` as well.
|
|
25
|
+
* @default 'gap'
|
|
26
|
+
*/
|
|
27
|
+
nulls?: NebaChartNulls;
|
|
15
28
|
/**
|
|
16
29
|
* How tall the strip is. Sized against the line of text it sits beside rather
|
|
17
30
|
* than against the page — a sparkline is a word in a sentence, not a picture.
|