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
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{CartesianChart as o,markTransitionClasses as r}from"../../internal/chart-frame.js";import{barBandRatio as
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{CartesianChart as o,chartTableClasses as a,markTransitionClasses as r,useDeferredRows as s}from"../../internal/chart-frame.js";import{barBandRatio as l,barMaxThickness as i,barRadius as c,formatTimeTicks as m,formatTimeValue as u,markGap as d,resolveColor as f,seriesColor as h,timeScale as x,toNumber as p}from"../../internal/chart.js";import{chartMessages as M,useMessages as b}from"../../internal/i18n.js";import{useStyleDefaults as y}from"../../internal/defaults.js";import{useIntlLocale as v}from"../../internal/media.js";export function TimelineChart(t){const{series:a,min:r,max:s,barSize:c,rounded:f=!0,size:C="md",density:T="default",xAxis:z,yAxis:A,locale:D,references:E,...P}=y(t,["size","density","locale"]),S=v(D),B=n.useMemo(()=>a.map(g),[a]),F=n.useMemo(()=>B.map(e=>e.spans),[B]),I=n.useMemo(()=>{let e=1/0,t=-1/0,n=!1;for(const o of F)for(const a of o)a&&(n=!0,e=Math.min(e,a.from),t=Math.max(t,a.to));for(const o of E??[])if("value"===(o.axis??"value"))for(const a of void 0===o.to?[o.value]:[o.value,o.to])n=!0,e=Math.min(e,a),t=Math.max(t,a);return n?{min:e,max:t}:null},[F,E]),N=n.useMemo(()=>x(I,{min:p(r)??void 0,max:p(s)??void 0,tickCount:A?.tickCount}),[I,r,s,A?.tickCount]),R=n.useMemo(()=>m(N.ticks,N.unit,S),[N,S]),q=n.useMemo(()=>a.map((e,t)=>h(e,t)),[a]),Y=n.useMemo(()=>[{data:F.map(e=>e.some(Boolean)?1:null)}],[F]),G=n.useMemo(()=>{const e=w(N.unit);return("day"===e||"week"===e)&&F.some(e=>e.some(e=>null!==e&&(k(e.from)||k(e.to))))},[F,N.unit]),H=n.useMemo(()=>{let e=0,t=1/0,n=-1/0;for(const o of F)for(const a of o)a&&(e+=1,t=Math.min(t,a.from),n=Math.max(n,a.to));return 0===e?{count:e,min:"",max:""}:{count:e,min:u(t,w(N.unit),S,G),max:u(n,w(N.unit),S,G)}},[F,N.unit,S,G]),J=n.useMemo(()=>a.map((e,t)=>e.name??`${t+1}`),[a]),K=c??i[C],L=b(M,D),O=n.useCallback(e=>{const t=[];return B.forEach((n,o)=>{const a=Math.min(K,Math.max(1,(e.band.band-d*(n.lanes-1))/n.lanes)),r=a*n.lanes+d*(n.lanes-1),s=e.plot.top+e.categoryPx(o)-r/2+a/2;n.spans.forEach((n,r)=>{if(!n||n.to<e.scale.min||n.from>e.scale.max)return;const l=e.valuePx(n.from),i=e.valuePx(n.to);t.push({series:o,index:r,x:(l+i)/2,y:s+n.lane*(a+d),r:a/2,rx:Math.max(0,(i-l)/2),ry:a/2})})}),t},[B,K]),Q=n.useCallback(e=>{const t=F[e.series]?.[e.index];if(!t)return null;const n=[{seriesIndex:e.series,name:J[e.series],color:t.color??q[e.series],value:t.to-t.from,formatted:`${u(t.from,w(N.unit),S,G)} – ${u(t.to,w(N.unit),S,G)}`}];return{heading:t.span.label??J[e.series],items:n}},[F,J,q,N.unit,S,G]);return e(o,{...P,series:Y,categories:J,size:C,density:T,locale:D,horizontal:!0,scale:N,references:E,brush:void 0,secondaryAxis:void 0,xAxis:z,yAxis:{tickFormat:(e,t)=>R[t]??"",...A},legend:!1,bandRatio:l[T],marks:O,markTooltip:Q,summary:H,exportRows:()=>function(e,t,n,o,a){const r=t.some(e=>e.data.some(e=>void 0!==e.label));return[["string"==typeof o?o:"",...r?[a.title]:[],a.start,a.end],...n.flatMap((n,o)=>n.map((n,a)=>[e[o],...r?[j(t[o].data[a]?.label)]:[],n?new Date(n.from):null,n?new Date(n.to):null]))]}(J,a,F,z?.label,L),table:t=>e($,{id:t,names:J,series:a,spans:F,unit:w(N.unit),clock:G,label:P.label,corner:z?.label,locale:D}),children:t=>e(Spans,{context:t,spans:F,colors:q,rounded:f})})}function g(e){const t=e.data.map(e=>{const t=p(e.start),n=p(e.end);return null===t||null===n?null:{from:Math.min(t,n),to:Math.max(t,n),lane:0,color:e.color?f(e.color):void 0,span:e}}),n=[];return t.map((e,t)=>({one:e,index:t})).filter(e=>Boolean(e.one)).sort((e,t)=>e.one.from-t.one.from).forEach(({one:e})=>{const t=n.findIndex(t=>t<=e.from),o=-1===t?n.length:t;n[o]=e.to,e.lane=o}),{spans:t,lanes:Math.max(1,n.length)}}function Spans({context:t,spans:n,colors:o,rounded:a}){const{marks:s,activeMark:l,plot:i}=t,m=a?c:0;return e("g",{children:s.map(t=>{const a=n[t.series]?.[t.index];if(!a)return null;const s=l?.series===t.series&&l?.index===t.index,c=t.rx??t.r,u=2*(t.ry??t.r),d=Math.max(i.left,t.x-c),f=Math.min(i.left+i.width,t.x+c);if(f<i.left||d>i.left+i.width)return null;const h=Math.max(1,f-d);return e("rect",{x:d,y:t.y-u/2,width:h,height:u,rx:Math.min(m,h/2,u/2),fill:a.color??o[t.series],opacity:s?1:.92,className:r},`${t.series}-${t.index}`)})})}function k(e){const t=new Date(e);return t.getTime()!==new Date(t.getFullYear(),t.getMonth(),t.getDate()).getTime()}function w(e){return"month"===e||"quarter"===e||"year"===e?"day":e}const j=e=>"string"==typeof e||"number"==typeof e?e:null;const $=/*@__PURE__*/n.memo(function TimelineTable({id:n,names:o,series:r,spans:l,unit:i,clock:c,label:m,corner:d,locale:f}){const h=b(M,f),x=v(f),p=r.some(e=>e.data.some(e=>void 0!==e.label)),y=[],g=l.reduce((e,t)=>(y.push(e),e+t.length),0),k=s({rows:g,points:g,columns:p?4:3});return t("table",{id:n,className:a,"aria-busy":k<g||void 0,children:[m?e("caption",{children:m}):null,e("thead",{children:t("tr",{children:[e("th",{scope:"col",children:d??""}),p?e("th",{scope:"col",children:h.title}):null,e("th",{scope:"col",children:h.start}),e("th",{scope:"col",children:h.end})]})}),e("tbody",{children:l.flatMap((n,a)=>n.slice(0,Math.max(0,k-y[a])).map((n,s)=>t("tr",{children:[e("th",{scope:"row",children:o[a]}),p?e("td",{children:r[a].data[s]?.label??""}):null,e("td",{children:n?u(n.from,i,x,c):""}),e("td",{children:n?u(n.to,i,x,c):""})]},`${a}-${s}`)))})]})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as o from"react";import{
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as o from"react";import{useLayoutEffectOnClient as i}from"../../internal/layout-effect.js";import{Toast as s}from"@base-ui/react/toast";import{boxPaddingClasses as n}from"../box/Box.js";import{actionMessages as a,toastMessages as r,useMessages as l}from"../../internal/i18n.js";import{CloseIcon as c,severityIcon as d}from"../../internal/icons.js";import{controlSlots as m,cx as u,focusRingClasses as f,hasContent as p,hitAreaClasses as b,iconClasses as v,metaTextClasses as x,popupFadeClasses as h,radiusClasses as w,sheetBodyClasses as g,sheetHeaderGapClasses as j,sheetSectionGapClasses as y,sheetTitleClasses as N,sheetTitleHeadingClasses as T,surfaceClasses as z}from"../../internal/styles.js";import{useStyleDefaults as L}from"../../internal/defaults.js";const k={"top-start":"top-0 items-start","top-center":"top-0 items-center","top-end":"top-0 items-end","bottom-start":"bottom-0 items-start flex-col-reverse","bottom-center":"bottom-0 items-center flex-col-reverse","bottom-end":"bottom-0 items-end flex-col-reverse"},_={solid:[z,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--neba-shadow-3),var(--neba-plate-solid)]"].join(" "),outline:[z,"border text-(--neba-fg) bg-(--n-panel-press)","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]"].join(" "),text:[z,"text-(--neba-fg) bg-(--n-panel-press)","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]"].join(" ")},M={solid:"",outline:"text-(--n-on-tint)",text:"text-(--n-on-tint)"};function O(e){const{color:t,variant:o,icon:i,actionLabel:s,onAction:n,...a}=e;return{...a,data:{color:t,variant:o,icon:i},actionProps:void 0===s?void 0:{children:s,onClick:n}}}export function useToast(){const e=s.useToastManager(),t=o.useRef(e);i(()=>{t.current=e});const n=o.useMemo(()=>({add:e=>t.current.add(O(e)),close:e=>t.current.close(e),update:(e,o)=>t.current.update(e,e=>function(e,t){const{color:o,variant:i,icon:s,actionLabel:n,onAction:a,...r}=e,l=Object.fromEntries(Object.entries(r).filter(([,e])=>void 0!==e)),c=Object.fromEntries(Object.entries({color:o,variant:i,icon:s}).filter(([,e])=>void 0!==e));return{...l,...0===Object.keys(c).length?null:{data:{...t.data,...c}},...void 0===n?null:{actionProps:{children:n,onClick:a}}}}(o,e)),promise:(e,o)=>t.current.promise(e,{loading:O(o.loading),success:e=>O("function"==typeof o.success?o.success(e):o.success),error:e=>O("function"==typeof o.error?o.error(e):o.error)})}),[]);return o.useMemo(()=>({...n,toasts:e.toasts}),[n,e.toasts])}function ToastItem({toast:o,variant:i,color:a,size:r,density:l,closeLabel:z,swipeDirection:L,classNames:k}){const O=o.data?.variant??i??"outline",P=o.data?.color??a,D=void 0===o.data?.icon?d(P):o.data.icon,A=M[O],C=p(o.title);return t(s.Root,{toast:o,swipeDirection:L,className:u("pointer-events-auto flex w-full items-start",n[l??"default"][r],w[r],y[r],g[r],_[O],v,h,"data-[limited]:hidden",f,k?.toast),style:m(P,3,O),children:[p(D)?e("span",{className:`flex h-[1lh] shrink-0 items-center ${A}`,children:D}):null,t("div",{className:`flex min-w-0 flex-1 flex-col ${j[r]}`,children:[e(s.Title,{className:u(T,"font-semibold",N[r],A,k?.title)}),e(s.Description,{className:u(C&&"solid"!==O?"text-(--neba-muted-fg)":"",k?.description)})]}),e(s.Action,{className:u("flex h-[1lh] shrink-0 cursor-pointer items-center rounded-full px-2","font-medium underline-offset-2",A||"text-(--n-on-solid)","hover:underline","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2",x[r],k?.action)}),e("span",{className:"flex h-[1lh] shrink-0 items-center",children:e(s.Close,{"aria-label":z,className:u("relative inline-flex size-[1.15em] cursor-pointer items-center justify-center rounded-full",b,"opacity-70 [transition:opacity_var(--neba-duration)_var(--neba-ease)]","hover:opacity-100 focus-visible:opacity-100","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2",k?.close),children:e(c,{})})})]})}function ToastViewport(t){const{toasts:i}=s.useToastManager(),{position:n,width:a,classNames:r,regionLabel:l,...c}=t,d=o.useMemo(()=>[n.startsWith("top")?"up":"down","left","right"],[n]);return e(s.Portal,{children:e(s.Viewport,{"aria-label":l,className:u("neba-portal pointer-events-none fixed inset-x-0 flex flex-col gap-2 p-4","z-(--neba-z-toast,calc(var(--neba-z-portal)+1))",k[n],r?.viewport),children:i.map(t=>e("div",{className:"w-full",style:{maxWidth:"number"==typeof a?`${a}px`:a},children:e(ToastItem,{toast:t,swipeDirection:d,classNames:r,...c})},t.id))})})}export function ToastProvider(o){const{variant:i="outline",size:n="md",color:c="primary",density:d="default",position:m="bottom-end",timeout:u=5e3,limit:f=3,width:p=380,locale:b,closeLabel:v,label:x,classNames:h,children:w}=L(o,["size","density","variant","locale"]),g=l(a,b),j=l(r,b);return t(s.Provider,{timeout:u,limit:f,children:[w,e(ToastViewport,{position:m,variant:i,size:n,color:c,density:d,width:p,closeLabel:v??g.close,regionLabel:x??j.label,classNames:h})]})}
|
|
@@ -69,6 +69,17 @@ export interface ToolCallProps extends Pick<NebaStyleProps, 'size' | 'variant' |
|
|
|
69
69
|
defaultOpen?: boolean;
|
|
70
70
|
/** Called when the header opens or closes the panel. */
|
|
71
71
|
onOpenChange?: (open: boolean) => void;
|
|
72
|
+
/**
|
|
73
|
+
* Keeps a closed panel in the DOM, hidden until the browser's own page search
|
|
74
|
+
* finds something in it and opens it.
|
|
75
|
+
*
|
|
76
|
+
* On by default, as on a [Collapsible](../surfaces/collapsible): a panel that
|
|
77
|
+
* is not in the markup is not in a server render either. Turn it off for a
|
|
78
|
+
* transcript of many calls with long results, where the closed panels are
|
|
79
|
+
* only worth building once they are opened.
|
|
80
|
+
* @default true
|
|
81
|
+
*/
|
|
82
|
+
hiddenUntilFound?: boolean;
|
|
72
83
|
/**
|
|
73
84
|
* Drop shadow depth. `0` (the default) is flat — a tool call belongs to the
|
|
74
85
|
* transcript it sits in rather than floating over it.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,Fragment as a,jsxs as n}from"react/jsx-runtime";import*as l from"react";import{Collapsible as s}from"@base-ui/react/collapsible";import{boxPaddingXClasses as r,boxPaddingYClasses as t}from"../box/Box.js";import{ChevronIcon as o}from"../../internal/icons.js";import{formatDuration as i,runColor as c,runIcon as m,useElapsed as d}from"../../internal/run.js";import{runMessages as u,toolMessages as f,useMessages as p}from"../../internal/i18n.js";import{collapsiblePanelClasses as
|
|
1
|
+
"use client";import{jsx as e,Fragment as a,jsxs as n}from"react/jsx-runtime";import*as l from"react";import{Collapsible as s}from"@base-ui/react/collapsible";import{boxPaddingXClasses as r,boxPaddingYClasses as t}from"../box/Box.js";import{ChevronIcon as o}from"../../internal/icons.js";import{formatDuration as i,runColor as c,runIcon as m,useElapsed as d}from"../../internal/run.js";import{runMessages as u,toolMessages as f,useMessages as p}from"../../internal/i18n.js";import{collapsiblePanelClasses as h,cx as x,gapClasses as b,hasContent as g,iconClasses as v,metaTextClasses as N,preformattedClasses as j,radiusClasses as w,sheetBodyClasses as y,sheetTitleClasses as k,srOnlyClasses as z,surfaceClasses as C,surfaceSlots as B,transitionClasses as F,disclosureChevronClasses as O,disclosureTriggerClasses as R}from"../../internal/styles.js";import{useStyleDefaults as T}from"../../internal/defaults.js";const U={solid:[C,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[C,"border text-(--neba-fg) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-transparent"},_=k;export const ToolCall=/*@__PURE__*/l.forwardRef(function ToolCall(j,k){const{variant:C="outline",size:E="md",color:P="primary",density:S="default",elevation:$=0,name:q,status:A="pending",args:D,result:G,error:H,duration:I,meta:J,icon:K,open:L,defaultOpen:M=!1,onOpenChange:Q,hiddenUntilFound:V=!0,locale:W,labels:X,classNames:Y,className:Z,style:ee,children:ae,...ne}=T(j,["size","density","variant","locale"]),le=p(u,W),se=p(f,W),re={...le,...se,...X},[te,oe]=l.useState(M),ie=void 0!==L,ce=ie?L:te,me=l.useRef(A);l.useEffect(()=>{me.current===A||"error"!==A||ie||oe(!0),me.current=A},[A,ie]);const de=d("running"===A,I),ue=c(A,P),fe=void 0===K?m(A):K,pe=function(e,a,n){return"error"===e&&g(n)?n:a}(A,G,H),he=g(D)||g(pe)||g(ae),xe=r[S][E],be=t[S][E],ge=n(a,{children:[g(fe)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--n-accent)",children:fe}):null,e("span",{className:x("min-w-0 truncate font-mono font-semibold",_[E]),children:q}),e("span",{className:z,children:re[A]}),g(J)?e("span",{className:x("min-w-0 truncate text-(--neba-muted-fg)",N[E]),children:J}):null,e("span",{className:"flex-1"}),null===de?null:e("span",{className:x("shrink-0 tabular-nums text-(--neba-muted-fg)",N[E]),children:i(de,W)})]}),ve=x("flex flex-col overflow-hidden",w[E],U[C],F,v,Z??""),Ne={...B(ue,$),...ee};return he?n(s.Root,{ref:k,open:ce,onOpenChange:e=>{ie||oe(e),Q?.(e)},"data-status":A,className:ve,style:Ne,...ne,children:[n(s.Trigger,{className:x("flex w-full cursor-pointer items-center text-start",R,xe,be,b[E],F,"hover:bg-(--n-soft)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]",Y?.header??""),children:[ge,e("span",{className:`${O} text-(--neba-muted-fg)`,children:e(o,{})})]}),e(s.Panel,{hiddenUntilFound:V,className:h,children:n("div",{className:x("flex min-w-0 flex-col gap-2 pb-4",xe,y[E],"compact"===S?"pb-2":"",Y?.body??""),children:[g(D)?e(Block,{size:E,label:re.arguments,className:Y?.args,value:D}):null,g(pe)?e(Block,{size:E,label:"error"===A&&g(H)?le.error:re.result,className:Y?.result,value:pe,accent:"error"===A}):null,ae]})})]}):e("div",{ref:k,"data-status":A,className:ve,style:Ne,...ne,children:e("div",{className:x("flex items-center",xe,be,b[E],Y?.header??""),children:ge})})});function Block({size:a,label:l,value:s,className:r,accent:t=!1}){return n("div",{className:x("flex min-w-0 flex-col gap-1",r??""),children:[e("span",{className:x("font-medium tracking-wide text-(--neba-muted-fg) uppercase",N[a]),children:l}),"string"==typeof s?e("pre",{className:x(j,"max-h-64",t?"text-(--n-accent)":""),children:s}):e("div",{className:t?"text-(--n-accent)":void 0,children:s})]})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{Popover as s}from"@base-ui/react/popover";import{Button as
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{useLayoutEffectOnClient as i}from"../../internal/layout-effect.js";import{Popover as s}from"@base-ui/react/popover";import{Button as o}from"../button/Button.js";import{boxPaddingXClasses as l,boxPaddingYClasses as a}from"../box/Box.js";import{actionMessages as r,fillMessage as c,stepsMessages as d,useMessages as m}from"../../internal/i18n.js";import{CloseIcon as p}from"../../internal/icons.js";import{queryMatches as u,reducedMotionQuery as h}from"../../internal/media.js";import{observeResize as f}from"../../internal/observe.js";import{cx as g,hasContent as x,metaTextClasses as b,popupFadeClasses as v,radiusClasses as w,sheetBodyClasses as N,sheetCloseClasses as k,sheetHeaderGapClasses as j,sheetSectionGapClasses as y,sheetTitleClasses as S,srOnlyClasses as z,surfaceClasses as L,surfaceSlots as C}from"../../internal/styles.js";import{useStyleDefaults as E}from"../../internal/defaults.js";const M=[L,"relative flex flex-col","border text-(--neba-fg) bg-(--n-panel-press)","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]","[outline:none]",v].join(" "),P={xs:"max-w-56",sm:"max-w-64",md:"max-w-80",lg:"max-w-96",xl:"max-w-lg"},O={xs:"xs",sm:"xs",md:"sm",lg:"sm",xl:"md"};function _(e){try{return document.querySelector(e)}catch{return null}}function Mask({spot:t,radius:n,className:i}){return e("div",null===t?{"aria-hidden":"true",className:g("pointer-events-none fixed inset-0 z-40 bg-(--neba-scrim)",i)}:{"aria-hidden":"true",className:g("pointer-events-none fixed z-40 [box-shadow:0_0_0_9999px_var(--neba-scrim)]",i),style:{top:t.top,left:t.left,width:t.width,height:t.height,borderRadius:n}})}export function Tour(v){const{steps:L,open:B,defaultOpen:F=!1,onOpenChange:R,step:T,defaultStep:q=0,onStepChange:A,onFinish:I,mask:V=!0,skippable:$=!0,dismissible:D=!0,scrollIntoView:H=!0,locale:G,previousLabel:J,nextLabel:K,doneLabel:Q,skipLabel:U,closeLabel:W,size:X="md",color:Y="primary",density:Z="default",className:ee,classNames:te}=E(v,["size","density","locale"]),ne=m(d,G),ie=m(r,G),[se,oe]=n.useState(F),[le,ae]=n.useState(q),re=B??se,ce=Math.min(T??le,Math.max(0,L.length-1)),de=L[ce],[me,pe]=n.useState(null),ue=e=>{void 0===B&&oe(e),R?.(e)},he=e=>{void 0===T&&ae(e),A?.(e)},[fe,ge]=n.useState(null);if(i(()=>{const e=de?.target;ge(re&&e?_(e):null)},[re,de?.target]),n.useEffect(()=>{const e=de?.target;if(!re||!e)return;const t=_(e);if(!(t instanceof HTMLElement))return;H&&t.scrollIntoView({block:"center",inline:"nearest",behavior:u(h)?"auto":"smooth"});const n=de?.padding??6;let i=0;const s=()=>{i=0;const s=t.getBoundingClientRect(),o={top:s.top-n,left:s.left-n,width:s.width+2*n,height:s.height+2*n};pe(t=>t?.selector===e&&t.spot.top===o.top&&t.spot.left===o.left&&t.spot.width===o.width&&t.spot.height===o.height?t:{selector:e,spot:o})},o=()=>{0===i&&(i=requestAnimationFrame(s))};s();const l=f(t,o);return window.addEventListener("scroll",o,{passive:!0,capture:!0}),window.addEventListener("resize",o,{passive:!0}),()=>{0!==i&&cancelAnimationFrame(i),l(),window.removeEventListener("scroll",o,!0),window.removeEventListener("resize",o)}},[re,de?.target,de?.padding,H]),0===L.length)return null;const xe=re&&de?.target&&me?.selector===de.target?me.spot:null,be=0===ce,ve=ce===L.length-1,we=l[Z][X],Ne=a[Z][X],ke=O[X],je=x(de?.title)||x(de?.content);return e(s.Root,{open:re,onOpenChange:(e,t)=>{(e||D||"escape-key"!==t.reason)&&(e||"outside-press"!==t.reason&&"focus-out"!==t.reason)?ue(e):t.cancel()},children:t(s.Portal,{children:[re&&V?e(Mask,{spot:xe,radius:xe?8:0,className:te?.mask}):null,e(s.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",side:de?.side??"bottom",align:de?.align??"center",sideOffset:10,collisionPadding:12,anchor:fe,children:t(s.Popup,{className:g(M,w[X],N[X],y[X],P[X],we,Ne,ee),style:C(Y,3),children:[e("span",{className:z,"aria-live":"polite",children:"string"==typeof de?.title?c(ne.step,{index:String(ce+1),title:de.title}):c(ne.position,{index:String(ce+1),total:String(L.length)})}),je?t("div",{className:"flex items-start gap-3",children:[t("div",{className:`flex min-w-0 flex-1 flex-col ${j[X]}`,children:[x(de?.title)?e(s.Title,{className:g("m-0 font-semibold",S[X],te?.title),children:de?.title}):null,x(de?.content)?e(s.Description,{className:g("m-0 min-w-0",te?.description),children:de?.content}):null]}),D?e("button",{type:"button","aria-label":W??ie.close,onClick:()=>ue(!1),className:g(k,te?.close),children:e(p,{})}):null]}):null,t("div",{className:g("flex items-center gap-2",te?.footer),children:[e("span",{className:`shrink-0 tabular-nums text-(--neba-muted-fg) ${b[X]}`,children:c(ne.position,{index:String(ce+1),total:String(L.length)})}),t("div",{className:"ms-auto flex items-center gap-2",children:[$&&!ve?e(o,{size:ke,variant:"text",color:"secondary",onClick:()=>ue(!1),children:U??ne.skip}):null,be?null:e(o,{size:ke,variant:"outline",color:Y,onClick:()=>he(ce-1),children:J??ne.previous}),e(o,{size:ke,color:Y,onClick:()=>ve?(I?.(),void ue(!1)):he(ce+1),children:ve?Q??ne.done:K??ne.next})]})]})]})})]})})}
|
|
@@ -49,6 +49,17 @@ export interface TreeViewProps extends NebaStyleProps, Omit<React.ComponentProps
|
|
|
49
49
|
disabled?: boolean;
|
|
50
50
|
/** The name the tree is announced by. */
|
|
51
51
|
label?: string;
|
|
52
|
+
/**
|
|
53
|
+
* Keeps the rows of a shut branch in the DOM — collapsed, inert and out of
|
|
54
|
+
* the order the arrow keys walk — instead of taking them out of it.
|
|
55
|
+
*
|
|
56
|
+
* A row that is not in the markup is not in a server render either, and a
|
|
57
|
+
* crawler reads the server render without opening a single branch. Turn this
|
|
58
|
+
* on for a tree that is navigation, so every `href` in it can be followed. A
|
|
59
|
+
* tree of thousands of rows pays for every one of them on the first render.
|
|
60
|
+
* @default false
|
|
61
|
+
*/
|
|
62
|
+
keepMounted?: boolean;
|
|
52
63
|
/** The top-level TreeItems. */
|
|
53
64
|
children?: React.ReactNode;
|
|
54
65
|
}
|
|
@@ -106,7 +117,8 @@ export interface TreeItemProps extends Omit<React.ComponentPropsWithoutRef<'li'>
|
|
|
106
117
|
* keys are questions about the *tree* ("what is the next visible row", "where is
|
|
107
118
|
* my parent"), and the only element that can answer them is the one holding all
|
|
108
119
|
* of them. The rows the query returns are in document order, which is reading
|
|
109
|
-
* order, because a shut branch is unmounted
|
|
120
|
+
* order, because a shut branch is either unmounted or — under `keepMounted` —
|
|
121
|
+
* marked, and `treeRows` leaves a marked one out.
|
|
110
122
|
*/
|
|
111
123
|
export declare const TreeView: React.ForwardRefExoticComponent<TreeViewProps & React.RefAttributes<HTMLUListElement>>;
|
|
112
124
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,Fragment as t,jsxs as n}from"react/jsx-runtime";import*as r from"react";import{inertValue as a}from"../../internal/inert.js";import{safeHref as l}from"../../internal/link.js";import{searchText as s}from"../../internal/search.js";import{ChevronIcon as o}from"../../internal/icons.js";import{controlTextClasses as i,cx as d,gapClasses as c,hasContent as u,iconClasses as m,radiusClasses as
|
|
1
|
+
"use client";import{jsx as e,Fragment as t,jsxs as n}from"react/jsx-runtime";import*as r from"react";import{inertValue as a}from"../../internal/inert.js";import{safeHref as l}from"../../internal/link.js";import{searchText as s}from"../../internal/search.js";import{ChevronIcon as o}from"../../internal/icons.js";import{controlTextClasses as i,cx as d,gapClasses as c,hasContent as u,iconClasses as m,radiusClasses as p,surfaceClasses as f,surfaceSlots as g,transitionClasses as x}from"../../internal/styles.js";import{useStyleDefaults as b}from"../../internal/defaults.js";const h=/*@__PURE__*/r.createContext({size:"md",density:"default",disabled:!1,multiple:!1,keepMounted:!1,expandedKeys:new Set,selectedKeys:new Set,activeKey:null,toggle:()=>{},select:()=>{},activate:()=>{},register:()=>()=>{}}),v=/*@__PURE__*/r.createContext(!1),y={solid:[f,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[f,"border text-(--neba-fg) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-transparent"},w={xs:"0.875rem",sm:"1rem",md:"1.25rem",lg:"1.5rem",xl:"1.75rem"},k={xs:"1.375rem",sm:"1.625rem",md:"2rem",lg:"2.5rem",xl:"3rem"},C={default:{xs:"px-1.5",sm:"px-2",md:"px-2.5",lg:"px-3",xl:"px-3.5"},compact:{xs:"px-1",sm:"px-1",md:"px-1.5",lg:"px-2",xl:"px-2.5"}},S={xs:"rounded-[0.3125rem]",sm:"rounded-[0.375rem]",md:"rounded-[0.5rem]",lg:"rounded-[0.625rem]",xl:"rounded-[0.75rem]"},E={none:"",simple:"neba-tree-simple",folder:"neba-tree-folder"};function N(e){return Array.from(e.querySelectorAll('[role="treeitem"]')).filter(e=>null===e.closest("[data-closing]"))}const j=e=>String(e);export const TreeView=/*@__PURE__*/r.forwardRef(function TreeView(t,n){const{variant:a="outline",size:l="md",color:o="primary",density:i="default",elevation:c=0,lines:u="simple",expanded:m,defaultExpanded:f,onExpandedChange:v,selected:C,defaultSelected:S,onSelectedChange:K,multiple:A=!1,disabled:V=!1,label:D,keepMounted:R=!1,className:M,style:I,children:P,onKeyDown:T,..._}=b(t,["size","density","variant"]),[z,q]=r.useState(f??[]),[F,L]=r.useState(S??[]),[H,O]=r.useState(null),U=m??z,W=C??F,B=r.useRef(null),G=r.useCallback(e=>{B.current=e,"function"==typeof n?n(e):n&&(n.current=e)},[n]),J=r.useRef({expandedValues:U,selectedValues:W,controlledExpanded:void 0!==m,controlledSelected:void 0!==C,multiple:A,onExpandedChange:v,onSelectedChange:K});J.current={expandedValues:U,selectedValues:W,controlledExpanded:void 0!==m,controlledSelected:void 0!==C,multiple:A,onExpandedChange:v,onSelectedChange:K};const Q=r.useCallback(e=>{const{expandedValues:t,controlledExpanded:n,onExpandedChange:r}=J.current,a=j(e),l=t.some(e=>j(e)===a)?t.filter(e=>j(e)!==a):[...t,e];n||q(l),r?.(l)},[]),X=r.useCallback(e=>{const{selectedValues:t,controlledSelected:n,multiple:r,onSelectedChange:a}=J.current,l=j(e),s=t.some(e=>j(e)===l),o=r?s?t.filter(e=>j(e)!==l):[...t,e]:[e];n||L(o),a?.(o)},[]),Y=r.useRef(new Map),Z=r.useCallback((e,t)=>(Y.current.set(e,t),()=>{Y.current.delete(e)}),[]),$=r.useMemo(()=>U.map(j).join("\0"),[U]),ee=r.useMemo(()=>W.map(j).join("\0"),[W]),te=r.useMemo(()=>({size:l,density:i,disabled:V,multiple:A,keepMounted:R,expandedKeys:new Set(U.map(j)),selectedKeys:new Set(W.map(j)),activeKey:H,toggle:Q,select:X,activate:O,register:Z}),[l,i,V,A,R,$,ee,H,Q,X,Z]);r.useEffect(()=>{if(null!==H&&Y.current.has(H))return;const e=B.current;if(!e)return;const t=N(e);if(0===t.length)return;const n=t.find(e=>"true"===e.getAttribute("aria-selected"))??t[0];O(n.dataset.nebaValue??null)});const ne=d("flex list-none flex-col p-1",p[l],y[a],x,E[u],M);return e(h.Provider,{value:te,children:e("ul",{ref:G,role:"tree","aria-label":D,"aria-multiselectable":A||void 0,className:ne,style:{...g(o,c),"--n-tree-indent":w[l],"--n-tree-row":k[l],...I},onKeyDown:function(e){if(T?.(e),e.defaultPrevented)return;const t=B.current,n=e.target?.closest?.('[role="treeitem"]');if(!t||!n||!t.contains(n))return;if(e.target!==n)return;const r=N(t),a=r.indexOf(n);if(-1===a)return;const l=t=>{t&&(e.preventDefault(),O(t.dataset.nebaValue??null),t.focus())},o=e=>{const t=e.dataset.nebaValue;t&&Y.current.get(t)?.toggle()},i="rtl"===getComputedStyle(t).direction,d=i?"ArrowLeft":"ArrowRight",c=i?"ArrowRight":"ArrowLeft",u=n.getAttribute("aria-expanded");switch(e.key){case"ArrowDown":l(r[a+1]);break;case"ArrowUp":l(r[a-1]);break;case"Home":l(r[0]);break;case"End":l(r[r.length-1]);break;case d:"false"===u?(e.preventDefault(),o(n)):"true"===u&&l(r[a+1]);break;case c:"true"===u?(e.preventDefault(),o(n)):l(n.parentElement?.closest('[role="treeitem"]'));break;case"Enter":case" ":e.preventDefault();(("Enter"===e.key?n.querySelector(":scope > div > a[href]"):null)??n).click();break;default:if(1===[...e.key].length&&" "!==e.key&&!e.ctrlKey&&!e.metaKey&&!e.altKey){const t=s(e.key);l([...r.slice(a+1),...r.slice(0,a)].find(e=>s(e.querySelector("[data-neba-label]")?.textContent??"").startsWith(t)))}}},..._,children:P})})});export const TreeItem=/*@__PURE__*/r.forwardRef(function TreeItem({value:s,label:p,startIcon:f,endIcon:g,action:b,href:y,expandable:w,disabled:k=!1,selectable:E=!0,className:N,children:K,onClick:A,...V},D){const{size:R,density:M,disabled:I,expandedKeys:P,selectedKeys:T,activeKey:_,toggle:z,select:q,activate:F,register:L,multiple:H,keepMounted:O}=r.useContext(h),U=r.useId(),W=s??U,B=j(W),G=r.useRef(null),J=r.useCallback(e=>{G.current=e,"function"==typeof D?D(e):D&&(D.current=e)},[D]),Q=r.Children.toArray(K),X=w??Q.length>0,Y=X&&P.has(B),Z=T.has(B),$=k||I,ee=r.useRef({toggle:()=>{}});ee.current.toggle=()=>{!$&&X&&z(W)};const te=r.useContext(v);r.useEffect(()=>te?void 0:L(B,ee.current),[te,B,L]);const[ne,re]=r.useState(Y),[ae,le]=r.useState(Y),se=r.useRef(null);r.useEffect(()=>{if(Y){re(!0);const e=requestAnimationFrame(()=>le(!0));return()=>cancelAnimationFrame(e)}le(!1);const e=se.current;(null===e||getComputedStyle(e).transitionDuration.split(",").every(e=>0===parseFloat(e)))&&re(!1)},[Y]);const oe=d("flex min-w-0 flex-1 cursor-pointer items-center text-start","h-(--n-tree-row)",C[M][R],S[R],c[R],i[R],x,m,"group-focus-visible/tree-item:[outline:2px_solid_var(--n-ring)]","group-focus-visible/tree-item:outline-offset-[-2px]",$?"cursor-not-allowed text-(--neba-disabled-fg)":Z?"bg-(--n-soft-press) font-medium text-(--n-on-tint) hover:bg-(--n-soft-press)":"hover:bg-(--n-soft)"),ie=n(t,{children:[e("span",{"aria-hidden":"true",onClick:e=>{!$&&X&&(e.stopPropagation(),e.preventDefault(),G.current?.focus(),F(B),z(W))},className:d("flex h-[1lh] w-[1.15em] shrink-0 items-center justify-center","[transition:rotate_var(--neba-duration)_var(--neba-ease)]",X?"text-(--neba-muted-fg)":"",Y?"rotate-0":"-rotate-90 rtl:rotate-90"),children:X?e(o,{}):null}),u(f)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:f}):null,e("span",{"data-neba-label":"",className:"min-w-0 flex-1 truncate",children:p}),u(g)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:g}):null]});return n("li",{ref:J,role:"treeitem","aria-expanded":X?Y:void 0,"aria-selected":!!Z||(!H||!E)&&void 0,"aria-disabled":$||void 0,"data-neba-value":B,tabIndex:_===B?0:-1,className:d("group/tree-item relative block [outline:none]",N),onClick:function(e){e.stopPropagation(),$?e.preventDefault():(G.current?.focus(),F(B),A?.(e),e.defaultPrevented||(X&&z(W),E&&q(W)))},...V,children:[n("div",{className:"flex w-full items-center",children:[void 0===l(y)||$?e("div",{className:oe,children:ie}):e("a",{href:l(y),tabIndex:-1,className:oe,"aria-current":Z?"page":void 0,children:ie}),u(b)?e("span",{className:d("flex shrink-0 items-center",C[M][R]),onClick:e=>e.stopPropagation(),children:b}):null]}),X&&(ne||O)&&Q.length>0?e("div",{ref:se,"data-closing":Y?void 0:"",inert:a(!Y),className:d("grid [transition:grid-template-rows_var(--neba-duration)_var(--neba-ease)]",ae?"[grid-template-rows:1fr]":"[grid-template-rows:0fr] pointer-events-none"),onTransitionEnd:e=>{e.target!==e.currentTarget||"grid-template-rows"!==e.propertyName||Y||re(!1)},children:e("ul",{role:"group",className:"min-h-0 list-none overflow-hidden ps-(--n-tree-indent)",children:e(v.Provider,{value:te||!Y,children:K})})}):null]})});
|
|
@@ -51,6 +51,13 @@ export interface TypographyProps extends Omit<React.ComponentPropsWithoutRef<'p'
|
|
|
51
51
|
* escape hatch, so it behaves the same here as on Box.
|
|
52
52
|
*/
|
|
53
53
|
render?: useRender.RenderProp;
|
|
54
|
+
/**
|
|
55
|
+
* A Tailwind utility here wins over the level's own size, leading, tracking,
|
|
56
|
+
* weight, margins and colour, with or without a variant. Only Tailwind's
|
|
57
|
+
* names are read: a class from your own stylesheet needs two classes or
|
|
58
|
+
* `!important` to beat the level.
|
|
59
|
+
*/
|
|
60
|
+
className?: string;
|
|
54
61
|
children?: React.ReactNode;
|
|
55
62
|
}
|
|
56
63
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import*as e from"react";import{useRender as
|
|
1
|
+
"use client";import*as e from"react";import{useRender as t}from"@base-ui/react/use-render";import{transitionProps as n}from"../../internal/animate.js";import{COLOR as r,FONT_SIZE as a,FONT_WEIGHT as i,LETTER_SPACING as o,LINE_HEIGHT as l,MARGIN_BOTTOM as g,MARGIN_TOP as h,overriddenBy as m}from"../../internal/overrides.js";import{clampClasses as p,clampSlot as s,cx as c}from"../../internal/styles.js";const d={h1:{size:"1.875rem",leading:"1.2",tracking:"-0.02em"},h2:{size:"1.5rem",leading:"1.25",tracking:"-0.015em"},h3:{size:"1.25rem",leading:"1.3",tracking:"-0.01em"},h4:{size:"1.0625rem",leading:"1.41176",tracking:"normal"},h5:{size:"0.9375rem",leading:"1.46667",tracking:"normal"},h6:{size:"0.8125rem",leading:"1.53846",tracking:"normal"},lead:{size:"1.0625rem",leading:"1.64706",tracking:"normal"},body:{size:"0.8125rem",leading:"1.69231",tracking:"normal"},caption:{size:"0.75rem",leading:"1.5",tracking:"normal"},overline:{size:"0.6875rem",leading:"1.45455",tracking:"0.08em"}},y={h1:"semibold",h2:"semibold",h3:"semibold",h4:"semibold",h5:"semibold",h6:"semibold",lead:"regular",body:"regular",caption:"regular",overline:"medium"},b={regular:"var(--font-weight-normal, 400)",medium:"var(--font-weight-medium, 500)",semibold:"var(--font-weight-semibold, 600)",bold:"var(--font-weight-bold, 700)"},u={h1:"h1",h2:"h2",h3:"h3",h4:"h4",h5:"h5",h6:"h6",lead:"p",body:"p",caption:"span",overline:"span"},w=new Set(["caption","overline"]),f={h1:4,h2:3.5,h3:3,h4:2.5,h5:2,h6:2,lead:4,body:3,caption:2,overline:2},k=[[a,"[&.neba-typography]:text-(length:--n-type-size)","[:where(&)]:text-(length:--n-type-size)"],[l,"[&.neba-typography]:leading-(--n-type-leading)","[:where(&)]:leading-(--n-type-leading)"],[o,"[&.neba-typography]:tracking-(--n-type-tracking)","[:where(&)]:tracking-(--n-type-tracking)"],[i,"[&.neba-typography]:font-(weight:--n-type-weight)","[:where(&)]:font-(weight:--n-type-weight)"],[g,"[&.neba-typography]:mb-(--n-type-gutter)","[:where(&)]:mb-(--n-type-gutter)"]],v={start:"text-start",center:"text-center",end:"text-end",justify:"text-justify"};export const Typography=/*@__PURE__*/e.forwardRef(function Typography({level:a="body",color:i,weight:o,align:l,lines:g,gutter:z=!1,transition:x,render:j,className:N,style:T,children:$,...E},M){const R=n(x),S=e.useMemo(()=>m(N),[N]),q=d[a],A=w.has(a),B=c("neba-typography",...k.map(([e,t,n])=>S&e?n:t),z?"":S&h?"[:where(&)]:mt-0":"[&.neba-typography]:mt-0","overline"===a?"uppercase":"",l?v[l]:"","span"!==u[a]||!l&&!z||void 0!==g&&g>1?"":"block",g?p(g):"",i?S&r?"[:where(&)]:text-(--n-accent)":"[&.neba-typography]:text-(--n-accent)":A?S&r?"[:where(&)]:text-(--neba-muted-fg)":"[&.neba-typography]:text-(--neba-muted-fg)":"",R.className,N??"");return t({render:j??e.createElement(u[a]),ref:M,props:{className:B,style:{"--n-type-size":q.size,"--n-type-leading":q.leading,"--n-type-tracking":q.tracking,"--n-type-weight":b[o??y[a]],"--n-type-gutter":z?`calc(var(--spacing, 0.25rem) * ${f[a]})`:"0",...i?{"--n-accent":`var(--neba-${i}-accent)`}:null,...s(g),...R.style,...T},children:$,...E}})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as i from"react";import{
|
|
1
|
+
"use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as i from"react";import{useLayoutEffectOnClient as o}from"../../internal/layout-effect.js";import{useRender as r}from"@base-ui/react/use-render";import{beginPointerDrag as s,drawnScale as a}from"../../internal/drag.js";import{actionMessages as l,useMessages as d,windowMessages as c}from"../../internal/i18n.js";import{cx as u,hasContent as h,iconClasses as m,surfaceClasses as f}from"../../internal/styles.js";import{WindowControls as g,orderControls as w,windowChrome as p,windowMetrics as b,windowSlots as x}from"../../internal/window.js";import{inertValue as v}from"../../internal/inert.js";import{useStyleDefaults as y}from"../../internal/defaults.js";function z(e,t,n){const[o,r]=i.useState(t),s=void 0!==e;return[s?e:o,i.useCallback(e=>{s||r(e),n?.(e)},[s,n])]}const M=[{edge:"n",className:"inset-x-3 top-0 h-1.5 cursor-ns-resize"},{edge:"s",className:"inset-x-3 bottom-0 h-1.5 cursor-ns-resize"},{edge:"w",className:"inset-y-3 left-0 w-1.5 cursor-ew-resize"},{edge:"e",className:"inset-y-3 right-0 w-1.5 cursor-ew-resize"},{edge:"nw",className:"top-0 left-0 size-3 cursor-nwse-resize"},{edge:"ne",className:"top-0 right-0 size-3 cursor-nesw-resize"},{edge:"sw",className:"bottom-0 left-0 size-3 cursor-nesw-resize"},{edge:"se",className:"right-0 bottom-0 size-3 cursor-nwse-resize"}],E=[];export const WindowPane=/*@__PURE__*/i.forwardRef(function WindowPane(N,S){const{os:H="macos",title:k,icon:C,actions:L,controls:j=!0,size:W="md",color:I="primary",accent:P=!1,transparency:D=0,active:T,elevation:A=2,position:O="static",draggable:R=!1,resizable:B=!1,width:X,height:$,minWidth:F=180,minHeight:Y,offset:_,defaultOffset:q,onOffsetChange:K,onResize:U,open:G,defaultOpen:J=!0,onOpenChange:Q,minimized:V,defaultMinimized:Z=!1,onMinimizedChange:ee,maximized:te,defaultMaximized:ne=!1,onMaximizedChange:ie,scroll:oe=!0,locale:re,minimizeLabel:se,maximizeLabel:ae,restoreLabel:le,closeLabel:de,resizeLabel:ce,render:ue,className:he,style:me,children:fe,...ge}=y(N,["size","locale"]),we=d(c,re),pe=i.useId(),be=d(l,re),xe=p(H),ve=b(H,W),ye=i.useId(),[ze,Me]=z(G,J,Q),[Ee,Ne]=z(V,Z,ee),[Se,He]=z(te,ne,ie),[ke,Ce]=z(_,q??{x:0,y:0},K),[Le,je]=i.useState(null),[We,Ie]=i.useState({width:X,height:$});We.width===X&&We.height===$||(Ie({width:X,height:$}),je(null));const[Pe,De]=i.useState(!0),Te=T??Pe,[Ae,Oe]=i.useState(null),[Re,Be]=i.useState(null),[Xe,$e]=i.useState(!1),[Fe,Ye]=i.useState(!1),[_e,qe]=i.useState(ze);_e!==ze&&(qe(ze),Ye(!ze)),i.useEffect(()=>{if(!Fe)return;const e=window.setTimeout(()=>Ye(!1),260);return()=>window.clearTimeout(e)},[Fe]);const Ke=i.useRef(null),Ue=i.useCallback(e=>{Ke.current=e,"function"==typeof S?S(e):S&&(S.current=e)},[S]);i.useEffect(()=>{if(void 0!==T||!ze)return;const e=Ke.current;if(!e)return;const t=e=>De(e);E.push(t);const n=n=>{const i=n.target;if(!(i instanceof Node))return;if(e.contains(i))return E.splice(E.indexOf(t),1),E.push(t),void De(!0);const o=i instanceof Element?i:i.parentElement;o?.closest(".neba-window")&&De(!1)};return document.addEventListener("pointerdown",n,!0),document.addEventListener("focusin",n,!0),()=>{document.removeEventListener("pointerdown",n,!0),document.removeEventListener("focusin",n,!0);const e=E.indexOf(t),i=e===E.length-1;E.splice(e,1),i&&E[E.length-1]?.(!0)}},[T,ze]);const Ge=i.useRef(null);function Je(e,t){if(0!==e.button)return;Ge.current?.();const n=e.currentTarget,i=e.clientX,o=e.clientY,r=Ke.current,l=r?a(r):{x:1,y:1};$e(!0);const d=()=>{Ge.current=null,$e(!1)},c=s({target:n,pointerId:e.pointerId,onMove:e=>t((e.clientX-i)/l.x,(e.clientY-o)/l.y),onEnd:d});Ge.current=()=>{c(),d()}}i.useEffect(()=>()=>Ge.current?.(),[]);const Qe={width:Math.max(0,F),height:Math.max(ve.bar,Y??ve.bar)};function Ve(e){je(e),U?.(e)}const Ze=w(H,!0===j?["minimize","maximize","close"]:!1===j?[]:j),et=Ze.includes("maximize");o(()=>{if(!Ee||null!==Ae)return;const e=Ke.current,t=e?.firstElementChild;e&&t instanceof HTMLElement&&Oe(t.offsetHeight+(e.offsetHeight-e.clientHeight))},[Ee,Ae]),i.useEffect(()=>{if(Ee||null===Re)return;const e=window.setTimeout(()=>Be(null),400);return()=>window.clearTimeout(e)},[Ee,Re]);const tt={minimize:se??we.minimize,maximize:ae??we.maximize,restore:le??we.restore,close:de??be.close},nt=e(g,{os:H,metrics:ve,controls:Ze,maximized:Se,active:Te,labels:tt,onCommand:function(e){"close"===e?Me(!1):"minimize"===e?function(e){const t=Ke.current,n=t?.firstElementChild;if(t&&n instanceof HTMLElement&&Oe(n.offsetHeight+(t.offsetHeight-t.clientHeight)),e&&void 0===(Le?.height??$)&&t)return Be(t.offsetHeight),void requestAnimationFrame(()=>Ne(!0));Ne(e)}(!Ee):He(!Se)}}),it=h(k)?e("span",{id:ye,className:"min-w-0 truncate",children:k}):null,ot=h(C)?e("span",{className:"flex shrink-0 items-center",children:C}):null,rt=t("div",{className:u("relative flex shrink-0 items-center select-none",m,R&&!Se?"cursor-grab touch-none active:cursor-grabbing":""),style:{height:ve.bar,textShadow:"var(--n-window-bar-shadow)",fontWeight:ve.weight,paddingInlineStart:ve.padX,paddingInlineEnd:ve.padEnd,gap:Math.round(.7*ve.title),fontSize:ve.title,backgroundColor:"var(--n-window-bar)",backgroundImage:"var(--n-window-bar-image)",color:"var(--n-window-bar-fg)",borderBlockEnd:xe.rule?"1px solid var(--n-window-line)":void 0},onPointerDown:function(e){if(!R||Se)return;const t={...ke},n=Ke.current,i="fixed"===O?{width:document.documentElement.clientWidth,height:document.documentElement.clientHeight}:"absolute"===O&&n?.offsetParent instanceof HTMLElement?{width:n.offsetParent.clientWidth,height:n.offsetParent.clientHeight}:null,o=n?.offsetWidth??0,r=Math.min(o,48);Je(e,(e,n)=>{const s=t.x+e,a=t.y+n;Ce(i?{x:Math.min(Math.max(s,r-o),i.width-r),y:Math.min(Math.max(a,0),Math.max(0,i.height-ve.bar))}:{x:s,y:a})})},onDoubleClick:et?()=>He(!Se):void 0,children:["start"===xe.controlsSide?nt:null,"center"===xe.titleAlign?e("span",{"aria-hidden":"true",className:"pointer-events-none absolute inset-x-0 flex items-center justify-center",style:{paddingInline:ve.controlsWidth(Ze.length)+2*ve.padX},children:t("span",{className:"flex min-w-0 items-center",style:{gap:Math.round(.5*ve.title)},children:[ot,it]})}):t(n,{children:[ot,it]}),e("span",{className:"flex-1"}),h(L)?e("span",{className:"flex shrink-0 items-center",style:{gap:Math.round(.5*ve.title)},onPointerDown:e=>e.stopPropagation(),onDoubleClick:e=>e.stopPropagation(),children:L}):null,"end"===xe.controlsSide?nt:null]}),st=Se?{left:0,top:0,width:"100%",height:"100%"}:{left:ke.x,top:ke.y,width:Le?.width??X,height:Ee?Ae??ve.bar:Le?.height??$??Re??void 0},at=r({render:ue,ref:Ue,props:{role:"group","aria-labelledby":it?ye:void 0,className:u("neba-window relative flex min-w-0 flex-col overflow-hidden",D>0?f:"",xe.glass&&0===D?"[backdrop-filter:var(--neba-blur)]":"","[transition-property:left,top,width,height,opacity,box-shadow,background-color,border-color,border-radius]","[transition-duration:var(--neba-duration-window)]","[transition-timing-function:var(--neba-ease)]","motion-reduce:[transition-duration:0ms]","data-[gesture]:[transition-property:none]",he),"data-gesture":Xe?"":void 0,inert:v(!ze),style:{opacity:ze?void 0:0,...x({os:H,color:I,accent:P,transparency:D,active:Te,elevation:A}),position:"static"===O?"relative":O,...st,borderRadius:Se?0:`${ve.radius}px ${ve.radius}px ${ve.radiusBottom}px ${ve.radiusBottom}px`,borderStyle:"solid",borderWidth:ve.frame,borderColor:"var(--n-window-line)",backgroundColor:"var(--n-window-band)",boxShadow:"var(--n-window-shadow), var(--neba-plate-glass)",...me},children:t(n,{children:[rt,e("div",{className:u("min-h-0 flex-1",oe?"overflow-auto":"overflow-hidden"),style:{backgroundColor:"var(--n-window-body)",marginInline:ve.band.side,marginBottom:ve.band.bottom,boxShadow:ve.band.side>0?"inset 0 0 0 1px rgb(0 0 0 / 0.12)":void 0},inert:v(Ee),children:fe}),!B||Se||Ee?null:e("span",{id:pe,hidden:!0,children:we.resizeHint}),!B||Se||Ee?null:M.map(t=>{const n="se"===t.edge;return e("div",{role:n?"button":void 0,tabIndex:n?0:void 0,"aria-label":n?ce??we.resize:void 0,"aria-describedby":n?pe:void 0,"aria-hidden":n?void 0:"true",className:u("absolute z-10 touch-none",t.className,n?"neba-hit":"",n?"focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]":""),onPointerDown:e=>function(e,t){const n=Ke.current;if(!n||Se)return;const i={width:n.offsetWidth,height:n.offsetHeight,x:ke.x,y:ke.y},o=e.includes("e"),r=e.includes("w"),s=e.includes("n"),a=e.includes("s");Je(t,(e,t)=>{let{width:n,height:l}=i,{x:d,y:c}=i;o&&(n=Math.max(Qe.width,i.width+e)),a&&(l=Math.max(Qe.height,i.height+t)),r&&(n=Math.max(Qe.width,i.width-e),d=i.x+(i.width-n)),s&&(l=Math.max(Qe.height,i.height-t),c=i.y+(i.height-l)),Ve({width:n,height:l}),(r||s)&&Ce({x:d,y:c})})}(t.edge,e),onKeyDown:n?e=>{const t={ArrowRight:[16,0],ArrowLeft:[-16,0],ArrowDown:[0,16],ArrowUp:[0,-16]}[e.key];t&&(e.preventDefault(),function(e,t){const n=Ke.current;n&&Ve({width:Math.max(Qe.width,n.offsetWidth+e),height:Math.max(Qe.height,n.offsetHeight+t)})}(t[0],t[1]))}:void 0},t.edge)})]}),...ge}});return ze||Fe?at:null});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import*as t from"react";import{attachedRef as
|
|
1
|
+
"use client";import*as t from"react";import{useLayoutEffectOnClient as e}from"../internal/layout-effect.js";import{attachedRef as i,observeResize as n}from"../internal/observe.js";export function useElementSize(){const[h,r]=t.useState(null),[o]=t.useState(()=>i(r)),[s,u]=t.useState({width:0,height:0});return e(()=>{if(!h)return;const t=()=>{const t=function(t){return t instanceof HTMLElement?{width:t.offsetWidth,height:t.offsetHeight}:t.getBoundingClientRect()}(h);u(e=>e.width===t.width&&e.height===t.height?e:{width:t.width,height:t.height})};return t(),n(h,t)},[h]),[o,s]}
|
package/dist/index.d.ts
CHANGED
|
@@ -39,6 +39,7 @@ export * from './components/card/index.js';
|
|
|
39
39
|
export * from './components/carousel/index.js';
|
|
40
40
|
export * from './components/chat-bubble/index.js';
|
|
41
41
|
export * from './components/checkbox/index.js';
|
|
42
|
+
export * from './components/checkbox-group/index.js';
|
|
42
43
|
export * from './components/chip/index.js';
|
|
43
44
|
export * from './components/code-block/index.js';
|
|
44
45
|
export * from './components/collapsible/index.js';
|
package/dist/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export*from"./types.js";export*from"./hooks/index.js";export*from"./components/accordion/index.js";export*from"./components/agent-steps/index.js";export*from"./components/alert/index.js";export*from"./components/anchor/index.js";export*from"./components/animate-appear/index.js";export*from"./components/app-logo/index.js";export*from"./components/approval/index.js";export*from"./components/animate-blink/index.js";export*from"./components/animate-counter/index.js";export*from"./components/animate-fade/index.js";export*from"./components/animate-float/index.js";export*from"./components/animate-grow/index.js";export*from"./components/animate-headline/index.js";export*from"./components/animate-lighting/index.js";export*from"./components/animate-marquee/index.js";export*from"./components/animate-reveal/index.js";export*from"./components/animate-rotate/index.js";export*from"./components/animate-scramble/index.js";export*from"./components/animate-shake/index.js";export*from"./components/animate-split/index.js";export*from"./components/animate-slide/index.js";export*from"./components/animate-typing/index.js";export*from"./components/animate-zoom/index.js";export*from"./components/area-chart/index.js";export*from"./components/aspect-ratio/index.js";export*from"./components/avatar/index.js";export*from"./components/badge/index.js";export*from"./components/bar-chart/index.js";export*from"./components/blockquote/index.js";export*from"./components/bottom-navigation/index.js";export*from"./components/box/index.js";export*from"./components/breadcrumb/index.js";export*from"./components/button/index.js";export*from"./components/button-group/index.js";export*from"./components/calendar/index.js";export*from"./components/card/index.js";export*from"./components/carousel/index.js";export*from"./components/chat-bubble/index.js";export*from"./components/checkbox/index.js";export*from"./components/chip/index.js";export*from"./components/code-block/index.js";export*from"./components/collapsible/index.js";export*from"./components/color-picker/index.js";export*from"./components/combobox/index.js";export*from"./components/command-palette/index.js";export*from"./components/confirm/index.js";export*from"./components/container/index.js";export*from"./components/context-window/index.js";export*from"./components/data-list/index.js";export*from"./components/data-table/index.js";export*from"./components/date-picker/index.js";export*from"./components/date-range-picker/index.js";export*from"./components/date-time-picker/index.js";export*from"./components/dialog/index.js";export*from"./components/divider/index.js";export*from"./components/drawer/index.js";export*from"./components/empty/index.js";export*from"./components/fieldset/index.js";export*from"./components/file-picker/index.js";export*from"./components/flex/index.js";export*from"./components/form/index.js";export*from"./components/gallery/index.js";export*from"./components/gauge-chart/index.js";export*from"./components/grid/index.js";export*from"./components/floating-action-button/index.js";export*from"./components/floating-bottom-navigation/index.js";export*from"./components/footer/index.js";export*from"./components/grid-container/index.js";export*from"./components/header/index.js";export*from"./components/heatmap-chart/index.js";export*from"./components/highlight/index.js";export*from"./components/hover-card/index.js";export*from"./components/how-to-steps/index.js";export*from"./components/icon/index.js";export*from"./components/icon-button/index.js";export*from"./components/image/index.js";export*from"./components/inline-citation/index.js";export*from"./components/line-chart/index.js";export*from"./components/list/index.js";export*from"./components/menu/index.js";export*from"./components/menubar/index.js";export*from"./components/meter/index.js";export*from"./components/mockup/index.js";export*from"./components/navigation-menu/index.js";export*from"./components/number-field/index.js";export*from"./components/otp-field/index.js";export*from"./components/overlay/index.js";export*from"./components/page-layout/index.js";export*from"./components/pagination/index.js";export*from"./components/panes/index.js";export*from"./components/pie-chart/index.js";export*from"./components/pill/index.js";export*from"./components/popconfirm/index.js";export*from"./components/popover/index.js";export*from"./components/portal/index.js";export*from"./components/progress-box/index.js";export*from"./components/progress-circular/index.js";export*from"./components/progress-linear/index.js";export*from"./components/prompt-input/index.js";export*from"./components/provider/index.js";export*from"./components/radio-group/index.js";export*from"./components/reasoning/index.js";export*from"./components/rating/index.js";export*from"./components/scatter-chart/index.js";export*from"./components/scroll-area/index.js";export*from"./components/scroll-zone/index.js";export*from"./components/segmented-button/index.js";export*from"./components/select/index.js";export*from"./components/shortcut/index.js";export*from"./components/show/index.js";export*from"./components/sidebar/index.js";export*from"./components/skeleton/index.js";export*from"./components/slider/index.js";export*from"./components/sparkline/index.js";export*from"./components/spoiler/index.js";export*from"./components/sources/index.js";export*from"./components/stack/index.js";export*from"./components/statistic/index.js";export*from"./components/streaming-text/index.js";export*from"./components/switch/index.js";export*from"./components/table/index.js";export*from"./components/tabs/index.js";export*from"./components/text-field/index.js";export*from"./components/text-link/index.js";export*from"./components/time-picker/index.js";export*from"./components/timeline/index.js";export*from"./components/timeline-chart/index.js";export*from"./components/toast/index.js";export*from"./components/toggle/index.js";export*from"./components/toggle-group/index.js";export*from"./components/toolbar/index.js";export*from"./components/tool-call/index.js";export*from"./components/tooltip/index.js";export*from"./components/tour/index.js";export*from"./components/transfer/index.js";export*from"./components/tree-select/index.js";export*from"./components/tree-view/index.js";export*from"./components/typography/index.js";export*from"./components/visually-hidden/index.js";export*from"./components/window-pane/index.js";
|
|
1
|
+
export*from"./types.js";export*from"./hooks/index.js";export*from"./components/accordion/index.js";export*from"./components/agent-steps/index.js";export*from"./components/alert/index.js";export*from"./components/anchor/index.js";export*from"./components/animate-appear/index.js";export*from"./components/app-logo/index.js";export*from"./components/approval/index.js";export*from"./components/animate-blink/index.js";export*from"./components/animate-counter/index.js";export*from"./components/animate-fade/index.js";export*from"./components/animate-float/index.js";export*from"./components/animate-grow/index.js";export*from"./components/animate-headline/index.js";export*from"./components/animate-lighting/index.js";export*from"./components/animate-marquee/index.js";export*from"./components/animate-reveal/index.js";export*from"./components/animate-rotate/index.js";export*from"./components/animate-scramble/index.js";export*from"./components/animate-shake/index.js";export*from"./components/animate-split/index.js";export*from"./components/animate-slide/index.js";export*from"./components/animate-typing/index.js";export*from"./components/animate-zoom/index.js";export*from"./components/area-chart/index.js";export*from"./components/aspect-ratio/index.js";export*from"./components/avatar/index.js";export*from"./components/badge/index.js";export*from"./components/bar-chart/index.js";export*from"./components/blockquote/index.js";export*from"./components/bottom-navigation/index.js";export*from"./components/box/index.js";export*from"./components/breadcrumb/index.js";export*from"./components/button/index.js";export*from"./components/button-group/index.js";export*from"./components/calendar/index.js";export*from"./components/card/index.js";export*from"./components/carousel/index.js";export*from"./components/chat-bubble/index.js";export*from"./components/checkbox/index.js";export*from"./components/checkbox-group/index.js";export*from"./components/chip/index.js";export*from"./components/code-block/index.js";export*from"./components/collapsible/index.js";export*from"./components/color-picker/index.js";export*from"./components/combobox/index.js";export*from"./components/command-palette/index.js";export*from"./components/confirm/index.js";export*from"./components/container/index.js";export*from"./components/context-window/index.js";export*from"./components/data-list/index.js";export*from"./components/data-table/index.js";export*from"./components/date-picker/index.js";export*from"./components/date-range-picker/index.js";export*from"./components/date-time-picker/index.js";export*from"./components/dialog/index.js";export*from"./components/divider/index.js";export*from"./components/drawer/index.js";export*from"./components/empty/index.js";export*from"./components/fieldset/index.js";export*from"./components/file-picker/index.js";export*from"./components/flex/index.js";export*from"./components/form/index.js";export*from"./components/gallery/index.js";export*from"./components/gauge-chart/index.js";export*from"./components/grid/index.js";export*from"./components/floating-action-button/index.js";export*from"./components/floating-bottom-navigation/index.js";export*from"./components/footer/index.js";export*from"./components/grid-container/index.js";export*from"./components/header/index.js";export*from"./components/heatmap-chart/index.js";export*from"./components/highlight/index.js";export*from"./components/hover-card/index.js";export*from"./components/how-to-steps/index.js";export*from"./components/icon/index.js";export*from"./components/icon-button/index.js";export*from"./components/image/index.js";export*from"./components/inline-citation/index.js";export*from"./components/line-chart/index.js";export*from"./components/list/index.js";export*from"./components/menu/index.js";export*from"./components/menubar/index.js";export*from"./components/meter/index.js";export*from"./components/mockup/index.js";export*from"./components/navigation-menu/index.js";export*from"./components/number-field/index.js";export*from"./components/otp-field/index.js";export*from"./components/overlay/index.js";export*from"./components/page-layout/index.js";export*from"./components/pagination/index.js";export*from"./components/panes/index.js";export*from"./components/pie-chart/index.js";export*from"./components/pill/index.js";export*from"./components/popconfirm/index.js";export*from"./components/popover/index.js";export*from"./components/portal/index.js";export*from"./components/progress-box/index.js";export*from"./components/progress-circular/index.js";export*from"./components/progress-linear/index.js";export*from"./components/prompt-input/index.js";export*from"./components/provider/index.js";export*from"./components/radio-group/index.js";export*from"./components/reasoning/index.js";export*from"./components/rating/index.js";export*from"./components/scatter-chart/index.js";export*from"./components/scroll-area/index.js";export*from"./components/scroll-zone/index.js";export*from"./components/segmented-button/index.js";export*from"./components/select/index.js";export*from"./components/shortcut/index.js";export*from"./components/show/index.js";export*from"./components/sidebar/index.js";export*from"./components/skeleton/index.js";export*from"./components/slider/index.js";export*from"./components/sparkline/index.js";export*from"./components/spoiler/index.js";export*from"./components/sources/index.js";export*from"./components/stack/index.js";export*from"./components/statistic/index.js";export*from"./components/streaming-text/index.js";export*from"./components/switch/index.js";export*from"./components/table/index.js";export*from"./components/tabs/index.js";export*from"./components/text-field/index.js";export*from"./components/text-link/index.js";export*from"./components/time-picker/index.js";export*from"./components/timeline/index.js";export*from"./components/timeline-chart/index.js";export*from"./components/toast/index.js";export*from"./components/toggle/index.js";export*from"./components/toggle-group/index.js";export*from"./components/toolbar/index.js";export*from"./components/tool-call/index.js";export*from"./components/tooltip/index.js";export*from"./components/tour/index.js";export*from"./components/transfer/index.js";export*from"./components/tree-select/index.js";export*from"./components/tree-view/index.js";export*from"./components/typography/index.js";export*from"./components/visually-hidden/index.js";export*from"./components/window-pane/index.js";
|
package/dist/internal/animate.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e}from"react/jsx-runtime";import*as n from"react";import{
|
|
1
|
+
"use client";import{jsx as e}from"react/jsx-runtime";import*as n from"react";import{useLayoutEffectOnClient as t}from"./layout-effect.js";import{observeVisibility as a}from"./observe.js";import{cx as r}from"./styles.js";export const animationClasses={fade:"neba-anim-fade",grow:"neba-anim-scale",slide:"neba-anim-slide",zoom:"neba-anim-scale",rotate:"neba-anim-rotate",blink:"neba-anim-blink",reveal:"neba-anim-reveal"};export const animBaseClass="neba-anim";export const childAnimations=":scope > .neba-anim";export const defaultDurations={fade:320,grow:340,slide:380,zoom:340,rotate:460,blink:900,reveal:620};export function revealClip(e){switch(e){case"top":return"inset(0 0 100% 0)";case"bottom":return"inset(100% 0 0 0)";case"right":return"inset(0 0 0 100%)";default:return"inset(0 100% 0 0)"}}export function lengthValue(e){return"number"==typeof e?`${e}px`:e}export function isInfinite(e){return"infinite"===e}export function animationSlots(e){const n={"--n-anim-duration":`${e.duration}ms`,"--n-anim-delay":`${e.delay}ms`,"--n-anim-repeat":(r=e.repeat,"infinite"===r?"infinite":String(r)),"--n-anim-direction":(t=e.mode??"in",a=e.alternate,"out"===t?a?"alternate-reverse":"reverse":a?"alternate":"normal")};var t,a,r;return e.easing&&(n["--n-anim-ease"]=e.easing),void 0!==e.opacity&&(n["--n-anim-opacity"]=String(e.opacity)),void 0!==e.scale&&(n["--n-anim-scale"]=String(e.scale)),void 0!==e.x&&(n["--n-anim-x"]=e.x),void 0!==e.y&&(n["--n-anim-y"]=e.y),void 0!==e.angle&&(n["--n-anim-angle"]=e.angle),void 0!==e.angleTo&&(n["--n-anim-angle-to"]=e.angleTo),void 0!==e.clip&&(n["--n-anim-clip"]=e.clip),"view"===e.timeline&&(n["--n-anim-timeline"]="view()",n["--n-anim-range"]=e.range??"entry 0% cover 45%"),n}export function slideOffsets(e,n){const t=lengthValue(n),a="number"==typeof n?-n+"px":`calc(-1 * ${t})`;switch(e){case"top":return{x:"0px",y:a};case"bottom":return{x:"0px",y:t};case"left":return{x:a,y:"0px"};default:return{x:t,y:"0px"}}}export function staggers({stagger:e,durationStep:n}){return 0!==e||0!==n}export function staggerChildren(t,a,i,{stagger:o,durationStep:s,reverse:l}){const c=n.Children.toArray(t);return c.map((t,u)=>{const m=l?c.length-1-u:u,f=animationSlots({...i,delay:i.delay+m*o,duration:Math.max(0,i.duration+m*s)});if(!n.isValidElement(t))return e("span",{className:a,style:f,children:t},u);const d=t.props;return n.cloneElement(t,{className:r(a,d.className),style:{...f,...d.style}})})}export const MIN_BLINK_DURATION=334;export function transitionProps(e){const n=transitionParts(e);return n?{className:`neba-anim ${animationClasses[n.effect]}`,style:{...animationSlots(n.slots),"--n-anim-state":"running"}}:{className:"",style:{}}}export function transitionParts(e){if(!e)return null;const n="string"==typeof e?{type:e}:e,{type:t}=n,a=n.duration??defaultDurations[t],r={duration:"blink"===t?Math.max(a,334):a,delay:n.delay??0,easing:n.easing,repeat:n.repeat??("blink"===t?"infinite":1),alternate:n.alternate,timeline:n.timeline,range:n.range};if("grow"!==t&&"zoom"!==t||(r.scale=n.scale??("zoom"===t?.4:.8)),"slide"===t){const{x:e,y:t}=slideOffsets(n.from??"bottom",n.distance??"100%");r.x=e,r.y=t}return"rotate"===t&&(r.angle=`${n.angle??-180}deg`),"reveal"===t&&(r.clip=revealClip(n.side??"left")),{effect:t,slots:r}}export{usePrefersReducedMotion}from"./media.js";export function useAnimationRun({trigger:e,play:r,once:i,threshold:o,paused:s,infinite:l,caller:c,parts:u}){const m=n.useRef(null),[f,d]=n.useState("mount"===e),[p,g]=n.useState(0),[y,x]=n.useState(!1),v=n.useCallback(()=>{d(!0),g(e=>e+1)},[]);t(()=>{const e=m.current;if(!e||0===p)return;const n=[e,...u?e.querySelectorAll(u):[]];for(const e of n)e.style.animationName="none";e.offsetWidth;for(const e of n)e.style.animationName=""},[p,u]),n.useEffect(()=>{if("visible"!==e)return;const n=m.current;if(!n)return;let t=null;if(t=a(n,o,e=>{e?(v(),i&&(t?.(),t=null)):i||d(!1)}),t)return()=>t?.();d(!0)},[e,i,o,v]),n.useEffect(()=>{const e=m.current;if(l&&e)return a(e,0,e=>x(!e))??void 0},[l]),n.useEffect(()=>{"manual"===e&&(r?v():d(!1))},[e,r,v]);const b=e=>e.relatedTarget instanceof Node&&e.currentTarget.contains(e.relatedTarget),h="hover"===e?{onPointerEnter:e=>{c?.onPointerEnter?.(e),v()},onFocus:e=>{c?.onFocus?.(e),b(e)||v()},onPointerLeave:e=>{c?.onPointerLeave?.(e),l&&d(!1)},onBlur:e=>{c?.onBlur?.(e),l&&!b(e)&&d(!1)}}:{};return{ref:n.useCallback(e=>{m.current=e},[]),state:!f||s||l&&y?"paused":"running",started:f,run:p,handlers:h,offscreen:l&&y}}export function useAnimateElement(e){const{effect:n,trigger:t,play:a,once:r,threshold:i,paused:o,infinite:s,caller:l,children:c,stagger:u=0,durationStep:m=0,reverse:f=!1,effectClass:d,name:p,...g}=e,y=n?animationClasses[n]:d,x=y?`neba-anim ${y}`:"",v=""!==x&&staggers({stagger:u,durationStep:m,reverse:f}),b=useAnimationRun({trigger:t,play:a,once:r,threshold:i,paused:o,infinite:s,caller:l,parts:v?childAnimations:void 0}),h="view"===g.timeline?"running":b.state;return{ref:b.ref,className:v?"":x,style:v?{"--n-anim-state":h}:{...animationSlots(g),"--n-anim-state":h},props:{...b.handlers,"data-neba-animation":p??n??void 0,"data-state":h},children:v?staggerChildren(c,x,g,{stagger:u,durationStep:m,reverse:f}):c}}
|
|
@@ -114,7 +114,7 @@ export interface CalendarProps {
|
|
|
114
114
|
* grid instead of walking forty-two cells — the pattern the ARIA date-picker
|
|
115
115
|
* practice describes, and the reason none of the cells is a `disabled` button.
|
|
116
116
|
*/
|
|
117
|
-
export declare function Calendar({ size, color, locale, weekStartsOn, month, onMonthChange, selected, rangeStart, rangeEnd, onSelect, granularity, renderDay, onPreviewChange, minDate, maxDate, shouldDisableDate, showOutsideDays, autoFocus, multiselectable, showPreviousButton, showNextButton, labels, className }: CalendarProps): React.JSX.Element;
|
|
117
|
+
export declare function Calendar({ size, color, locale: callerLocale, weekStartsOn, month, onMonthChange, selected, rangeStart, rangeEnd, onSelect, granularity, renderDay, onPreviewChange, minDate, maxDate, shouldDisableDate, showOutsideDays, autoFocus, multiselectable, showPreviousButton, showNextButton, labels, className }: CalendarProps): React.JSX.Element;
|
|
118
118
|
export type { TimeUnit };
|
|
119
119
|
export interface TimeGridProps {
|
|
120
120
|
size: NebaSize;
|
|
@@ -150,4 +150,4 @@ export interface TimeGridProps {
|
|
|
150
150
|
* only imperative work here and it is not optional: a column of sixty minutes
|
|
151
151
|
* that opens at `00` while the value is `45` has hidden its own answer.
|
|
152
152
|
*/
|
|
153
|
-
export declare function TimeGrid({ size, density, locale, value, referenceDate, onChange, hour12, showSeconds, hourStep, minuteStep, secondStep, shouldDisableTime, autoFocus, labels, className }: TimeGridProps): React.JSX.Element;
|
|
153
|
+
export declare function TimeGrid({ size, density, locale: callerLocale, value, referenceDate, onChange, hour12, showSeconds, hourStep, minuteStep, secondStep, shouldDisableTime, autoFocus, labels, className }: TimeGridProps): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as r from"react";import{Button as o}from"../components/button/Button.js";import{ChevronIcon as l}from"./icons.js";import{controlHeightClasses as a,controlTextClasses as s,cx as i,gapClasses as c,metaTextClasses as d,pressTransitionClasses as u,srOnlyClasses as m,transitionClasses as h}from"./styles.js";import{addDays as f,addMonths as g,addYears as b,calendarWeeks as p,compareDay as y,isDayOutside as v,isMonthBeforeYear as x,isSameDay as w,isSameMonth as D,isUnitOutside as N,isValidDate as S,makeDate as M,meridiemLabels as C,monthLabels as k,startOfDay as z,startOfMonth as P,today as A,weekdayLabels as j,withTime as Y,YEAR_PAGE_SIZE as E,yearPageStart as B}from"./date.js";import{dateFormatter as F}from"./format.js";import{pickerMessages as T,useMessages as H}from"./i18n.js";import{useHydrated as R}from"./media.js";export function usePickerLabels(e,t){const n=H(T,t);return r.useMemo(()=>e?{...n,...e}:n,[n,e])}const I={xs:"1.375rem",sm:"1.625rem",md:"2rem",lg:"2.5rem",xl:"3rem"},K={xs:"rounded-(--neba-radius-xs)",sm:"rounded-(--neba-radius-xs)",md:"rounded-(--neba-radius-sm)",lg:"rounded-(--neba-radius-md)",xl:"rounded-(--neba-radius-lg)"},G={xs:"rounded-s-(--neba-radius-xs)",sm:"rounded-s-(--neba-radius-xs)",md:"rounded-s-(--neba-radius-sm)",lg:"rounded-s-(--neba-radius-md)",xl:"rounded-s-(--neba-radius-lg)"},O={xs:"rounded-e-(--neba-radius-xs)",sm:"rounded-e-(--neba-radius-xs)",md:"rounded-e-(--neba-radius-sm)",lg:"rounded-e-(--neba-radius-md)",xl:"rounded-e-(--neba-radius-lg)"},U=["neba-calendar-cell relative flex select-none items-center justify-center tabular-nums","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",h,u,"focus-visible:z-10 focus-visible:[outline:2px_solid_var(--n-ring)]","focus-visible:[outline-offset:-2px]"].join(" ");function Cell({children:n,label:r,selected:o,inRange:l=!1,rangeEdge:a=null,current:s=!1,muted:c=!1,disabled:d=!1,focused:u=!1,size:m,className:h,onClick:f,onPointerEnter:g,onKeyDown:b}){return t("button",{type:"button",role:"gridcell","aria-label":r,"aria-selected":o,"aria-current":s?"date":void 0,"aria-disabled":d||void 0,tabIndex:u?0:-1,"data-focus-target":u?"true":void 0,className:i(U,"start"===a?G[m]:"end"===a?O[m]:"middle"===a?"rounded-none":K[m],d?"cursor-not-allowed text-(--neba-disabled-fg)":o?"cursor-pointer bg-(--n-fill) font-semibold text-(--n-on-solid) hover:bg-(--n-fill-hover) active:bg-(--n-fill-active)":l?"cursor-pointer bg-(--n-soft) text-(--neba-fg) hover:bg-(--n-soft-hover) active:bg-(--n-soft-press)":s?"cursor-pointer font-semibold text-(--n-on-tint) hover:bg-(--n-soft) active:bg-(--n-soft-press)":c?"cursor-pointer text-(--neba-muted-fg) hover:bg-(--n-soft) active:bg-(--n-soft-press)":"cursor-pointer text-(--neba-fg) hover:bg-(--n-soft) active:bg-(--n-soft-press)",h),onClick:()=>{d||f()},onPointerEnter:g,onKeyDown:b,children:[n,s?e("span",{"aria-hidden":"true",className:"absolute bottom-[0.18em] size-[0.22em] rounded-full bg-current"}):null]})}function Header({size:r,color:d,view:u,month:h,locale:f,labels:g,showPreviousButton:b,showNextButton:p,captionId:y,onStep:v,onViewChange:w}){const D=k(f,"long")[h.getMonth()],N=String(h.getFullYear()),S=x(f),M=B(h.getFullYear()),C=`${M}–${M+E-1}`,z="day"===u?[g.previousMonth,g.nextMonth]:"month"===u?[g.previousYear,g.nextYear]:[g.previousYears,g.nextYears],P=(t,n)=>n?e(o,{variant:"text",size:r,color:d,density:"compact","aria-label":z[-1===t?0:1],onClick:()=>v(t),startIcon:e("span",{className:i("flex items-center",-1===t?"rotate-90 rtl:-rotate-90":"-rotate-90 rtl:rotate-90"),children:e(l,{})})}):e("span",{"aria-hidden":"true",className:i(a[r],"w-(--n-cell)")}),A=t=>e("span",{className:i("flex items-center text-(--neba-muted-fg)","[transition:rotate_var(--neba-duration)_var(--neba-ease)]",t&&"rotate-180"),children:e(l,{})}),j=e(o,{variant:"text",size:r,color:d,density:"compact","aria-describedby":`${y}-month`,"aria-expanded":"month"===u,onClick:()=>w("month"===u?"day":"month"),endIcon:A("month"===u),children:D},"month"),Y=e(o,{variant:"text",size:r,color:d,density:"compact",className:"tabular-nums","aria-describedby":`${y}-year`,"aria-expanded":"year"===u,onClick:()=>w("year"===u?"day":"year"),endIcon:A("year"===u),children:N},"year");return t("div",{className:"flex items-center justify-between gap-1",children:[e("span",{id:y,className:m,"aria-live":"polite",children:"day"===u?F(f,{year:"numeric",month:"long"}).format(h):"month"===u?N:C}),e("span",{id:`${y}-month`,hidden:!0,children:g.chooseMonth}),e("span",{id:`${y}-year`,hidden:!0,children:g.chooseYear}),P(-1,b),e("div",{className:i("flex min-w-0 flex-1 items-center justify-center",c[r]),children:"year"===u?e("span",{className:i("flex items-center font-medium tabular-nums text-(--neba-fg)",a[r],s[r]),children:C}):"month"===u?Y:t(n,S?{children:[j,Y]}:{children:[Y,j]})}),P(1,p)]})}const q={day:0,month:1,year:2};export function Calendar({size:n,color:o,locale:l,weekStartsOn:a,month:s,onMonthChange:d,selected:u,rangeStart:m=null,rangeEnd:h=null,onSelect:f,granularity:p="day",renderDay:y,onPreviewChange:x,minDate:N,maxDate:C,shouldDisableDate:k,showOutsideDays:j=!0,autoFocus:Y=!1,multiselectable:B=!1,showPreviousButton:F=!0,showNextButton:T=!0,labels:H,className:K}){const G=r.useId(),[O,U]=r.useState(p),L=q[O]<q[p]?p:O,$=r.useMemo(()=>u.filter(S),[u]),_=R(),[V,J]=r.useState(()=>{const e=$.find(e=>D(e,s));return e?z(e):_&&D(A(),s)?A():P(s)}),Q=r.useRef(!_);r.useEffect(()=>{_&&Q.current&&(Q.current=!1,J(e=>w(e,P(s))&&D(A(),s)&&!$.some(e=>D(e,s))?A():e))},[_]);const W=r.useRef(Y),X=r.useRef(null);r.useEffect(()=>{J(e=>D(e,s)?e:P(s))},[s]),r.useLayoutEffect(()=>{W.current&&(W.current=!1,X.current?.querySelector('[data-focus-target="true"]')?.focus({preventScroll:!0}))});const Z=r.useCallback(e=>v(e,N,C)||(k?.(e)??!1),[N,C,k]),ee=e=>{W.current=!0,U(e)},te=e=>{W.current=!0,d(e)};return t("div",{ref:X,className:i("flex flex-col",c[n],K),style:{"--n-cell":I[n]},onPointerLeave:()=>x?.(null),children:[e(Header,{size:n,color:o,view:L,month:s,locale:l,labels:H,showPreviousButton:F,showNextButton:T,captionId:G,onStep:e=>{d("day"===L?g(s,e):b(s,"month"===L?e:e*E))},onViewChange:ee}),e("div",{className:"h-[calc(var(--n-cell)*7)] w-[calc(var(--n-cell)*7)]",children:"day"===L?e(DayGrid,{labelledBy:G,multiselectable:B&&"day"===p,size:n,locale:l,weekStartsOn:a,month:s,chosen:$,rangeStart:m,rangeEnd:h,focusedDate:V,renderDay:y,showOutsideDays:j,isDisabled:Z,onSelect:e=>{J(e),f(e)},onPreviewChange:x,onMoveFocus:e=>{W.current=!0,J(e),D(e,s)||d(P(e))}}):"month"===L?e(MonthGrid,{labelledBy:G,multiselectable:B&&"month"===p,size:n,locale:l,month:s,chosen:$,minDate:N,maxDate:C,shouldDisable:"month"===p?k:void 0,onMoveCursor:te,onPick:e=>{const t=M(s.getFullYear(),e,1);d(t),"month"===p?f(t):(J(e=>D(e,t)?e:t),ee("day"))}}):e(YearGrid,{labelledBy:G,multiselectable:B&&"year"===p,size:n,month:s,chosen:$,minDate:N,maxDate:C,shouldDisable:"year"===p?k:void 0,onMoveCursor:te,onPick:e=>{if("year"===p){const t=M(e,0,1);return d(t),void f(t)}d(M(e,s.getMonth(),1)),ee("month")}})})]})}function L(e){return"rtl"===getComputedStyle(e).direction}function DayGrid({labelledBy:n,multiselectable:r,size:o,locale:l,weekStartsOn:a,month:c,chosen:u,rangeStart:m,rangeEnd:h,focusedDate:b,renderDay:v,showOutsideDays:x,isDisabled:N,onSelect:M,onPreviewChange:C,onMoveFocus:k}){const z=p(c,a),P=j(l,a,"short"),Y=j(l,a,"long"),E=F(l,{dateStyle:"full"}),B=(H=h,S(T=m)&&S(H)?y(T,H)<=0?[T,H]:[H,T]:null);var T,H;const I=R()?A():null;return t("div",{role:"grid","aria-labelledby":n,"aria-multiselectable":r||void 0,className:"flex h-full flex-col",children:[e("div",{role:"row",className:"grid grid-cols-7",children:P.map((t,n)=>e("span",{role:"columnheader","aria-label":Y[n],className:i("flex h-(--n-cell) items-center justify-center font-medium text-(--neba-muted-fg) select-none",d[o]),children:t},n))}),z.map((n,r)=>e("div",{role:"row",className:"grid grid-cols-7",children:n.map(n=>{const r=!D(n,c);if(r&&!x)return e("span",{role:"gridcell","aria-hidden":"true",className:"size-(--n-cell)"},n.getTime());const l=u.some(e=>w(e,n)),d=null!==B&&y(n,B[0])>=0&&y(n,B[1])<=0,m=null!==B&&d&&w(n,B[0]),h=null!==B&&d&&w(n,B[1]);return t(Cell,{size:o,label:E.format(n),selected:l,inRange:d&&!l,rangeEdge:d?m&&h?"both":m?"start":h?"end":"middle":null,current:null!==I&&w(n,I),muted:r,disabled:N(n),focused:w(n,b),className:i("size-(--n-cell)",s[o]),onClick:()=>M(n),onPointerEnter:()=>C?.(n),onKeyDown:e=>((e,t)=>{const n=(t.getDay()-a+7)%7,r=L(e.currentTarget)?-1:1,o={ArrowLeft:()=>f(t,-r),ArrowRight:()=>f(t,r),ArrowUp:()=>f(t,-7),ArrowDown:()=>f(t,7),Home:()=>f(t,-n),End:()=>f(t,6-n),PageUp:()=>g(t,e.shiftKey?-12:-1),PageDown:()=>g(t,e.shiftKey?12:1)}[e.key];o&&(e.preventDefault(),k(o()))})(e,n),children:[n.getDate(),v?v(n):null]},n.getTime())})},r))]})}function MonthGrid({labelledBy:t,multiselectable:n,size:r,locale:o,month:l,chosen:a,minDate:c,maxDate:d,shouldDisable:u,onMoveCursor:m,onPick:h}){const f=k(o,"short"),b=F(o,{year:"numeric",month:"long"}),p=l.getFullYear(),y=R()?new Date:null,v=e=>{const t=L(e.currentTarget)?-1:1,n={ArrowLeft:-t,ArrowRight:t,ArrowUp:-3,ArrowDown:3,PageUp:-12,PageDown:12}[e.key];void 0!==n&&(e.preventDefault(),m(g(P(l),n)))};return e("div",{role:"grid","aria-labelledby":t,"aria-multiselectable":n||void 0,className:"flex h-full flex-col justify-evenly",children:[0,1,2,3].map(t=>e("div",{role:"row",className:"grid grid-cols-3 gap-1",children:[0,1,2].map(n=>{const o=3*t+n,m=M(p,o,1);return e(Cell,{size:r,label:b.format(m),selected:a.some(e=>e.getFullYear()===p&&e.getMonth()===o),current:null!==y&&y.getFullYear()===p&&y.getMonth()===o,disabled:N(m,"month",c,d)||(u?.(m)??!1),focused:o===l.getMonth(),className:i("h-(--n-cell) w-full",s[r]),onClick:()=>h(o),onKeyDown:v,children:f[o]},o)})},t))})}function YearGrid({labelledBy:t,multiselectable:n,size:r,month:o,chosen:l,minDate:a,maxDate:c,shouldDisable:d,onMoveCursor:u,onPick:m}){const h=B(o.getFullYear()),f=R()?(new Date).getFullYear():null,g=e=>{const t=L(e.currentTarget)?-1:1,n={ArrowLeft:-t,ArrowRight:t,ArrowUp:-4,ArrowDown:4,PageUp:-E,PageDown:E}[e.key];void 0!==n&&(e.preventDefault(),u(b(P(o),n)))};return e("div",{role:"grid","aria-labelledby":t,"aria-multiselectable":n||void 0,className:"flex h-full flex-col justify-evenly",children:[0,1,2].map(t=>e("div",{role:"row",className:"grid grid-cols-4 gap-1",children:[0,1,2,3].map(n=>{const u=h+4*t+n,b=M(u,0,1);return e(Cell,{size:r,label:String(u),selected:l.some(e=>e.getFullYear()===u),current:u===f,disabled:N(b,"year",a,c)||(d?.(b)??!1),focused:u===o.getFullYear(),className:i("h-(--n-cell) w-full",s[r]),onClick:()=>m(u),onKeyDown:g,children:u},u)})},t))})}function $(e){const t=e.parentElement;if(!t)return;const n=e.getBoundingClientRect(),r=t.getBoundingClientRect(),o=n.top-r.top-t.clientTop+t.scrollTop,l=o+n.height;o<t.scrollTop?t.scrollTop=o:l>t.scrollTop+t.clientHeight&&(t.scrollTop=l-t.clientHeight)}export function TimeGrid({size:n,density:o,locale:l,value:c,referenceDate:d,onChange:u,hour12:h,showSeconds:f,hourStep:g,minuteStep:b,secondStep:p,shouldDisableTime:y,autoFocus:v=!1,labels:x,className:w}){const D=c??d,N=r.useRef(null),[S,M]=r.useMemo(()=>C(l),[l]);r.useEffect(()=>{const e=N.current;if(e?.querySelectorAll('[data-chosen="true"]').forEach($),v){const t=e?.querySelector('[role="listbox"]');(t?.querySelector('[data-chosen="true"]')??t?.querySelector('[role="option"]'))?.focus({preventScroll:!0})}},[v]);const k=r.useMemo(()=>{const e=Math.ceil((h?12:24)/g),t=Array.from({length:e},(e,t)=>t*g);return h?t.map(e=>0===e?12:e):t},[h,g]),z=r.useMemo(()=>Array.from({length:Math.ceil(60/b)},(e,t)=>t*b),[b]),P=r.useMemo(()=>Array.from({length:Math.ceil(60/p)},(e,t)=>t*p),[p]),A=e=>String(e).padStart(2,"0"),j=h?D.getHours()%12||12:D.getHours(),E=e=>{const t=Array.from(e.currentTarget.querySelectorAll('[role="option"]')),n=t.indexOf(e.target);if(n<0)return;const r="ArrowDown"===e.key?n+1:"ArrowUp"===e.key?n-1:"Home"===e.key?0:"End"===e.key?t.length-1:null;if(null===r)return;e.preventDefault();const o=t[Math.min(t.length-1,Math.max(0,r))];o.focus({preventScroll:!0}),$(o)},B=(t,r,o,l,d)=>{const m=Math.max(0,null===c?0:o.findIndex(l));return e("div",{role:"listbox","aria-label":r,onKeyDown:E,className:i("flex flex-col gap-0.5 overflow-y-auto overscroll-contain","h-[calc(var(--n-cell)*7)] w-[calc(var(--n-cell)*2)]","scroll-py-0.5 [scrollbar-width:thin]"),children:o.map((r,o)=>{const f=((e,t)=>Y(D,"hour"===e?{hours:h?t%12+(D.getHours()>=12?12:0):t}:"minute"===e?{minutes:t}:"second"===e?{seconds:t}:{hours:D.getHours()%12+12*t}))(t,r),g=null!==c&&l(r),b=y?.(f,t)??!1;return e("button",{type:"button",role:"option","aria-selected":g,"aria-disabled":b||void 0,"data-chosen":g?"true":void 0,tabIndex:o===m?0:-1,className:i(U,K[n],a[n],s[n],"w-full shrink-0",b?"cursor-not-allowed text-(--neba-disabled-fg)":g?"cursor-pointer bg-(--n-fill) font-semibold text-(--n-on-solid) hover:bg-(--n-fill-hover) active:bg-(--n-fill-active)":"cursor-pointer text-(--neba-fg) hover:bg-(--n-soft) active:bg-(--n-soft-press)"),onClick:()=>{b||u(f)},children:d(r)},r)})},t)};return t("div",{ref:N,className:i("flex","compact"===o?"gap-0.5":"gap-1",w),style:{"--n-cell":I[n]},children:[B("hour",x.hour,k,e=>e===j,e=>h?String(e):A(e)),B("minute",x.minute,z,e=>e===D.getMinutes(),A),f?B("second",x.second,P,e=>e===D.getSeconds(),A):null,h?B("meridiem",x.meridiem,[0,1],e=>(D.getHours()>=12?1:0)===e,e=>0===e?S:M):null,e("span",{className:m,"aria-live":"polite",children:null===c?"":F(l,{hour:"numeric",minute:"2-digit",...f?{second:"2-digit"}:{}}).format(c)})]})}
|
|
1
|
+
"use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as r from"react";import{useLayoutEffectOnClient as o}from"./layout-effect.js";import{Button as l}from"../components/button/Button.js";import{ChevronIcon as a}from"./icons.js";import{controlHeightClasses as s,controlTextClasses as i,cx as c,gapClasses as d,metaTextClasses as u,pressTransitionClasses as m,srOnlyClasses as h,transitionClasses as f}from"./styles.js";import{addDays as g,addMonths as b,addYears as p,calendarWeeks as y,compareDay as v,isDayOutside as x,isMonthBeforeYear as w,isSameDay as D,isSameMonth as N,isUnitOutside as S,isValidDate as M,makeDate as C,meridiemLabels as k,monthLabels as z,startOfDay as P,startOfMonth as A,today as j,weekdayLabels as Y,withTime as B,YEAR_PAGE_SIZE as E,yearPageStart as F}from"./date.js";import{dateFormatter as T}from"./format.js";import{pickerMessages as H,useMessages as R}from"./i18n.js";import{useHydrated as I,useIntlLocale as K}from"./media.js";export function usePickerLabels(e,t){const n=R(H,t);return r.useMemo(()=>e?{...n,...e}:n,[n,e])}const G={xs:"1.375rem",sm:"1.625rem",md:"2rem",lg:"2.5rem",xl:"3rem"},O={xs:"rounded-(--neba-radius-xs)",sm:"rounded-(--neba-radius-xs)",md:"rounded-(--neba-radius-sm)",lg:"rounded-(--neba-radius-md)",xl:"rounded-(--neba-radius-lg)"},U={xs:"rounded-s-(--neba-radius-xs)",sm:"rounded-s-(--neba-radius-xs)",md:"rounded-s-(--neba-radius-sm)",lg:"rounded-s-(--neba-radius-md)",xl:"rounded-s-(--neba-radius-lg)"},q={xs:"rounded-e-(--neba-radius-xs)",sm:"rounded-e-(--neba-radius-xs)",md:"rounded-e-(--neba-radius-sm)",lg:"rounded-e-(--neba-radius-md)",xl:"rounded-e-(--neba-radius-lg)"},$=["neba-calendar-cell relative flex select-none items-center justify-center tabular-nums","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",f,m,"focus-visible:z-10 focus-visible:[outline:2px_solid_var(--n-ring)]","focus-visible:[outline-offset:-2px]"].join(" ");function Cell({children:n,label:r,selected:o,inRange:l=!1,rangeEdge:a=null,current:s=!1,muted:i=!1,disabled:d=!1,focused:u=!1,size:m,className:h,onClick:f,onPointerEnter:g,onKeyDown:b}){return t("button",{type:"button",role:"gridcell","aria-label":r,"aria-selected":o,"aria-current":s?"date":void 0,"aria-disabled":d||void 0,tabIndex:u?0:-1,"data-focus-target":u?"true":void 0,className:c($,"start"===a?U[m]:"end"===a?q[m]:"middle"===a?"rounded-none":O[m],d?"cursor-not-allowed text-(--neba-disabled-fg)":o?"cursor-pointer bg-(--n-fill) font-semibold text-(--n-on-solid) hover:bg-(--n-fill-hover) active:bg-(--n-fill-active)":l?"cursor-pointer bg-(--n-soft) text-(--neba-fg) hover:bg-(--n-soft-hover) active:bg-(--n-soft-press)":s?"cursor-pointer font-semibold text-(--n-on-tint) hover:bg-(--n-soft) active:bg-(--n-soft-press)":i?"cursor-pointer text-(--neba-muted-fg) hover:bg-(--n-soft) active:bg-(--n-soft-press)":"cursor-pointer text-(--neba-fg) hover:bg-(--n-soft) active:bg-(--n-soft-press)",h),onClick:()=>{d||f()},onPointerEnter:g,onKeyDown:b,children:[n,s?e("span",{"aria-hidden":"true",className:"absolute bottom-[0.18em] size-[0.22em] rounded-full bg-current"}):null]})}function Header({size:r,color:o,view:u,month:m,locale:f,labels:g,showPreviousButton:b,showNextButton:p,captionId:y,onStep:v,onViewChange:x}){const D=z(f,"long")[m.getMonth()],N=String(m.getFullYear()),S=w(f),M=F(m.getFullYear()),C=`${M}–${M+E-1}`,k="day"===u?[g.previousMonth,g.nextMonth]:"month"===u?[g.previousYear,g.nextYear]:[g.previousYears,g.nextYears],P=(t,n)=>n?e(l,{variant:"text",size:r,color:o,density:"compact","aria-label":k[-1===t?0:1],onClick:()=>v(t),startIcon:e("span",{className:c("flex items-center",-1===t?"rotate-90 rtl:-rotate-90":"-rotate-90 rtl:rotate-90"),children:e(a,{})})}):e("span",{"aria-hidden":"true",className:c(s[r],"w-(--n-cell)")}),A=t=>e("span",{className:c("flex items-center text-(--neba-muted-fg)","[transition:rotate_var(--neba-duration)_var(--neba-ease)]",t&&"rotate-180"),children:e(a,{})}),j=e(l,{variant:"text",size:r,color:o,density:"compact","aria-describedby":`${y}-month`,"aria-expanded":"month"===u,onClick:()=>x("month"===u?"day":"month"),endIcon:A("month"===u),children:D},"month"),Y=e(l,{variant:"text",size:r,color:o,density:"compact",className:"tabular-nums","aria-describedby":`${y}-year`,"aria-expanded":"year"===u,onClick:()=>x("year"===u?"day":"year"),endIcon:A("year"===u),children:N},"year");return t("div",{className:"flex items-center justify-between gap-1",children:[e("span",{id:y,className:h,"aria-live":"polite",children:"day"===u?T(f,{year:"numeric",month:"long"}).format(m):"month"===u?N:C}),e("span",{id:`${y}-month`,hidden:!0,children:g.chooseMonth}),e("span",{id:`${y}-year`,hidden:!0,children:g.chooseYear}),P(-1,b),e("div",{className:c("flex min-w-0 flex-1 items-center justify-center",d[r]),children:"year"===u?e("span",{className:c("flex items-center font-medium tabular-nums text-(--neba-fg)",s[r],i[r]),children:C}):"month"===u?Y:t(n,S?{children:[j,Y]}:{children:[Y,j]})}),P(1,p)]})}const L={day:0,month:1,year:2};export function Calendar({size:n,color:l,locale:a,weekStartsOn:s,month:i,onMonthChange:u,selected:m,rangeStart:h=null,rangeEnd:f=null,onSelect:g,granularity:y="day",renderDay:v,onPreviewChange:w,minDate:S,maxDate:k,shouldDisableDate:z,showOutsideDays:Y=!0,autoFocus:B=!1,multiselectable:F=!1,showPreviousButton:T=!0,showNextButton:H=!0,labels:R,className:O}){const U=K(a),q=r.useId(),[$,_]=r.useState(y),V=L[$]<L[y]?y:$,J=r.useMemo(()=>m.filter(M),[m]),Q=I(),[W,X]=r.useState(()=>{const e=J.find(e=>N(e,i));return e?P(e):Q&&N(j(),i)?j():A(i)}),Z=r.useRef(!Q);r.useEffect(()=>{Q&&Z.current&&(Z.current=!1,X(e=>D(e,A(i))&&N(j(),i)&&!J.some(e=>N(e,i))?j():e))},[Q]);const ee=r.useRef(B),te=r.useRef(null);r.useEffect(()=>{X(e=>N(e,i)?e:A(i))},[i]),o(()=>{ee.current&&(ee.current=!1,te.current?.querySelector('[data-focus-target="true"]')?.focus({preventScroll:!0}))});const ne=r.useCallback(e=>x(e,S,k)||(z?.(e)??!1),[S,k,z]),re=e=>{ee.current=!0,_(e)},oe=e=>{ee.current=!0,u(e)};return t("div",{ref:te,className:c("flex flex-col",d[n],O),style:{"--n-cell":G[n]},onPointerLeave:()=>w?.(null),children:[e(Header,{size:n,color:l,view:V,month:i,locale:U,labels:R,showPreviousButton:T,showNextButton:H,captionId:q,onStep:e=>{u("day"===V?b(i,e):p(i,"month"===V?e:e*E))},onViewChange:re}),e("div",{className:"h-[calc(var(--n-cell)*7)] w-[calc(var(--n-cell)*7)]",children:"day"===V?e(DayGrid,{labelledBy:q,multiselectable:F&&"day"===y,size:n,locale:U,weekStartsOn:s,month:i,chosen:J,rangeStart:h,rangeEnd:f,focusedDate:W,renderDay:v,showOutsideDays:Y,isDisabled:ne,onSelect:e=>{X(e),g(e)},onPreviewChange:w,onMoveFocus:e=>{ee.current=!0,X(e),N(e,i)||u(A(e))}}):"month"===V?e(MonthGrid,{labelledBy:q,multiselectable:F&&"month"===y,size:n,locale:U,month:i,chosen:J,minDate:S,maxDate:k,shouldDisable:"month"===y?z:void 0,onMoveCursor:oe,onPick:e=>{const t=C(i.getFullYear(),e,1);u(t),"month"===y?g(t):(X(e=>N(e,t)?e:t),re("day"))}}):e(YearGrid,{labelledBy:q,multiselectable:F&&"year"===y,size:n,month:i,chosen:J,minDate:S,maxDate:k,shouldDisable:"year"===y?z:void 0,onMoveCursor:oe,onPick:e=>{if("year"===y){const t=C(e,0,1);return u(t),void g(t)}u(C(e,i.getMonth(),1)),re("month")}})})]})}function _(e){return"rtl"===getComputedStyle(e).direction}function DayGrid({labelledBy:n,multiselectable:r,size:o,locale:l,weekStartsOn:a,month:s,chosen:d,rangeStart:m,rangeEnd:h,focusedDate:f,renderDay:p,showOutsideDays:x,isDisabled:w,onSelect:S,onPreviewChange:C,onMoveFocus:k}){const z=y(s,a),P=Y(l,a,"short"),A=Y(l,a,"long"),B=T(l,{dateStyle:"full"}),E=(H=h,M(F=m)&&M(H)?v(F,H)<=0?[F,H]:[H,F]:null);var F,H;const R=I()?j():null;return t("div",{role:"grid","aria-labelledby":n,"aria-multiselectable":r||void 0,className:"flex h-full flex-col",children:[e("div",{role:"row",className:"grid grid-cols-7",children:P.map((t,n)=>e("span",{role:"columnheader","aria-label":A[n],className:c("flex h-(--n-cell) items-center justify-center font-medium text-(--neba-muted-fg) select-none",u[o]),children:t},n))}),z.map((n,r)=>e("div",{role:"row",className:"grid grid-cols-7",children:n.map(n=>{const r=!N(n,s);if(r&&!x)return e("span",{role:"gridcell","aria-hidden":"true",className:"size-(--n-cell)"},n.getTime());const l=d.some(e=>D(e,n)),u=null!==E&&v(n,E[0])>=0&&v(n,E[1])<=0,m=null!==E&&u&&D(n,E[0]),h=null!==E&&u&&D(n,E[1]);return t(Cell,{size:o,label:B.format(n),selected:l,inRange:u&&!l,rangeEdge:u?m&&h?"both":m?"start":h?"end":"middle":null,current:null!==R&&D(n,R),muted:r,disabled:w(n),focused:D(n,f),className:c("size-(--n-cell)",i[o]),onClick:()=>S(n),onPointerEnter:()=>C?.(n),onKeyDown:e=>((e,t)=>{const n=(t.getDay()-a+7)%7,r=_(e.currentTarget)?-1:1,o={ArrowLeft:()=>g(t,-r),ArrowRight:()=>g(t,r),ArrowUp:()=>g(t,-7),ArrowDown:()=>g(t,7),Home:()=>g(t,-n),End:()=>g(t,6-n),PageUp:()=>b(t,e.shiftKey?-12:-1),PageDown:()=>b(t,e.shiftKey?12:1)}[e.key];o&&(e.preventDefault(),k(o()))})(e,n),children:[n.getDate(),p?p(n):null]},n.getTime())})},r))]})}function MonthGrid({labelledBy:t,multiselectable:n,size:r,locale:o,month:l,chosen:a,minDate:s,maxDate:d,shouldDisable:u,onMoveCursor:m,onPick:h}){const f=z(o,"short"),g=T(o,{year:"numeric",month:"long"}),p=l.getFullYear(),y=I()?new Date:null,v=e=>{const t=_(e.currentTarget)?-1:1,n={ArrowLeft:-t,ArrowRight:t,ArrowUp:-3,ArrowDown:3,PageUp:-12,PageDown:12}[e.key];void 0!==n&&(e.preventDefault(),m(b(A(l),n)))};return e("div",{role:"grid","aria-labelledby":t,"aria-multiselectable":n||void 0,className:"flex h-full flex-col justify-evenly",children:[0,1,2,3].map(t=>e("div",{role:"row",className:"grid grid-cols-3 gap-1",children:[0,1,2].map(n=>{const o=3*t+n,m=C(p,o,1);return e(Cell,{size:r,label:g.format(m),selected:a.some(e=>e.getFullYear()===p&&e.getMonth()===o),current:null!==y&&y.getFullYear()===p&&y.getMonth()===o,disabled:S(m,"month",s,d)||(u?.(m)??!1),focused:o===l.getMonth(),className:c("h-(--n-cell) w-full",i[r]),onClick:()=>h(o),onKeyDown:v,children:f[o]},o)})},t))})}function YearGrid({labelledBy:t,multiselectable:n,size:r,month:o,chosen:l,minDate:a,maxDate:s,shouldDisable:d,onMoveCursor:u,onPick:m}){const h=F(o.getFullYear()),f=I()?(new Date).getFullYear():null,g=e=>{const t=_(e.currentTarget)?-1:1,n={ArrowLeft:-t,ArrowRight:t,ArrowUp:-4,ArrowDown:4,PageUp:-E,PageDown:E}[e.key];void 0!==n&&(e.preventDefault(),u(p(A(o),n)))};return e("div",{role:"grid","aria-labelledby":t,"aria-multiselectable":n||void 0,className:"flex h-full flex-col justify-evenly",children:[0,1,2].map(t=>e("div",{role:"row",className:"grid grid-cols-4 gap-1",children:[0,1,2,3].map(n=>{const u=h+4*t+n,b=C(u,0,1);return e(Cell,{size:r,label:String(u),selected:l.some(e=>e.getFullYear()===u),current:u===f,disabled:S(b,"year",a,s)||(d?.(b)??!1),focused:u===o.getFullYear(),className:c("h-(--n-cell) w-full",i[r]),onClick:()=>m(u),onKeyDown:g,children:u},u)})},t))})}function V(e){const t=e.parentElement;if(!t)return;const n=e.getBoundingClientRect(),r=t.getBoundingClientRect(),o=n.top-r.top-t.clientTop+t.scrollTop,l=o+n.height;o<t.scrollTop?t.scrollTop=o:l>t.scrollTop+t.clientHeight&&(t.scrollTop=l-t.clientHeight)}export function TimeGrid({size:n,density:o,locale:l,value:a,referenceDate:d,onChange:u,hour12:m,showSeconds:f,hourStep:g,minuteStep:b,secondStep:p,shouldDisableTime:y,autoFocus:v=!1,labels:x,className:w}){const D=K(l),N=a??d,S=r.useRef(null),[M,C]=r.useMemo(()=>k(D),[D]);r.useEffect(()=>{const e=S.current;if(e?.querySelectorAll('[data-chosen="true"]').forEach(V),v){const t=e?.querySelector('[role="listbox"]');(t?.querySelector('[data-chosen="true"]')??t?.querySelector('[role="option"]'))?.focus({preventScroll:!0})}},[v]);const z=r.useMemo(()=>{const e=Math.ceil((m?12:24)/g),t=Array.from({length:e},(e,t)=>t*g);return m?t.map(e=>0===e?12:e):t},[m,g]),P=r.useMemo(()=>Array.from({length:Math.ceil(60/b)},(e,t)=>t*b),[b]),A=r.useMemo(()=>Array.from({length:Math.ceil(60/p)},(e,t)=>t*p),[p]),j=e=>String(e).padStart(2,"0"),Y=m?N.getHours()%12||12:N.getHours(),E=e=>{const t=Array.from(e.currentTarget.querySelectorAll('[role="option"]')),n=t.indexOf(e.target);if(n<0)return;const r="ArrowDown"===e.key?n+1:"ArrowUp"===e.key?n-1:"Home"===e.key?0:"End"===e.key?t.length-1:null;if(null===r)return;e.preventDefault();const o=t[Math.min(t.length-1,Math.max(0,r))];o.focus({preventScroll:!0}),V(o)},F=(t,r,o,l,d)=>{const h=Math.max(0,null===a?0:o.findIndex(l));return e("div",{role:"listbox","aria-label":r,onKeyDown:E,className:c("flex flex-col gap-0.5 overflow-y-auto overscroll-contain","h-[calc(var(--n-cell)*7)] w-[calc(var(--n-cell)*2)]","scroll-py-0.5 [scrollbar-width:thin]"),children:o.map((r,o)=>{const f=((e,t)=>B(N,"hour"===e?{hours:m?t%12+(N.getHours()>=12?12:0):t}:"minute"===e?{minutes:t}:"second"===e?{seconds:t}:{hours:N.getHours()%12+12*t}))(t,r),g=null!==a&&l(r),b=y?.(f,t)??!1;return e("button",{type:"button",role:"option","aria-selected":g,"aria-disabled":b||void 0,"data-chosen":g?"true":void 0,tabIndex:o===h?0:-1,className:c($,O[n],s[n],i[n],"w-full shrink-0",b?"cursor-not-allowed text-(--neba-disabled-fg)":g?"cursor-pointer bg-(--n-fill) font-semibold text-(--n-on-solid) hover:bg-(--n-fill-hover) active:bg-(--n-fill-active)":"cursor-pointer text-(--neba-fg) hover:bg-(--n-soft) active:bg-(--n-soft-press)"),onClick:()=>{b||u(f)},children:d(r)},r)})},t)};return t("div",{ref:S,className:c("flex","compact"===o?"gap-0.5":"gap-1",w),style:{"--n-cell":G[n]},children:[F("hour",x.hour,z,e=>e===Y,e=>m?String(e):j(e)),F("minute",x.minute,P,e=>e===N.getMinutes(),j),f?F("second",x.second,A,e=>e===N.getSeconds(),j):null,m?F("meridiem",x.meridiem,[0,1],e=>(N.getHours()>=12?1:0)===e,e=>0===e?M:C):null,e("span",{className:h,"aria-live":"polite",children:null===a?"":T(D,{hour:"numeric",minute:"2-digit",...f?{second:"2-digit"}:{}}).format(a)})]})}
|