neba 1.9.0 → 1.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (204) hide show
  1. package/README.md +35 -5
  2. package/dist/components/accordion/Accordion.js +1 -1
  3. package/dist/components/alert/Alert.js +1 -1
  4. package/dist/components/anchor/Anchor.js +1 -1
  5. package/dist/components/animate-lighting/AnimateLighting.js +1 -1
  6. package/dist/components/app-logo/AppLogo.js +1 -1
  7. package/dist/components/aspect-ratio/AspectRatio.js +1 -1
  8. package/dist/components/avatar/Avatar.js +1 -1
  9. package/dist/components/avatar-group/AvatarGroup.js +1 -1
  10. package/dist/components/badge/Badge.js +1 -1
  11. package/dist/components/bar-chart/BarChart.d.ts +1 -1
  12. package/dist/components/bar-chart/BarChart.js +1 -1
  13. package/dist/components/blockquote/Blockquote.js +1 -1
  14. package/dist/components/bottom-navigation/BottomNavigation.js +1 -1
  15. package/dist/components/box/Box.js +1 -1
  16. package/dist/components/breadcrumb/Breadcrumb.js +1 -1
  17. package/dist/components/button/Button.js +1 -1
  18. package/dist/components/button-group/ButtonGroup.js +1 -1
  19. package/dist/components/calendar/Calendar.d.ts +72 -0
  20. package/dist/components/calendar/Calendar.js +1 -0
  21. package/dist/components/calendar/index.d.ts +2 -0
  22. package/dist/components/calendar/index.js +1 -0
  23. package/dist/components/card/Card.js +1 -1
  24. package/dist/components/carousel/Carousel.js +1 -1
  25. package/dist/components/chat-bubble/ChatBubble.js +1 -1
  26. package/dist/components/checkbox/Checkbox.d.ts +13 -1
  27. package/dist/components/checkbox/Checkbox.js +1 -1
  28. package/dist/components/chip/Chip.js +1 -1
  29. package/dist/components/code-block/CodeBlock.js +1 -1
  30. package/dist/components/collapsible/Collapsible.js +1 -1
  31. package/dist/components/color-picker/ColorPicker.js +1 -1
  32. package/dist/components/combobox/Combobox.d.ts +29 -2
  33. package/dist/components/combobox/Combobox.js +1 -1
  34. package/dist/components/command-palette/CommandPalette.d.ts +19 -2
  35. package/dist/components/command-palette/CommandPalette.js +1 -1
  36. package/dist/components/confirm/Confirm.d.ts +83 -0
  37. package/dist/components/confirm/Confirm.js +1 -0
  38. package/dist/components/confirm/index.d.ts +2 -0
  39. package/dist/components/confirm/index.js +1 -0
  40. package/dist/components/container/Container.js +1 -1
  41. package/dist/components/data-list/DataList.js +1 -1
  42. package/dist/components/data-table/DataTable.d.ts +104 -1
  43. package/dist/components/data-table/DataTable.js +1 -1
  44. package/dist/components/date-picker/DatePicker.d.ts +40 -8
  45. package/dist/components/date-picker/DatePicker.js +1 -1
  46. package/dist/components/date-range-picker/DateRangePicker.js +1 -1
  47. package/dist/components/date-time-picker/DateTimePicker.js +1 -1
  48. package/dist/components/dialog/Dialog.d.ts +19 -2
  49. package/dist/components/dialog/Dialog.js +1 -1
  50. package/dist/components/divider/Divider.js +1 -1
  51. package/dist/components/drawer/Drawer.d.ts +1 -1
  52. package/dist/components/drawer/Drawer.js +1 -1
  53. package/dist/components/empty/Empty.js +1 -1
  54. package/dist/components/file-picker/FilePicker.js +1 -1
  55. package/dist/components/floating-action-button/FloatingActionButton.js +1 -1
  56. package/dist/components/floating-bottom-navigation/FloatingBottomNavigation.js +1 -1
  57. package/dist/components/footer/Footer.js +1 -1
  58. package/dist/components/gauge-chart/GaugeChart.d.ts +1 -1
  59. package/dist/components/gauge-chart/GaugeChart.js +1 -1
  60. package/dist/components/grid-container/GridContainer.js +1 -1
  61. package/dist/components/header/Header.js +1 -1
  62. package/dist/components/heatmap-chart/HeatmapChart.d.ts +1 -1
  63. package/dist/components/heatmap-chart/HeatmapChart.js +1 -1
  64. package/dist/components/highlight/Highlight.js +1 -1
  65. package/dist/components/hover-card/HoverCard.d.ts +1 -1
  66. package/dist/components/hover-card/HoverCard.js +1 -1
  67. package/dist/components/how-to-steps/HowToSteps.js +1 -1
  68. package/dist/components/image/Image.d.ts +70 -0
  69. package/dist/components/image/Image.js +1 -0
  70. package/dist/components/image/index.d.ts +2 -0
  71. package/dist/components/image/index.js +1 -0
  72. package/dist/components/list/List.js +1 -1
  73. package/dist/components/menubar/Menubar.js +1 -1
  74. package/dist/components/meter/Meter.js +1 -1
  75. package/dist/components/mockup/Mockup.js +1 -1
  76. package/dist/components/number-field/NumberField.d.ts +27 -2
  77. package/dist/components/number-field/NumberField.js +1 -1
  78. package/dist/components/otp-field/OtpField.js +1 -1
  79. package/dist/components/overlay/Overlay.d.ts +1 -1
  80. package/dist/components/overlay/Overlay.js +1 -1
  81. package/dist/components/page-layout/PageLayout.js +1 -1
  82. package/dist/components/pagination/Pagination.js +1 -1
  83. package/dist/components/panes/Panes.js +1 -1
  84. package/dist/components/pie-chart/PieChart.d.ts +1 -1
  85. package/dist/components/pie-chart/PieChart.js +1 -1
  86. package/dist/components/pill/Pill.js +1 -1
  87. package/dist/components/popconfirm/Popconfirm.d.ts +71 -0
  88. package/dist/components/popconfirm/Popconfirm.js +1 -0
  89. package/dist/components/popconfirm/index.d.ts +2 -0
  90. package/dist/components/popconfirm/index.js +1 -0
  91. package/dist/components/popover/Popover.d.ts +1 -1
  92. package/dist/components/popover/Popover.js +1 -1
  93. package/dist/components/portal/Portal.d.ts +48 -0
  94. package/dist/components/portal/Portal.js +1 -0
  95. package/dist/components/portal/index.d.ts +2 -0
  96. package/dist/components/portal/index.js +1 -0
  97. package/dist/components/progress-box/ProgressBox.js +1 -1
  98. package/dist/components/progress-circular/ProgressCircular.js +1 -1
  99. package/dist/components/progress-linear/ProgressLinear.js +1 -1
  100. package/dist/components/provider/NebaProvider.d.ts +99 -0
  101. package/dist/components/provider/NebaProvider.js +1 -0
  102. package/dist/components/provider/index.d.ts +3 -0
  103. package/dist/components/provider/index.js +1 -0
  104. package/dist/components/radio-group/RadioGroup.d.ts +22 -1
  105. package/dist/components/radio-group/RadioGroup.js +1 -1
  106. package/dist/components/rating/Rating.js +1 -1
  107. package/dist/components/scatter-chart/ScatterChart.d.ts +1 -1
  108. package/dist/components/scatter-chart/ScatterChart.js +1 -1
  109. package/dist/components/scroll-area/ScrollArea.js +1 -1
  110. package/dist/components/scroll-zone/ScrollZone.js +1 -1
  111. package/dist/components/select/Select.d.ts +16 -1
  112. package/dist/components/select/Select.js +1 -1
  113. package/dist/components/shortcut/Shortcut.d.ts +2 -1
  114. package/dist/components/shortcut/Shortcut.js +1 -1
  115. package/dist/components/sidebar/Sidebar.js +1 -1
  116. package/dist/components/sidebar/SidebarTrigger.js +1 -1
  117. package/dist/components/skeleton/Skeleton.js +1 -1
  118. package/dist/components/slider/Slider.js +1 -1
  119. package/dist/components/sparkline/Sparkline.js +1 -1
  120. package/dist/components/spoiler/Spoiler.js +1 -1
  121. package/dist/components/statistic/Statistic.js +1 -1
  122. package/dist/components/switch/Switch.d.ts +13 -1
  123. package/dist/components/switch/Switch.js +1 -1
  124. package/dist/components/table/Table.d.ts +21 -2
  125. package/dist/components/table/Table.js +1 -1
  126. package/dist/components/text-field/TextField.d.ts +27 -1
  127. package/dist/components/text-field/TextField.js +1 -1
  128. package/dist/components/text-link/TextLink.js +1 -1
  129. package/dist/components/time-picker/TimePicker.js +1 -1
  130. package/dist/components/timeline-chart/TimelineChart.d.ts +1 -1
  131. package/dist/components/timeline-chart/TimelineChart.js +1 -1
  132. package/dist/components/toast/Toast.d.ts +17 -2
  133. package/dist/components/toast/Toast.js +1 -1
  134. package/dist/components/toggle/Toggle.js +1 -1
  135. package/dist/components/toggle-group/ToggleGroup.js +1 -1
  136. package/dist/components/toolbar/Toolbar.js +1 -1
  137. package/dist/components/tooltip/Tooltip.d.ts +1 -1
  138. package/dist/components/tooltip/Tooltip.js +1 -1
  139. package/dist/components/tour/Tour.d.ts +17 -2
  140. package/dist/components/tour/Tour.js +1 -1
  141. package/dist/components/transfer/Transfer.js +1 -1
  142. package/dist/components/tree-select/TreeSelect.d.ts +88 -0
  143. package/dist/components/tree-select/TreeSelect.js +1 -0
  144. package/dist/components/tree-select/index.d.ts +2 -0
  145. package/dist/components/tree-select/index.js +1 -0
  146. package/dist/components/tree-view/TreeView.js +1 -1
  147. package/dist/components/visually-hidden/VisuallyHidden.d.ts +37 -0
  148. package/dist/components/visually-hidden/VisuallyHidden.js +1 -0
  149. package/dist/components/visually-hidden/index.d.ts +2 -0
  150. package/dist/components/visually-hidden/index.js +1 -0
  151. package/dist/components/window-pane/WindowPane.js +1 -1
  152. package/dist/hooks/index.d.ts +10 -0
  153. package/dist/hooks/index.js +1 -0
  154. package/dist/hooks/useDisclosure.d.ts +21 -0
  155. package/dist/hooks/useDisclosure.js +1 -0
  156. package/dist/hooks/useElementSize.d.ts +23 -0
  157. package/dist/hooks/useElementSize.js +1 -0
  158. package/dist/hooks/useMediaQuery.d.ts +27 -0
  159. package/dist/hooks/useMediaQuery.js +1 -0
  160. package/dist/hooks/useOnScreen.d.ts +24 -0
  161. package/dist/hooks/useOnScreen.js +1 -0
  162. package/dist/hooks/useShortcut.d.ts +34 -0
  163. package/dist/hooks/useShortcut.js +1 -0
  164. package/dist/index.d.ts +9 -0
  165. package/dist/index.js +1 -1
  166. package/dist/internal/calendar.d.ts +31 -5
  167. package/dist/internal/calendar.js +1 -1
  168. package/dist/internal/csv.d.ts +40 -0
  169. package/dist/internal/csv.js +1 -0
  170. package/dist/internal/date.d.ts +39 -1
  171. package/dist/internal/date.js +1 -1
  172. package/dist/internal/defaults.d.ts +46 -0
  173. package/dist/internal/defaults.js +1 -0
  174. package/dist/internal/i18n.d.ts +23 -0
  175. package/dist/internal/i18n.js +1 -1
  176. package/dist/internal/keys.d.ts +92 -0
  177. package/dist/internal/keys.js +1 -0
  178. package/dist/internal/media.d.ts +27 -0
  179. package/dist/internal/media.js +1 -1
  180. package/dist/internal/page-layout.d.ts +7 -0
  181. package/dist/internal/page-layout.js +1 -1
  182. package/dist/internal/picker.d.ts +7 -1
  183. package/dist/internal/picker.js +1 -1
  184. package/dist/locales/ar.js +1 -1
  185. package/dist/locales/de.js +1 -1
  186. package/dist/locales/es.js +1 -1
  187. package/dist/locales/fr.js +1 -1
  188. package/dist/locales/hi.js +1 -1
  189. package/dist/locales/id.js +1 -1
  190. package/dist/locales/it.js +1 -1
  191. package/dist/locales/ja.js +1 -1
  192. package/dist/locales/ko.js +1 -1
  193. package/dist/locales/nl.js +1 -1
  194. package/dist/locales/pl.js +1 -1
  195. package/dist/locales/pt.js +1 -1
  196. package/dist/locales/ru.js +1 -1
  197. package/dist/locales/th.js +1 -1
  198. package/dist/locales/tr.js +1 -1
  199. package/dist/locales/vi.js +1 -1
  200. package/dist/locales/zh-hans.js +1 -1
  201. package/dist/locales/zh-hant.js +1 -1
  202. package/dist/styles.css +1 -1
  203. package/dist/types.d.ts +73 -0
  204. package/package.json +6 -1
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as t from"react";import{CloseIcon as r}from"../../internal/icons.js";import{controlTextLeadingClasses as a,cx as l,disabledClasses as o,gapClasses as s,hasContent as i,iconClasses as c,metaTextClasses as d,radiusClasses as u,readOnlyFilterClasses as f,sheetTitleClasses as p,stackGapClasses as m,surfaceClasses as h,surfaceSlots as v,transitionClasses as b}from"../../internal/styles.js";const x={default:{xs:"p-4",sm:"p-5",md:"p-6",lg:"p-8",xl:"p-10"},compact:{xs:"p-2",sm:"p-3",md:"p-4",lg:"p-5",xl:"p-6"}},g={solid:[h,"border-2 border-dashed text-(--neba-fg) bg-(--n-panel-hover)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),outline:[h,"border-2 border-dashed text-(--neba-fg) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"border-2 border-dashed text-(--neba-fg) bg-transparent [border-color:var(--n-line)]"},y={solid:"hover:bg-(--n-panel-press) hover:[border-color:var(--n-line-hover)]",outline:"hover:bg-(--n-panel-hover) hover:[border-color:var(--n-line-hover)]",text:"hover:bg-(--n-soft) hover:[border-color:var(--n-line-hover)]"};function k(){return n("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[e("path",{d:"M8 10.5V2.75m0 0L5.25 5.5M8 2.75 10.75 5.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),e("path",{d:"M2.75 9.75v1.75a1.75 1.75 0 0 0 1.75 1.75h7a1.75 1.75 0 0 0 1.75-1.75V9.75",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function formatFileSize(e){if(e<1e3)return`${e} B`;const n=["kB","MB","GB","TB"];let t=e/1e3,r=0;for(;t>=1e3&&r<n.length-1;)t/=1e3,r+=1;return`${t<10?t.toFixed(1):Math.round(t)} ${n[r]}`}function N(e,n){const t=e.name.toLowerCase(),r=e.type.toLowerCase();return n.split(",").map(e=>e.trim().toLowerCase()).filter(Boolean).some(e=>e.startsWith(".")?t.endsWith(e):e.endsWith("/*")?r.startsWith(`${e.slice(0,-1)}`):r===e)}export const FilePicker=/*@__PURE__*/t.forwardRef(function({variant:h="outline",size:$="md",color:w="primary",density:j="default",elevation:L=0,accept:z,multiple:C=!1,maxSize:_,maxFiles:E,value:D,defaultValue:F,onFilesChange:I,onReject:M,label:B,description:W,error:S,invalid:R,title:T,hint:V,icon:O,showList:q=!0,removeLabel:A=e=>`Remove ${e}`,fullWidth:G=!0,disabled:P=!1,readOnly:H=!1,required:Y=!1,name:J,id:K,className:Q,style:U,...X},Z){const ee=t.useRef(null);t.useImperativeHandle(Z,()=>ee.current);const[ne,te]=t.useState(()=>[...F??[]]),re=t.useMemo(()=>D?[...D]:ne,[D,ne]),ae=t.useRef(0),[le,oe]=t.useState(!1);t.useEffect(()=>{const e=()=>{ae.current=0,oe(!1)};return document.addEventListener("dragend",e,!0),document.addEventListener("drop",e,!0),()=>{document.removeEventListener("dragend",e,!0),document.removeEventListener("drop",e,!0)}},[]);const se=i(S),ie=R??se,ce=ie?"danger":w,de=P||H,ue=t.useId(),fe=t.useCallback(e=>{D||te(e),I?.(e)},[I,D]),pe=t.useCallback(e=>{const n=[],t=[],r=C?E??Number.POSITIVE_INFINITY:1,a=C?re.length:0;for(const l of e)z&&!N(l,z)?t.push({file:l,reason:"type"}):void 0!==_&&l.size>_?t.push({file:l,reason:"size"}):a+n.length>=r?t.push({file:l,reason:"count"}):n.push(l);return{kept:n,rejections:t}},[z,re.length,E,_,C]),me=t.useCallback(e=>{const{kept:n,rejections:t}=pe(e);t.length>0&&M?.(t),n.length>0&&fe(C?[...re,...n]:n)},[pe,fe,re,C,M]),he=l("flex w-full flex-col items-center justify-center text-center","cursor-pointer select-none",x[j][$],u[$],s[$],b,c,"focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2",P?`${o[h]} border-2 border-dashed`:H?`${g[h]} ${f} cursor-default`:g[h],de?"":y[h],le&&!de?"bg-(--n-soft-press) [border-color:var(--n-ring)]":"");return n("div",{className:l("flex-col align-top",m[$],G?"flex w-full":"inline-flex",Q??""),style:{...v(ce,L),...U},...X,children:[i(B)?e("span",{className:[d[$],"font-medium",P?"text-(--neba-disabled-fg)":"text-(--neba-fg)"].join(" "),children:B}):null,n("div",{className:"flex w-full flex-col",onDragEnter:e=>{de||(e.preventDefault(),ae.current+=1,oe(!0))},onDragOver:e=>{de||(e.preventDefault(),e.dataTransfer.dropEffect="copy")},onDragLeave:()=>{de||(ae.current=Math.max(0,ae.current-1),0===ae.current&&oe(!1))},onDrop:e=>{de||(e.preventDefault(),ae.current=0,oe(!1),me(function(e){const n=[...e.items],t=[...e.files];return n.length!==t.length?t:t.filter((e,t)=>{const r=n[t]?.webkitGetAsEntry?.();return!r||r.isFile})}(e.dataTransfer)))},children:[n("button",{type:"button",id:K,disabled:P,"aria-describedby":i(W)||se?ue:void 0,"aria-invalid":ie||void 0,className:he,onClick:()=>{de||ee.current&&(ee.current.value="",ee.current.click())},children:[void 0===O?e("span",{className:"flex items-center text-(--n-accent) [&_svg]:size-[1.8em]",children:e(k,{})}):i(O)?e("span",{className:"flex items-center text-(--n-accent) [&_svg]:size-[1.8em]",children:O}):null,e("span",{className:`font-medium ${p[$]}`,children:T??"Drop files here, or click to browse"}),i(V)?e("span",{className:`text-(--neba-muted-fg) ${d[$]}`,children:V}):null]}),e("input",{ref:ee,type:"file",name:J,accept:z,multiple:C,required:Y&&0===re.length,disabled:de,tabIndex:-1,"aria-hidden":"true",className:"absolute size-px overflow-hidden opacity-0 [clip-path:inset(50%)]",onChange:e=>me(Array.from(e.target.files??[]))})]}),q&&re.length>0?e("ul",{role:"list",className:`flex w-full flex-col ${m[$]} m-0 list-none p-0`,children:re.map((t,l)=>n("li",{className:["flex w-full items-center gap-2 px-2 py-1.5",u.xs,a[$],"bg-(--n-soft) text-(--neba-fg)"].join(" "),children:[e("span",{className:"min-w-0 flex-1 truncate",children:t.name}),e("span",{className:`shrink-0 text-(--neba-muted-fg) tabular-nums ${d[$]}`,children:formatFileSize(t.size)}),de?null:e("button",{type:"button","aria-label":A(t.name),className:["inline-flex shrink-0 cursor-pointer items-center justify-center rounded-full","size-[1.3em] text-(--neba-muted-fg) opacity-70","[transition:opacity_var(--neba-duration)_var(--neba-ease),color_var(--neba-duration)_var(--neba-ease)]","[&_svg]:size-[0.9em]","hover:text-(--neba-fg) hover:opacity-100 focus-visible:opacity-100","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1"].join(" "),onClick:()=>fe(re.filter((e,n)=>n!==l)),children:e(r,{})})]},`${t.name}-${t.size}-${t.lastModified}-${l}`))}):null,i(W)&&!se?e("span",{id:ue,className:`${d[$]} text-(--neba-muted-fg)`,children:W}):null,se?e("span",{id:ue,className:`${d[$]} text-(--n-accent)`,children:S}):null]})});
1
+ "use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as t from"react";import{CloseIcon as r}from"../../internal/icons.js";import{controlTextLeadingClasses as a,cx as l,disabledClasses as o,gapClasses as s,hasContent as i,iconClasses as c,metaTextClasses as d,radiusClasses as u,readOnlyFilterClasses as f,sheetTitleClasses as p,stackGapClasses as m,surfaceClasses as h,surfaceSlots as v,transitionClasses as b}from"../../internal/styles.js";import{useStyleDefaults as x}from"../../internal/defaults.js";const g={default:{xs:"p-4",sm:"p-5",md:"p-6",lg:"p-8",xl:"p-10"},compact:{xs:"p-2",sm:"p-3",md:"p-4",lg:"p-5",xl:"p-6"}},y={solid:[h,"border-2 border-dashed text-(--neba-fg) bg-(--n-panel-hover)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),outline:[h,"border-2 border-dashed text-(--neba-fg) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"border-2 border-dashed text-(--neba-fg) bg-transparent [border-color:var(--n-line)]"},k={solid:"hover:bg-(--n-panel-press) hover:[border-color:var(--n-line-hover)]",outline:"hover:bg-(--n-panel-hover) hover:[border-color:var(--n-line-hover)]",text:"hover:bg-(--n-soft) hover:[border-color:var(--n-line-hover)]"};function N(){return n("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[e("path",{d:"M8 10.5V2.75m0 0L5.25 5.5M8 2.75 10.75 5.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),e("path",{d:"M2.75 9.75v1.75a1.75 1.75 0 0 0 1.75 1.75h7a1.75 1.75 0 0 0 1.75-1.75V9.75",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function formatFileSize(e){if(e<1e3)return`${e} B`;const n=["kB","MB","GB","TB"];let t=e/1e3,r=0;for(;t>=1e3&&r<n.length-1;)t/=1e3,r+=1;return`${t<10?t.toFixed(1):Math.round(t)} ${n[r]}`}function $(e,n){const t=e.name.toLowerCase(),r=e.type.toLowerCase();return n.split(",").map(e=>e.trim().toLowerCase()).filter(Boolean).some(e=>e.startsWith(".")?t.endsWith(e):e.endsWith("/*")?r.startsWith(`${e.slice(0,-1)}`):r===e)}export const FilePicker=/*@__PURE__*/t.forwardRef(function(h,j){const{variant:w="outline",size:z="md",color:L="primary",density:C="default",elevation:_=0,accept:E,multiple:D=!1,maxSize:F,maxFiles:I,value:M,defaultValue:B,onFilesChange:W,onReject:S,label:R,description:T,error:V,invalid:O,title:q,hint:A,icon:G,showList:P=!0,removeLabel:H=e=>`Remove ${e}`,fullWidth:Y=!0,disabled:J=!1,readOnly:K=!1,required:Q=!1,name:U,id:X,className:Z,style:ee,...ne}=x(h,["size","density","variant"]),te=t.useRef(null);t.useImperativeHandle(j,()=>te.current);const[re,ae]=t.useState(()=>[...B??[]]),le=t.useMemo(()=>M?[...M]:re,[M,re]),oe=t.useRef(0),[se,ie]=t.useState(!1);t.useEffect(()=>{const e=()=>{oe.current=0,ie(!1)};return document.addEventListener("dragend",e,!0),document.addEventListener("drop",e,!0),()=>{document.removeEventListener("dragend",e,!0),document.removeEventListener("drop",e,!0)}},[]);const ce=i(V),de=O??ce,ue=de?"danger":L,fe=J||K,pe=t.useId(),me=t.useCallback(e=>{M||ae(e),W?.(e)},[W,M]),he=t.useCallback(e=>{const n=[],t=[],r=D?I??Number.POSITIVE_INFINITY:1,a=D?le.length:0;for(const l of e)E&&!$(l,E)?t.push({file:l,reason:"type"}):void 0!==F&&l.size>F?t.push({file:l,reason:"size"}):a+n.length>=r?t.push({file:l,reason:"count"}):n.push(l);return{kept:n,rejections:t}},[E,le.length,I,F,D]),ve=t.useCallback(e=>{const{kept:n,rejections:t}=he(e);t.length>0&&S?.(t),n.length>0&&me(D?[...le,...n]:n)},[he,me,le,D,S]),be=l("flex w-full flex-col items-center justify-center text-center","cursor-pointer select-none",g[C][z],u[z],s[z],b,c,"focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2",J?`${o[w]} border-2 border-dashed`:K?`${y[w]} ${f} cursor-default`:y[w],fe?"":k[w],se&&!fe?"bg-(--n-soft-press) [border-color:var(--n-ring)]":"");return n("div",{className:l("flex-col align-top",m[z],Y?"flex w-full":"inline-flex",Z??""),style:{...v(ue,_),...ee},...ne,children:[i(R)?e("span",{className:[d[z],"font-medium",J?"text-(--neba-disabled-fg)":"text-(--neba-fg)"].join(" "),children:R}):null,n("div",{className:"flex w-full flex-col",onDragEnter:e=>{fe||(e.preventDefault(),oe.current+=1,ie(!0))},onDragOver:e=>{fe||(e.preventDefault(),e.dataTransfer.dropEffect="copy")},onDragLeave:()=>{fe||(oe.current=Math.max(0,oe.current-1),0===oe.current&&ie(!1))},onDrop:e=>{fe||(e.preventDefault(),oe.current=0,ie(!1),ve(function(e){const n=[...e.items],t=[...e.files];return n.length!==t.length?t:t.filter((e,t)=>{const r=n[t]?.webkitGetAsEntry?.();return!r||r.isFile})}(e.dataTransfer)))},children:[n("button",{type:"button",id:X,disabled:J,"aria-describedby":i(T)||ce?pe:void 0,"aria-invalid":de||void 0,className:be,onClick:()=>{fe||te.current&&(te.current.value="",te.current.click())},children:[void 0===G?e("span",{className:"flex items-center text-(--n-accent) [&_svg]:size-[1.8em]",children:e(N,{})}):i(G)?e("span",{className:"flex items-center text-(--n-accent) [&_svg]:size-[1.8em]",children:G}):null,e("span",{className:`font-medium ${p[z]}`,children:q??"Drop files here, or click to browse"}),i(A)?e("span",{className:`text-(--neba-muted-fg) ${d[z]}`,children:A}):null]}),e("input",{ref:te,type:"file",name:U,accept:E,multiple:D,required:Q&&0===le.length,disabled:fe,tabIndex:-1,"aria-hidden":"true",className:"absolute size-px overflow-hidden opacity-0 [clip-path:inset(50%)]",onChange:e=>ve(Array.from(e.target.files??[]))})]}),P&&le.length>0?e("ul",{role:"list",className:`flex w-full flex-col ${m[z]} m-0 list-none p-0`,children:le.map((t,l)=>n("li",{className:["flex w-full items-center gap-2 px-2 py-1.5",u.xs,a[z],"bg-(--n-soft) text-(--neba-fg)"].join(" "),children:[e("span",{className:"min-w-0 flex-1 truncate",children:t.name}),e("span",{className:`shrink-0 text-(--neba-muted-fg) tabular-nums ${d[z]}`,children:formatFileSize(t.size)}),fe?null:e("button",{type:"button","aria-label":H(t.name),className:["inline-flex shrink-0 cursor-pointer items-center justify-center rounded-full","size-[1.3em] text-(--neba-muted-fg) opacity-70","[transition:opacity_var(--neba-duration)_var(--neba-ease),color_var(--neba-duration)_var(--neba-ease)]","[&_svg]:size-[0.9em]","hover:text-(--neba-fg) hover:opacity-100 focus-visible:opacity-100","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1"].join(" "),onClick:()=>me(le.filter((e,n)=>n!==l)),children:e(r,{})})]},`${t.name}-${t.size}-${t.lastModified}-${l}`))}):null,i(T)&&!ce?e("span",{id:pe,className:`${d[z]} text-(--neba-muted-fg)`,children:T}):null,ce?e("span",{id:pe,className:`${d[z]} text-(--n-accent)`,children:V}):null]})});
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as o from"react";import{Button as n}from"../button/Button.js";import{CloseIcon as s,PlusIcon as a}from"../../internal/icons.js";import{cx as r,hasContent as i,metaTextClasses as l,radiusClasses as c,surfaceClasses as d}from"../../internal/styles.js";const f=/*@__PURE__*/o.createContext({variant:"solid",size:"md",color:"primary",density:"default",elevation:1,showLabels:!0,reversed:!0,close:()=>{}}),p={xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"lg"},m={static:"",absolute:"absolute z-30",sticky:"sticky z-30",fixed:"fixed z-40"},u={"top-start":"top-(--n-fab-offset) start-(--n-fab-offset)","top-end":"top-(--n-fab-offset) end-(--n-fab-offset)","bottom-start":"bottom-(--n-fab-offset) start-(--n-fab-offset)","bottom-end":"bottom-(--n-fab-offset) end-(--n-fab-offset)"},b=r("pointer-events-none max-w-40 truncate select-none","px-2 py-0.5 text-(--neba-fg) bg-(--n-panel)",d,c.xs,"[box-shadow:var(--neba-shadow-1),var(--neba-plate-glass)]");export const FloatingActionButton=/*@__PURE__*/o.forwardRef(function({variant:i="solid",size:l="lg",color:c="primary",density:d="default",elevation:b=2,icon:v,label:x,extended:y=!1,openIcon:h,position:g="fixed",corner:w="bottom-end",offset:z=16,direction:C,open:k,defaultOpen:L=!1,onOpenChange:N,openOnHover:j=!0,closeOnAction:E=!0,showLabels:P=!0,disabled:R=!1,className:A,style:I,children:O,onClick:B,onKeyDown:D,onPointerEnter:F,onPointerLeave:K,...T},W){const H=o.useId(),M=o.useRef(null),S=o.useRef(null),[$,q]=o.useState(L),G=void 0!==k,J=o.Children.toArray(O).length>0,Q=(G?k:$)&&J&&!R,U=o.useCallback(e=>{G||q(e),N?.(e)},[G,N]),V=o.useCallback(()=>U(!1),[U]);o.useEffect(()=>{if(!Q)return;const e=e=>{const t=S.current;t&&e.target instanceof Node&&!t.contains(e.target)&&V()};return document.addEventListener("pointerdown",e),()=>document.removeEventListener("pointerdown",e)},[Q,V]);const X=C??(w.startsWith("bottom")?"top":"bottom"),Y=w.endsWith("end"),Z=o.useMemo(()=>({variant:i,size:p[l],color:c,density:d,elevation:b,showLabels:P,reversed:Y,close:E?V:()=>{}}),[i,l,c,d,b,P,Y,E,V]),_=Q&&!1!==h?h??e(s,{}):v??e(a,{});return t("div",{ref:e=>{S.current=e,"function"==typeof W?W(e):W&&(W.current=e)},className:r("flex w-fit","top"===X?"flex-col-reverse":"flex-col",Y?"items-end":"items-start","xs"===l||"sm"===l?"gap-1.5":"gap-2",m[g],"static"===g?"":u[w],A),style:{"--n-fab-offset":"number"==typeof z?`${z}px`:z,...I},onKeyDown:e=>{"Escape"===e.key&&Q&&(e.stopPropagation(),V(),M.current?.focus()),D?.(e)},onPointerEnter:e=>{j&&J&&!R&&"mouse"===e.pointerType&&U(!0),F?.(e)},onPointerLeave:e=>{j&&"mouse"===e.pointerType&&V(),K?.(e)},...T,children:[e(n,{ref:M,variant:i,size:l,color:c,density:d,elevation:b,disabled:R,"aria-label":x,"aria-expanded":J?Q:void 0,"aria-controls":J&&Q?H:void 0,startIcon:_,style:{borderRadius:"9999px"},onClick:e=>{J&&U(!Q),B?.(e)},children:y?x:void 0}),Q?e("div",{id:H,className:r("flex","top"===X?"flex-col-reverse":"flex-col",Y?"items-end":"items-start","xs"===l||"sm"===l?"gap-1.5":"gap-2"),children:e(f.Provider,{value:Z,children:O})}):null]})});export const FloatingAction=/*@__PURE__*/o.forwardRef(function({icon:s,label:a,disabled:c=!1,className:d,onClick:p,...m},u){const v=o.useContext(f);return t("div",{className:r("flex items-center gap-2",v.reversed?"flex-row-reverse":"flex-row",d),children:[e(n,{ref:u,variant:v.variant,size:v.size,color:v.color,density:v.density,elevation:v.elevation,disabled:c,"aria-label":a,startIcon:s,style:{borderRadius:"9999px"},onClick:e=>{p?.(e),v.close()},...m}),v.showLabels&&i(a)?e("span",{"aria-hidden":"true",className:r(b,l[v.size]),children:a}):null]})});
1
+ "use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as o from"react";import{Button as n}from"../button/Button.js";import{CloseIcon as s,PlusIcon as a}from"../../internal/icons.js";import{cx as r,hasContent as i,metaTextClasses as l,radiusClasses as d,surfaceClasses as c}from"../../internal/styles.js";import{useStyleDefaults as f}from"../../internal/defaults.js";const p=/*@__PURE__*/o.createContext({variant:"solid",size:"md",color:"primary",density:"default",elevation:1,showLabels:!0,reversed:!0,close:()=>{}}),m={xs:"xs",sm:"xs",md:"sm",lg:"md",xl:"lg"},u="lg",b={static:"",absolute:"absolute z-30",sticky:"sticky z-30",fixed:"fixed z-40"},v={"top-start":"top-(--n-fab-offset) start-(--n-fab-offset)","top-end":"top-(--n-fab-offset) end-(--n-fab-offset)","bottom-start":"bottom-(--n-fab-offset) start-(--n-fab-offset)","bottom-end":"bottom-(--n-fab-offset) end-(--n-fab-offset)"},x=r("pointer-events-none max-w-40 truncate select-none","px-2 py-0.5 text-(--neba-fg) bg-(--n-panel)",c,d.xs,"[box-shadow:var(--neba-shadow-1),var(--neba-plate-glass)]");export const FloatingActionButton=/*@__PURE__*/o.forwardRef(function(i,l){const{variant:d="solid",size:c=u,color:x="primary",density:y="default",elevation:h=2,icon:g,label:w,extended:z=!1,openIcon:C,position:k="fixed",corner:L="bottom-end",offset:j=16,direction:N,open:E,defaultOpen:P=!1,onOpenChange:R,openOnHover:A=!0,closeOnAction:I=!0,showLabels:O=!0,disabled:B=!1,className:D,style:F,children:K,onClick:T,onKeyDown:W,onPointerEnter:H,onPointerLeave:M,...S}=f(i,["size","density","variant"]),$=o.useId(),q=o.useRef(null),G=o.useRef(null),[J,Q]=o.useState(P),U=void 0!==E,V=o.Children.toArray(K).length>0,X=(U?E:J)&&V&&!B,Y=o.useCallback(e=>{U||Q(e),R?.(e)},[U,R]),Z=o.useCallback(()=>Y(!1),[Y]);o.useEffect(()=>{if(!X)return;const e=e=>{const t=G.current;t&&e.target instanceof Node&&!t.contains(e.target)&&Z()};return document.addEventListener("pointerdown",e),()=>document.removeEventListener("pointerdown",e)},[X,Z]);const _=N??(L.startsWith("bottom")?"top":"bottom"),ee=L.endsWith("end"),te=o.useMemo(()=>({variant:d,size:m[c],color:x,density:y,elevation:h,showLabels:O,reversed:ee,close:I?Z:()=>{}}),[d,c,x,y,h,O,ee,I,Z]),oe=X&&!1!==C?C??e(s,{}):g??e(a,{});return t("div",{ref:e=>{G.current=e,"function"==typeof l?l(e):l&&(l.current=e)},className:r("flex w-fit","top"===_?"flex-col-reverse":"flex-col",ee?"items-end":"items-start","xs"===c||"sm"===c?"gap-1.5":"gap-2",b[k],"static"===k?"":v[L],D),style:{"--n-fab-offset":"number"==typeof j?`${j}px`:j,...F},onKeyDown:e=>{"Escape"===e.key&&X&&(e.stopPropagation(),Z(),q.current?.focus()),W?.(e)},onPointerEnter:e=>{A&&V&&!B&&"mouse"===e.pointerType&&Y(!0),H?.(e)},onPointerLeave:e=>{A&&"mouse"===e.pointerType&&Z(),M?.(e)},...S,children:[e(n,{ref:q,variant:d,size:c,color:x,density:y,elevation:h,disabled:B,"aria-label":w,"aria-expanded":V?X:void 0,"aria-controls":V&&X?$:void 0,startIcon:oe,style:{borderRadius:"9999px"},onClick:e=>{V&&Y(!X),T?.(e)},children:z?w:void 0}),X?e("div",{id:$,className:r("flex","top"===_?"flex-col-reverse":"flex-col",ee?"items-end":"items-start","xs"===c||"sm"===c?"gap-1.5":"gap-2"),children:e(p.Provider,{value:te,children:K})}):null]})});export const FloatingAction=/*@__PURE__*/o.forwardRef(function({icon:s,label:a,disabled:d=!1,className:c,onClick:f,...m},u){const b=o.useContext(p);return t("div",{className:r("flex items-center gap-2",b.reversed?"flex-row-reverse":"flex-row",c),children:[e(n,{ref:u,variant:b.variant,size:b.size,color:b.color,density:b.density,elevation:b.elevation,disabled:d,"aria-label":a,startIcon:s,style:{borderRadius:"9999px"},onClick:e=>{f?.(e),b.close()},...m}),b.showLabels&&i(a)?e("span",{"aria-hidden":"true",className:r(x,l[b.size]),children:a}):null]})});
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{useRender as n}from"@base-ui/react/use-render";import{barMinHeightClasses as o,BottomNavigationContext as r}from"../../internal/bottom-navigation.js";import{observeResize as s}from"../../internal/observe.js";import{cx as l,surfaceClasses as i,surfaceSlots as f,transitionClasses as u}from"../../internal/styles.js";const d={solid:[i,"text-(--neba-fg) bg-(--n-panel-press)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[i,"border text-(--neba-fg) bg-(--n-panel-hover)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-transparent"},p={static:"relative mx-auto w-fit",absolute:"absolute inset-x-0 bottom-(--n-nav-offset) z-30 mx-auto w-fit",sticky:"sticky bottom-(--n-nav-offset) z-30 mx-auto w-fit",fixed:"fixed inset-x-0 bottom-(--n-nav-offset) z-40 mx-auto w-fit"},b={default:{xs:"p-1",sm:"p-1",md:"p-1.5",lg:"p-1.5",xl:"p-2"},compact:{xs:"p-0.5",sm:"p-0.5",md:"p-1",lg:"p-1",xl:"p-1"}},c={solid:`${i} bg-(--n-panel-hover) [box-shadow:var(--neba-shadow-1),var(--neba-plate-glass)]`,outline:`${i} bg-(--n-soft-hover) [box-shadow:var(--neba-shadow-1),var(--neba-plate-glass)]`,text:"bg-(--n-soft-hover)"},m={xs:"gap-0.5",sm:"gap-0.5",md:"gap-1",lg:"gap-1",xl:"gap-1.5"};export const FloatingBottomNavigation=/*@__PURE__*/a.forwardRef(function({variant:i="outline",size:v="md",color:x="primary",density:g="default",elevation:y=2,value:h,defaultValue:w=null,onValueChange:j,position:$="fixed",offset:k=16,labels:z="selected",safeArea:P=!0,disabled:A=!1,label:C,render:N,className:R,style:E,children:L,...S},V){const[W,q]=a.useState(w),B=void 0!==h,F=B?h:W,H=a.useCallback(e=>{B||q(e),j?.(e)},[B,j]),M=a.useMemo(()=>({value:F??null,change:H,size:v,density:g,labels:z,disabled:A,floating:!0}),[F,H,v,g,z,A]),T=a.useRef(null),D=a.useRef(null),G=a.useCallback(e=>{T.current=e,"function"==typeof V?V(e):V&&(V.current=e)},[V]),I=a.useCallback(e=>{const t=T.current,a=D.current;if(!t||!a)return;const n=t.querySelector("[data-nav-item][aria-current]");if(!n)return;const o=!e||!a.hasAttribute("data-ready");o&&a.removeAttribute("data-ready"),a.style.setProperty("--n-nav-x",`${n.offsetLeft}px`),a.style.setProperty("--n-nav-y",`${n.offsetTop}px`),a.style.setProperty("--n-nav-w",`${n.offsetWidth}px`),a.style.setProperty("--n-nav-h",`${n.offsetHeight}px`),o&&a.offsetWidth,a.setAttribute("data-ready","")},[]);a.useLayoutEffect(()=>{I(!0)},[I,F,i,v,g,z,L]),a.useEffect(()=>{const e=T.current;if(e)return s(e,()=>I(!1))},[I]);const J="number"==typeof k?`${k}px`:k,K=l("flex max-w-full min-w-0 items-center rounded-full",o[v],b[g][v],m[v],d[i],p[$],u,R);return n({render:N??e("nav",{}),ref:G,props:{"aria-label":C,className:K,style:{...f(x,y),"--n-nav-offset":P?`calc(${J} + env(safe-area-inset-bottom))`:J,...E},children:t(r.Provider,{value:M,children:[null!=F?e("span",{ref:D,"aria-hidden":"true",className:l("pointer-events-none absolute rounded-full","top-(--n-nav-y) left-(--n-nav-x) h-(--n-nav-h) w-(--n-nav-w)",c[i],"[transition-property:left,top,width,height]","[transition-timing-function:var(--neba-ease)]","[transition-duration:0ms] data-[ready]:[transition-duration:var(--neba-duration)]","motion-reduce:[transition-duration:0ms]")}):null,L]}),...S}})});
1
+ "use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{useRender as n}from"@base-ui/react/use-render";import{barMinHeightClasses as r,BottomNavigationContext as o}from"../../internal/bottom-navigation.js";import{observeResize as s}from"../../internal/observe.js";import{cx as i,surfaceClasses as l,surfaceSlots as f,transitionClasses as u}from"../../internal/styles.js";import{useStyleDefaults as d}from"../../internal/defaults.js";const p={solid:[l,"text-(--neba-fg) bg-(--n-panel-press)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[l,"border text-(--neba-fg) bg-(--n-panel-hover)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-transparent"},m={static:"relative mx-auto w-fit",absolute:"absolute inset-x-0 bottom-(--n-nav-offset) z-30 mx-auto w-fit",sticky:"sticky bottom-(--n-nav-offset) z-30 mx-auto w-fit",fixed:"fixed inset-x-0 bottom-(--n-nav-offset) z-40 mx-auto w-fit"},b={default:{xs:"p-1",sm:"p-1",md:"p-1.5",lg:"p-1.5",xl:"p-2"},compact:{xs:"p-0.5",sm:"p-0.5",md:"p-1",lg:"p-1",xl:"p-1"}},c={solid:`${l} bg-(--n-panel-hover) [box-shadow:var(--neba-shadow-1),var(--neba-plate-glass)]`,outline:`${l} bg-(--n-soft-hover) [box-shadow:var(--neba-shadow-1),var(--neba-plate-glass)]`,text:"bg-(--n-soft-hover)"},v={xs:"gap-0.5",sm:"gap-0.5",md:"gap-1",lg:"gap-1",xl:"gap-1.5"};export const FloatingBottomNavigation=/*@__PURE__*/a.forwardRef(function(l,x){const{variant:g="outline",size:y="md",color:h="primary",density:w="default",elevation:j=2,value:$,defaultValue:z=null,onValueChange:k,position:P="fixed",offset:A=16,labels:C="selected",safeArea:N=!0,disabled:R=!1,label:E,render:L,className:S,style:V,children:W,...q}=d(l,["size","density","variant"]),[B,F]=a.useState(z),H=void 0!==$,M=H?$:B,T=a.useCallback(e=>{H||F(e),k?.(e)},[H,k]),D=a.useMemo(()=>({value:M??null,change:T,size:y,density:w,labels:C,disabled:R,floating:!0}),[M,T,y,w,C,R]),G=a.useRef(null),I=a.useRef(null),J=a.useCallback(e=>{G.current=e,"function"==typeof x?x(e):x&&(x.current=e)},[x]),K=a.useCallback(e=>{const t=G.current,a=I.current;if(!t||!a)return;const n=t.querySelector("[data-nav-item][aria-current]");if(!n)return;const r=!e||!a.hasAttribute("data-ready");r&&a.removeAttribute("data-ready"),a.style.setProperty("--n-nav-x",`${n.offsetLeft}px`),a.style.setProperty("--n-nav-y",`${n.offsetTop}px`),a.style.setProperty("--n-nav-w",`${n.offsetWidth}px`),a.style.setProperty("--n-nav-h",`${n.offsetHeight}px`),r&&a.offsetWidth,a.setAttribute("data-ready","")},[]);a.useLayoutEffect(()=>{K(!0)},[K,M,g,y,w,C,W]),a.useEffect(()=>{const e=G.current;if(e)return s(e,()=>K(!1))},[K]);const O="number"==typeof A?`${A}px`:A,Q=i("flex max-w-full min-w-0 items-center rounded-full",r[y],b[w][y],v[y],p[g],m[P],u,S);return n({render:L??e("nav",{}),ref:J,props:{"aria-label":E,className:Q,style:{...f(h,j),"--n-nav-offset":N?`calc(${O} + env(safe-area-inset-bottom))`:O,...V},children:t(o.Provider,{value:D,children:[null!=M?e("span",{ref:I,"aria-hidden":"true",className:i("pointer-events-none absolute rounded-full","top-(--n-nav-y) left-(--n-nav-x) h-(--n-nav-h) w-(--n-nav-w)",c[g],"[transition-property:left,top,width,height]","[transition-timing-function:var(--neba-ease)]","[transition-duration:0ms] data-[ready]:[transition-duration:var(--neba-duration)]","motion-reduce:[transition-duration:0ms]")}):null,W]}),...q}})});
@@ -1 +1 @@
1
- "use client";import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{useRender as t}from"@base-ui/react/use-render";import{boxPaddingXClasses as a,boxPaddingYClasses as o}from"../box/Box.js";import{PageLayoutContext as n}from"../../internal/page-layout.js";import{cx as s,surfaceClasses as i,surfaceSlots as l,transitionClasses as m}from"../../internal/styles.js";const d={solid:[i,"text-(--neba-fg) bg-(--n-panel-press)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[i,"text-(--neba-fg) bg-(--n-panel)","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-transparent"},x={static:"",sticky:"sticky bottom-0 z-30",fixed:"fixed inset-x-0 bottom-0 z-40"},c={xs:"max-w-[30rem]",sm:"max-w-[40rem]",md:"max-w-[48rem]",lg:"max-w-[64rem]",xl:"max-w-[80rem]"};export const Footer=/*@__PURE__*/r.forwardRef(function({position:i="static",variant:f="outline",size:p="md",color:b="primary",density:u="default",elevation:v=0,divider:w=!0,maxWidth:g="none",padded:y=!0,label:j,render:h,className:k,style:z,children:N,...C},B){const F=r.useContext(n),{register:R}=F,W=r.useCallback(e=>{R("footer",e),"function"==typeof B?B(e):B&&(B.current=e)},[R,B]),q=s("w-full min-w-0",d[f],w?"border-t [border-color:var(--n-line)]":"",x[i],m,k);return t({render:h??e("footer",{}),ref:W,props:{"aria-label":j,className:q,style:{...l(b,v),...z},children:e("div",{className:s("w-full",y?s(a[u][p],o[u][p]):"","none"===g?"":s(c[g],"mx-auto")),children:N}),...C}})});
1
+ "use client";import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{useRender as r}from"@base-ui/react/use-render";import{boxPaddingXClasses as a,boxPaddingYClasses as o}from"../box/Box.js";import{PageLayoutContext as n}from"../../internal/page-layout.js";import{cx as s,surfaceClasses as i,surfaceSlots as l,transitionClasses as m}from"../../internal/styles.js";import{useStyleDefaults as d}from"../../internal/defaults.js";const f={solid:[i,"text-(--neba-fg) bg-(--n-panel-press)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[i,"text-(--neba-fg) bg-(--n-panel)","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-transparent"},x={static:"",sticky:"sticky bottom-0 z-30",fixed:"fixed inset-x-0 bottom-0 z-40"},c={xs:"max-w-[30rem]",sm:"max-w-[40rem]",md:"max-w-[48rem]",lg:"max-w-[64rem]",xl:"max-w-[80rem]"};export const Footer=/*@__PURE__*/t.forwardRef(function(i,p){const{position:b="static",variant:u="outline",size:v="md",color:w="primary",density:g="default",elevation:y=0,divider:j=!0,maxWidth:h="none",padded:z=!0,label:k,render:N,className:C,style:B,children:F,...R}=d(i,["size","density","variant"]),W=t.useContext(n),{register:q}=W,A=t.useCallback(e=>{q("footer",e),"function"==typeof p?p(e):p&&(p.current=e)},[q,p]),D=s("w-full min-w-0",f[u],j?"border-t [border-color:var(--n-line)]":"",x[b],m,C);return r({render:N??e("footer",{}),ref:A,props:{"aria-label":k,className:D,style:{...l(w,y),...B},children:e("div",{className:s("w-full",z?s(a[g][v],o[g][v]):"","none"===h?"":s(c[h],"mx-auto")),children:F}),...R}})});
@@ -59,4 +59,4 @@ export interface GaugeChartProps extends Omit<ChartBaseProps, 'legend' | 'toolti
59
59
  * the unfilled part of the arc is not a second category — it is the rest of the
60
60
  * dial.
61
61
  */
62
- export declare function GaugeChart({ value, min, max, sweep, thickness, thresholds, ticks, showRange, center, caption, height, format, locale, label, empty, size, variant, color, padded, className, ...box }: GaugeChartProps): React.JSX.Element;
62
+ export declare function GaugeChart(rawProps: GaugeChartProps): React.JSX.Element;
@@ -1 +1 @@
1
- "use client";import{jsx as t,jsxs as e,Fragment as a}from"react/jsx-runtime";import*as n from"react";import{ChartSurface as l,useMeasuredWidth as r}from"../../internal/chart-frame.js";import{arcPath as i,chartFontSizes as s,compactNumber as o,plotHeights as m}from"../../internal/chart.js";import{numberFormatter as h}from"../../internal/format.js";import{emptyMessages as c,useMessages as d}from"../../internal/i18n.js";import{cx as u,metaTextClasses as f}from"../../internal/styles.js";function x(t,e,a,n){const l=(n-90)*Math.PI/180;return[t+a*Math.cos(l),e+a*Math.sin(l)]}export function GaugeChart({value:p,min:b=0,max:v=100,sweep:g=180,thickness:M=.22,thresholds:y,ticks:N=!1,showRange:j=!0,center:k,caption:$,height:w,format:z,locale:I,label:P,empty:S,size:A="md",variant:C="text",color:R="primary",padded:B=!1,className:F,...G}){const L=n.useRef(null),W=r(L),Y=d(c,I),q=n.useCallback(t=>z?h(I,z).format(t):o(t,I),[z,I]),D=Math.max(1,Math.min(360,g)),E=D/2,H=-E,J=E,K=v-b,O=null===p||Number.isNaN(p)||0===K?null:Math.min(1,Math.max(0,(p-b)/K)),Q=null===p?R:function(t,e,a){if(!a||0===a.length)return e;let n=e;for(const e of a)t>=e.from&&(n=e.color);return n}(p,R,y),T="number"==typeof w?w:m[A],U=s[A],V=D>=360?1:Math.max(0,-Math.cos(E*Math.PI/180)),X=D>=180?1:Math.sin(E*Math.PI/180),Z=U*(j?1.6:.6),_=Math.max(0,Math.min((W-2*Z)/(2*X),(T-Z*(V>0?2:1))/(1+V))),tt=_*(1-Math.min(.9,Math.max(.05,M))),et=W/2,at=Z+_,nt=_<=0||0===K,lt=null===O?H:H+D*O,rt=at-_+_*(1+V)/2,it=!1===N?0:Math.max(2,Math.floor(N));return t(l,{...G,variant:C,color:R,size:A,padded:B,legendSide:"bottom",className:F,legend:null,table:null,children:t("div",{ref:L,className:"relative w-full",style:{height:T},role:void 0===P?void 0:"img","aria-label":void 0===P?void 0:null===p?P:`${P}: ${q(p)} / ${q(v)}`,children:nt?t("div",{className:u("flex h-full items-center justify-center text-(--neba-muted-fg)",f[A]),children:S??Y.title}):W>0?e(a,{children:[e("svg",{width:W,height:T,viewBox:`0 0 ${W} ${T}`,"aria-hidden":"true",className:"block",children:[t("path",{d:i(et,at,_,tt,H,J),fill:`var(--neba-${R}-soft)`}),null!==O&&O>0?t("path",{d:i(et,at,_,tt,H,lt),fill:`var(--neba-${Q}-fill)`,style:{transition:"fill var(--neba-duration) var(--neba-ease)"}}):null,it>0?Array.from({length:it},(e,a)=>{const n=H+D*a/(it-1),[l,r]=x(et,at,_+.25*U,n),[i,s]=x(et,at,_+.6*U,n);return t("line",{x1:l,y1:r,x2:i,y2:s,stroke:"var(--neba-chart-grid)",strokeWidth:1,strokeLinecap:"round"},a)}):null,j?[[b,H,"start"],[v,J,"end"]].map(([e,a,n])=>{const[l,r]=x(et,at,(_+tt)/2,a);return t("text",{x:l+(D>=300?0:"start"===n?.6*-U:.6*U),y:r+U*(D>=300?1.4:.35),textAnchor:D>=300?"middle":"start"===n?"end":"start",fontSize:U,fill:"var(--neba-muted-fg)",children:q(e)},n)}):null]}),e("div",{className:"pointer-events-none absolute inset-x-0 flex flex-col items-center gap-0.5",style:{top:rt,transform:"translateY(-50%)"},children:[t("span",{className:"font-semibold tabular-nums text-(--neba-fg)",style:{fontSize:2*U},children:k??(null===p?"—":q(p))}),$?t("span",{className:u("text-(--neba-muted-fg)",f[A]),children:$}):null]})]}):null})})}
1
+ "use client";import{jsx as t,jsxs as e,Fragment as a}from"react/jsx-runtime";import*as n from"react";import{ChartSurface as l,useMeasuredWidth as r}from"../../internal/chart-frame.js";import{arcPath as i,chartFontSizes as s,compactNumber as o,plotHeights as m}from"../../internal/chart.js";import{numberFormatter as c}from"../../internal/format.js";import{emptyMessages as h,useMessages as d}from"../../internal/i18n.js";import{cx as f,metaTextClasses as u}from"../../internal/styles.js";import{useStyleDefaults as p}from"../../internal/defaults.js";function x(t,e,a,n){const l=(n-90)*Math.PI/180;return[t+a*Math.cos(l),e+a*Math.sin(l)]}export function GaugeChart(v){const{value:b,min:g=0,max:M=100,sweep:y=180,thickness:N=.22,thresholds:j,ticks:k=!1,showRange:$=!0,center:w,caption:z,height:I,format:P,locale:S,label:A,empty:C,size:R="md",variant:B="text",color:F="primary",padded:G=!1,className:L,...W}=p(v,["size","variant","locale"]),Y=n.useRef(null),q=r(Y),D=d(h,S),E=n.useCallback(t=>P?c(S,P).format(t):o(t,S),[P,S]),H=Math.max(1,Math.min(360,y)),J=H/2,K=-J,O=J,Q=M-g,T=null===b||Number.isNaN(b)||0===Q?null:Math.min(1,Math.max(0,(b-g)/Q)),U=null===b?F:function(t,e,a){if(!a||0===a.length)return e;let n=e;for(const e of a)t>=e.from&&(n=e.color);return n}(b,F,j),V="number"==typeof I?I:m[R],X=s[R],Z=H>=360?1:Math.max(0,-Math.cos(J*Math.PI/180)),_=H>=180?1:Math.sin(J*Math.PI/180),tt=X*($?1.6:.6),et=Math.max(0,Math.min((q-2*tt)/(2*_),(V-tt*(Z>0?2:1))/(1+Z))),at=et*(1-Math.min(.9,Math.max(.05,N))),nt=q/2,lt=tt+et,rt=et<=0||0===Q,it=null===T?K:K+H*T,st=lt-et+et*(1+Z)/2,ot=!1===k?0:Math.max(2,Math.floor(k));return t(l,{...W,variant:B,color:F,size:R,padded:G,legendSide:"bottom",className:L,legend:null,table:null,children:t("div",{ref:Y,className:"relative w-full",style:{height:V},role:void 0===A?void 0:"img","aria-label":void 0===A?void 0:null===b?A:`${A}: ${E(b)} / ${E(M)}`,children:rt?t("div",{className:f("flex h-full items-center justify-center text-(--neba-muted-fg)",u[R]),children:C??D.title}):q>0?e(a,{children:[e("svg",{width:q,height:V,viewBox:`0 0 ${q} ${V}`,"aria-hidden":"true",className:"block",children:[t("path",{d:i(nt,lt,et,at,K,O),fill:`var(--neba-${F}-soft)`}),null!==T&&T>0?t("path",{d:i(nt,lt,et,at,K,it),fill:`var(--neba-${U}-fill)`,style:{transition:"fill var(--neba-duration) var(--neba-ease)"}}):null,ot>0?Array.from({length:ot},(e,a)=>{const n=K+H*a/(ot-1),[l,r]=x(nt,lt,et+.25*X,n),[i,s]=x(nt,lt,et+.6*X,n);return t("line",{x1:l,y1:r,x2:i,y2:s,stroke:"var(--neba-chart-grid)",strokeWidth:1,strokeLinecap:"round"},a)}):null,$?[[g,K,"start"],[M,O,"end"]].map(([e,a,n])=>{const[l,r]=x(nt,lt,(et+at)/2,a);return t("text",{x:l+(H>=300?0:"start"===n?.6*-X:.6*X),y:r+X*(H>=300?1.4:.35),textAnchor:H>=300?"middle":"start"===n?"end":"start",fontSize:X,fill:"var(--neba-muted-fg)",children:E(e)},n)}):null]}),e("div",{className:"pointer-events-none absolute inset-x-0 flex flex-col items-center gap-0.5",style:{top:st,transform:"translateY(-50%)"},children:[t("span",{className:"font-semibold tabular-nums text-(--neba-fg)",style:{fontSize:2*X},children:w??(null===b?"—":E(b))}),z?t("span",{className:f("text-(--neba-muted-fg)",u[R]),children:z}):null]})]}):null})})}
@@ -1 +1 @@
1
- "use client";import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{alignContentClasses as n,alignItemsClasses as a,columnCount as t,justifyContentClasses as o,responsiveSlots as s,spacingValue as i,withBaseline as p}from"../../internal/grid.js";import{boxPaddingClasses as l}from"../box/Box.js";import{cx as c}from"../../internal/styles.js";export const GridContainer=/*@__PURE__*/e.forwardRef(function({columns:e,spacing:m,rowSpacing:d,columnSpacing:f,justifyContent:g,alignItems:u,alignContent:x,wrap:y=!0,padded:w=!0,size:j="md",density:b="default",render:C,className:h,style:N,children:S,...z},B){const G=c("neba-grid flex",y?"flex-wrap":"flex-nowrap","gap-x-(--n-gap-x) gap-y-(--n-gap-y)",w?l[b][j]:"",g?o[g]:"",u?a[u]:"",x?n[x]:"",h??"");return r({render:C,ref:B,props:{className:G,style:{...s("cols",p(e,12),t),...s("gap-x",p(f??m,2),i),...s("gap-y",p(d??m,2),i),...N},children:S,...z}})});
1
+ "use client";import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{alignContentClasses as n,alignItemsClasses as a,columnCount as t,justifyContentClasses as s,responsiveSlots as i,spacingValue as o,withBaseline as p}from"../../internal/grid.js";import{boxPaddingClasses as l}from"../box/Box.js";import{cx as m}from"../../internal/styles.js";import{useStyleDefaults as d}from"../../internal/defaults.js";export const GridContainer=/*@__PURE__*/e.forwardRef(function(e,c){const{columns:f,spacing:g,rowSpacing:u,columnSpacing:x,justifyContent:y,alignItems:j,alignContent:w,wrap:b=!0,padded:C=!0,size:h="md",density:z="default",render:N,className:S,style:B,children:G,...I}=d(e,["size","density"]),R=m("neba-grid flex",b?"flex-wrap":"flex-nowrap","gap-x-(--n-gap-x) gap-y-(--n-gap-y)",C?l[z][h]:"",y?s[y]:"",j?a[j]:"",w?n[w]:"",S??"");return r({render:N,ref:c,props:{className:R,style:{...i("cols",p(f,12),t),...i("gap-x",p(x??g,2),o),...i("gap-y",p(u??g,2),o),...B},children:G,...I}})});
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{useRender as n}from"@base-ui/react/use-render";import{boxPaddingXClasses as t}from"../box/Box.js";import{PageLayoutContext as s}from"../../internal/page-layout.js";import{cx as i,hasContent as l,surfaceClasses as m,surfaceSlots as o,transitionClasses as d}from"../../internal/styles.js";const c={xs:"min-h-10",sm:"min-h-12",md:"min-h-14",lg:"min-h-16",xl:"min-h-20"},x={xs:"gap-1.5",sm:"gap-2",md:"gap-3",lg:"gap-4",xl:"gap-5"},f={xs:"gap-3",sm:"gap-4",md:"gap-6",lg:"gap-8",xl:"gap-10"},p={xs:"max-w-[30rem]",sm:"max-w-[40rem]",md:"max-w-[48rem]",lg:"max-w-[64rem]",xl:"max-w-[80rem]"},u={solid:[m,"text-(--neba-fg) bg-(--n-panel-press)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[m,"text-(--neba-fg) bg-(--n-panel)","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-transparent"},g={static:"",sticky:"sticky top-0 z-30",fixed:"fixed inset-x-0 top-0 z-40"},h={start:"shrink-0",center:"flex-1 basis-0",end:"shrink-0"},b={start:"flex min-w-0 flex-1 items-center justify-start",center:"flex min-w-0 shrink items-center justify-center",end:"flex min-w-0 flex-1 items-center justify-end"};export const Header=/*@__PURE__*/r.forwardRef(function({brand:m,actions:v,align:w="start",position:y="sticky",variant:j="outline",size:N="md",color:k="primary",density:z="default",elevation:C=0,divider:B=!0,maxWidth:H="none",padded:R=!0,label:W,render:q,className:A,style:D,children:E,...F},G){const I=r.useContext(s),{register:J}=I,K=r.useCallback(e=>{J("header",e),"function"==typeof G?G(e):G&&(G.current=e)},[J,G]),L=i("w-full min-w-0",u[j],B?"border-b [border-color:var(--n-line)]":"",g[y],d,A);return n({render:q??e("header",{}),ref:K,props:{"aria-label":W,className:L,style:{...o(k,C),...D},children:a("div",{className:i("flex w-full items-center",c[N],f[N],R?t[z][N]:"","none"===H?"":i(p[H],"mx-auto")),children:[l(m)?e("div",{className:i("flex min-w-0 items-center",h[w],x[N]),children:m}):"center"===w?e("div",{"aria-hidden":"true",className:h[w]}):null,l(E)?e("div",{className:i(b[w],x[N]),children:E}):null,l(v)?e("div",{className:i("flex min-w-0 items-center justify-end",h[w],x[N]),children:v}):"center"===w?e("div",{"aria-hidden":"true",className:h[w]}):null]}),...F}})});
1
+ "use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{useRender as t}from"@base-ui/react/use-render";import{boxPaddingXClasses as n}from"../box/Box.js";import{PageLayoutContext as s}from"../../internal/page-layout.js";import{cx as i,hasContent as l,surfaceClasses as m,surfaceSlots as o,transitionClasses as d}from"../../internal/styles.js";import{useStyleDefaults as c}from"../../internal/defaults.js";const x={xs:"min-h-10",sm:"min-h-12",md:"min-h-14",lg:"min-h-16",xl:"min-h-20"},f={xs:"gap-1.5",sm:"gap-2",md:"gap-3",lg:"gap-4",xl:"gap-5"},p={xs:"gap-3",sm:"gap-4",md:"gap-6",lg:"gap-8",xl:"gap-10"},u={xs:"max-w-[30rem]",sm:"max-w-[40rem]",md:"max-w-[48rem]",lg:"max-w-[64rem]",xl:"max-w-[80rem]"},g={solid:[m,"text-(--neba-fg) bg-(--n-panel-press)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[m,"text-(--neba-fg) bg-(--n-panel)","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-transparent"},h={static:"",sticky:"sticky top-0 z-30",fixed:"fixed inset-x-0 top-0 z-40"},b={start:"shrink-0",center:"flex-1 basis-0",end:"shrink-0"},v={start:"flex min-w-0 flex-1 items-center justify-start",center:"flex min-w-0 shrink items-center justify-center",end:"flex min-w-0 flex-1 items-center justify-end"};export const Header=/*@__PURE__*/r.forwardRef(function(m,w){const{brand:y,actions:j,align:N="start",position:k="sticky",variant:z="outline",size:C="md",color:B="primary",density:H="default",elevation:R=0,divider:W=!0,maxWidth:q="none",padded:A=!0,label:D,render:E,className:F,style:G,children:I,...J}=c(m,["size","density","variant"]),K=r.useContext(s),{register:L}=K,M=r.useCallback(e=>{L("header",e),"function"==typeof w?w(e):w&&(w.current=e)},[L,w]),O=i("w-full min-w-0",g[z],W?"border-b [border-color:var(--n-line)]":"",h[k],d,F);return t({render:E??e("header",{}),ref:M,props:{"aria-label":D,className:O,style:{...o(B,R),...G},children:a("div",{className:i("flex w-full items-center",x[C],p[C],A?n[H][C]:"","none"===q?"":i(u[q],"mx-auto")),children:[l(y)?e("div",{className:i("flex min-w-0 items-center",b[N],f[C]),children:y}):"center"===N?e("div",{"aria-hidden":"true",className:b[N]}):null,l(I)?e("div",{className:i(v[N],f[C]),children:I}):null,l(j)?e("div",{className:i("flex min-w-0 items-center justify-end",b[N],f[C]),children:j}):"center"===N?e("div",{"aria-hidden":"true",className:b[N]}):null]}),...J}})});
@@ -66,4 +66,4 @@ export interface HeatmapChartProps extends Omit<ChartBaseProps, 'legend'> {
66
66
  * rather than off the categorical palette — a heatmap in eight hues says its
67
67
  * cells are eight unrelated things.
68
68
  */
69
- export declare function HeatmapChart({ series, categories, shape, scale, midpoint, min, max, valueLabels, height, format, locale, label, legend, tooltip, empty, size, variant, padded, className, ...box }: HeatmapChartProps): React.JSX.Element;
69
+ export declare function HeatmapChart(rawProps: HeatmapChartProps): React.JSX.Element;
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as l from"react";import{ChartScaleLegend as n,ChartStatus as i,ChartSurface as a,ChartTooltipPanel as r,useMeasuredWidth as o}from"../../internal/chart-frame.js";import{categoryAt as d,chartFontSizes as h,compactNumber as s,formatCategory as c,markGap as m,plotHeights as u,rampFill as x,rampInk as f,rampStep as g,rampSteps as p,squarify as v,textWidth as w,toValues as b,truncate as y}from"../../internal/chart.js";import{numberFormatter as M}from"../../internal/format.js";import{cx as $,metaTextClasses as j,srOnlyClasses as k}from"../../internal/styles.js";import{chartMessages as A,emptyMessages as N,useMessages as z}from"../../internal/i18n.js";export function HeatmapChart({series:S,categories:B,shape:C="grid",scale:I="sequential",midpoint:_=0,min:D,max:L,valueLabels:P="none",height:R,format:q,locale:H,label:K,legend:U,tooltip:W,empty:F,size:G="md",variant:J="text",padded:O=!1,className:Q,...T}){const V=l.useRef(null),X=o(V),Y=z(N,H),Z=z(A,H),ee=l.useId(),[te,le]=l.useState(null),ne=l.useCallback(e=>q?M(H,q).format(e):s(e,H),[q,H]),ie=l.useMemo(()=>b(S),[S]),ae=ie.reduce((e,t)=>Math.max(e,t.length),0),re=l.useMemo(()=>Array.from({length:ae},(e,t)=>d(t,B,ie)),[ae,B,ie]),oe=l.useMemo(()=>S.map((e,t)=>e.name??`${t+1}`),[S]),de=l.useMemo(()=>{let e=1/0,t=-1/0,l=!1;for(const n of ie)for(const i of n)null!==i.value&&(l=!0,e=Math.min(e,i.value),t=Math.max(t,i.value));return l?{min:e,max:t}:null},[ie]),he=D??de?.min??0,se=L??de?.max??1,ce=l.useCallback(e=>g(e,he,se,I,_),[he,se,I,_]),me="number"==typeof R?R:u[G]??220,ue=h[G],xe=!0===U||void 0===U||!1===U?{}:U,fe=!1!==U,ge=xe.side??"bottom",pe=!1===W?{mode:"none"}:!0===W||void 0===W?{}:W,ve="none"===pe.mode,we=null===de||0===ae||0===S.length,be=l.useMemo(()=>{if("treemap"===C||X<=0)return{texts:[],band:0};const e=Math.min(150,.25*X),t=oe.map(t=>y(t,e,ue));return{texts:t,band:t.reduce((e,t)=>Math.max(e,w(t,ue)),0)+10}},[C,oe,X,ue]),ye="treemap"===C?0:ue+8,Me={left:be.band,width:Math.max(0,X-be.band),height:Math.max(0,me-ye)},$e=l.useMemo(()=>{if(Me.width<=0||Me.height<=0)return[];if("treemap"===C){const e=[];return ie.forEach((t,l)=>t.forEach((t,n)=>{null!==t.value&&e.push({row:l,index:n,cell:t})})),v(e.map(e=>Math.max(0,e.cell.value??0)),Me.width,Me.height).map(t=>({row:e[t.index].row,index:e[t.index].index,cell:e[t.index].cell,x:Me.left+t.x,y:t.y,width:t.width,height:t.height}))}const e=Me.height/Math.max(1,S.length),t=Me.width/Math.max(1,ae),l=[];return ie.forEach((n,i)=>n.forEach((n,a)=>{null!==n.value&&l.push({row:i,index:a,cell:n,x:Me.left+a*t,y:i*e,width:t,height:e})})),l},[C,ie,S.length,ae,Me.left,Me.width,Me.height]),je=l.useCallback(e=>c(e.cell.x??B?.[e.index]??re[e.index]??e.index,H),[B,re,H]),ke=null===te?null:$e.find(e=>e.row===te.row&&e.index===te.index)??null,Ae=null===ke?[]:[{seriesIndex:ke.row,color:ke.cell.color??x(ce(ke.cell.value??0),I),value:ke.cell.value,formatted:ne(ke.cell.value??0),label:ke.cell.label}],Ne=Array.from({length:p},(e,t)=>x(t,I));return t(a,{...T,size:G,variant:J,padded:O,className:Q,legendSide:ge,legend:fe&&!we?e(n,{steps:Ne,from:ne("diverging"===I?-E(he,se,_)+_:he),to:ne("diverging"===I?E(he,se,_)+_:se),middle:"diverging"===I?ne(_):void 0,align:xe.align??"center",vertical:"left"===ge||"right"===ge,size:G}):null,table:we?null:t("table",{id:ee,className:k,children:[K?e("caption",{children:K}):null,e("thead",{children:t("tr",{children:[e("th",{scope:"col"}),re.map((t,l)=>e("th",{scope:"col",children:c(t,H)},l))]})}),e("tbody",{children:ie.map((l,n)=>t("tr",{children:[e("th",{scope:"row",children:oe[n]}),re.map((t,n)=>{const i=l[n];return e("td",{children:void 0!==i?.label?i.label:null==i?.value?"":ne(i.value)},n)})]},n))})]}),children:[t("div",{ref:V,role:"img",tabIndex:we?void 0:0,"aria-label":K??Z.label,"aria-describedby":we?void 0:ee,onPointerLeave:()=>le(null),onBlur:()=>le(null),onKeyDown:e=>{if(ve||0===$e.length)return;const t=null===te?-1:$e.findIndex(e=>e.row===te.row&&e.index===te.index);if("ArrowRight"===e.key||"ArrowDown"===e.key){const e=$e[Math.min($e.length-1,t+1)];le({row:e.row,index:e.index})}else if("ArrowLeft"===e.key||"ArrowUp"===e.key){const e=$e[Math.max(0,(-1===t?$e.length:t)-1)];le({row:e.row,index:e.index})}else{if("Escape"!==e.key)return;le(null)}e.preventDefault()},className:$("relative w-full rounded-(--neba-radius-xs)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"),style:{height:me},children:[we?e("div",{className:$("flex h-full items-center justify-center text-(--neba-muted-fg)",j[G]),children:F??Y.title}):X>0?t("svg",{width:X,height:me,viewBox:`0 0 ${X} ${me}`,"aria-hidden":"true",className:"block",children:[$e.map(l=>{const n=ce(l.cell.value??0),i=te?.row===l.row&&te?.index===l.index,a=Math.max(0,l.width-m),r=Math.max(0,l.height-m);if(a<=0||r<=0)return null;const o=ne(l.cell.value??0),d="treemap"===C?"all"===P?[je(l),o]:[je(l)]:"all"===P?[o]:[],h=d.filter(e=>function(e,t,l,n){return l>=1.8*n&&t>=Math.min(w(e,n),2.5*n)+8}(e,a,r/d.length,ue)),s=l.cell.color?"var(--neba-surface)":f(n,I);return t("g",{children:[e("rect",{x:l.x+m/2,y:l.y+m/2,width:a,height:r,rx:Math.min(3,a/2,r/2),fill:l.cell.color??x(n,I),opacity:i?1:.94,onPointerEnter:ve?void 0:()=>le({row:l.row,index:l.index}),className:"[transition:opacity_var(--neba-duration)_var(--neba-ease)]"}),h.map((t,n)=>e("text",{x:l.x+l.width/2,y:l.y+l.height/2+(n-(h.length-1)/2)*(ue+2),textAnchor:"middle",dominantBaseline:"central",fontSize:ue,fontWeight:0===n?500:400,fill:s,opacity:0===n?1:.85,pointerEvents:"none",className:0===n&&"treemap"===C?void 0:"tabular-nums",children:y(t,l.width-8,ue)},n))]},`${l.row}-${l.index}`)}),"grid"===C?be.texts.map((t,l)=>e("text",{x:Me.left-8,y:(l+.5)*Me.height/Math.max(1,S.length),textAnchor:"end",dominantBaseline:"central",fontSize:ue,fill:"var(--neba-muted-fg)",children:t},`row-${l}`)):null,"grid"===C?re.map((t,l)=>{const n=Me.width/Math.max(1,ae),i=c(t,H);return l%Math.max(1,Math.ceil((w(i,ue)+8)/Math.max(1,n)))!==0?null:e("text",{x:Me.left+(l+.5)*n,y:Me.height+ue,textAnchor:"middle",fontSize:ue,fill:"var(--neba-muted-fg)",children:i},`col-${l}`)}):null]}):null,ke&&!ve?pe.render?e("div",{className:"pointer-events-none absolute z-10",style:{left:ke.x+ke.width/2,top:ke.y},children:pe.render({index:ke.index,category:ke.cell.x??re[ke.index]??ke.index,items:Ae})}):e(r,{heading:`${oe[ke.row]} · ${je(ke)}`,items:Ae,x:ke.x+ke.width/2,y:ke.y,flip:ke.x+ke.width/2>.6*X,size:G}):null]}),ve?null:e(i,{heading:ke?`${oe[ke.row]} · ${je(ke)}`:void 0,items:Ae})]})}function E(e,t,l){return Math.max(Math.abs(t-l),Math.abs(l-e))}
1
+ "use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as l from"react";import{ChartScaleLegend as n,ChartStatus as i,ChartSurface as a,ChartTooltipPanel as r,useMeasuredWidth as o}from"../../internal/chart-frame.js";import{categoryAt as d,chartFontSizes as h,compactNumber as s,formatCategory as c,markGap as m,plotHeights as u,rampFill as x,rampInk as f,rampStep as g,rampSteps as p,squarify as v,textWidth as w,toValues as b,truncate as y}from"../../internal/chart.js";import{numberFormatter as M}from"../../internal/format.js";import{cx as $,metaTextClasses as j,srOnlyClasses as k}from"../../internal/styles.js";import{chartMessages as z,emptyMessages as A,useMessages as N}from"../../internal/i18n.js";import{useStyleDefaults as E}from"../../internal/defaults.js";export function HeatmapChart(B){const{series:C,categories:I,shape:_="grid",scale:D="sequential",midpoint:L=0,min:P,max:R,valueLabels:q="none",height:H,format:K,locale:U,label:W,legend:F,tooltip:G,empty:J,size:O="md",variant:Q="text",padded:T=!1,className:V,...X}=E(B,["size","variant","locale"]),Y=l.useRef(null),Z=o(Y),ee=N(A,U),te=N(z,U),le=l.useId(),[ne,ie]=l.useState(null),ae=l.useCallback(e=>K?M(U,K).format(e):s(e,U),[K,U]),re=l.useMemo(()=>b(C),[C]),oe=re.reduce((e,t)=>Math.max(e,t.length),0),de=l.useMemo(()=>Array.from({length:oe},(e,t)=>d(t,I,re)),[oe,I,re]),he=l.useMemo(()=>C.map((e,t)=>e.name??`${t+1}`),[C]),se=l.useMemo(()=>{let e=1/0,t=-1/0,l=!1;for(const n of re)for(const i of n)null!==i.value&&(l=!0,e=Math.min(e,i.value),t=Math.max(t,i.value));return l?{min:e,max:t}:null},[re]),ce=P??se?.min??0,me=R??se?.max??1,ue=l.useCallback(e=>g(e,ce,me,D,L),[ce,me,D,L]),xe="number"==typeof H?H:u[O]??220,fe=h[O],ge=!0===F||void 0===F||!1===F?{}:F,pe=!1!==F,ve=ge.side??"bottom",we=!1===G?{mode:"none"}:!0===G||void 0===G?{}:G,be="none"===we.mode,ye=null===se||0===oe||0===C.length,Me=l.useMemo(()=>{if("treemap"===_||Z<=0)return{texts:[],band:0};const e=Math.min(150,.25*Z),t=he.map(t=>y(t,e,fe));return{texts:t,band:t.reduce((e,t)=>Math.max(e,w(t,fe)),0)+10}},[_,he,Z,fe]),$e="treemap"===_?0:fe+8,je={left:Me.band,width:Math.max(0,Z-Me.band),height:Math.max(0,xe-$e)},ke=l.useMemo(()=>{if(je.width<=0||je.height<=0)return[];if("treemap"===_){const e=[];return re.forEach((t,l)=>t.forEach((t,n)=>{null!==t.value&&e.push({row:l,index:n,cell:t})})),v(e.map(e=>Math.max(0,e.cell.value??0)),je.width,je.height).map(t=>({row:e[t.index].row,index:e[t.index].index,cell:e[t.index].cell,x:je.left+t.x,y:t.y,width:t.width,height:t.height}))}const e=je.height/Math.max(1,C.length),t=je.width/Math.max(1,oe),l=[];return re.forEach((n,i)=>n.forEach((n,a)=>{null!==n.value&&l.push({row:i,index:a,cell:n,x:je.left+a*t,y:i*e,width:t,height:e})})),l},[_,re,C.length,oe,je.left,je.width,je.height]),ze=l.useCallback(e=>c(e.cell.x??I?.[e.index]??de[e.index]??e.index,U),[I,de,U]),Ae=null===ne?null:ke.find(e=>e.row===ne.row&&e.index===ne.index)??null,Ne=null===Ae?[]:[{seriesIndex:Ae.row,color:Ae.cell.color??x(ue(Ae.cell.value??0),D),value:Ae.cell.value,formatted:ae(Ae.cell.value??0),label:Ae.cell.label}],Ee=Array.from({length:p},(e,t)=>x(t,D));return t(a,{...X,size:O,variant:Q,padded:T,className:V,legendSide:ve,legend:pe&&!ye?e(n,{steps:Ee,from:ae("diverging"===D?-S(ce,me,L)+L:ce),to:ae("diverging"===D?S(ce,me,L)+L:me),middle:"diverging"===D?ae(L):void 0,align:ge.align??"center",vertical:"left"===ve||"right"===ve,size:O}):null,table:ye?null:t("table",{id:le,className:k,children:[W?e("caption",{children:W}):null,e("thead",{children:t("tr",{children:[e("th",{scope:"col"}),de.map((t,l)=>e("th",{scope:"col",children:c(t,U)},l))]})}),e("tbody",{children:re.map((l,n)=>t("tr",{children:[e("th",{scope:"row",children:he[n]}),de.map((t,n)=>{const i=l[n];return e("td",{children:void 0!==i?.label?i.label:null==i?.value?"":ae(i.value)},n)})]},n))})]}),children:[t("div",{ref:Y,role:"img",tabIndex:ye?void 0:0,"aria-label":W??te.label,"aria-describedby":ye?void 0:le,onPointerLeave:()=>ie(null),onBlur:()=>ie(null),onKeyDown:e=>{if(be||0===ke.length)return;const t=null===ne?-1:ke.findIndex(e=>e.row===ne.row&&e.index===ne.index);if("ArrowRight"===e.key||"ArrowDown"===e.key){const e=ke[Math.min(ke.length-1,t+1)];ie({row:e.row,index:e.index})}else if("ArrowLeft"===e.key||"ArrowUp"===e.key){const e=ke[Math.max(0,(-1===t?ke.length:t)-1)];ie({row:e.row,index:e.index})}else{if("Escape"!==e.key)return;ie(null)}e.preventDefault()},className:$("relative w-full rounded-(--neba-radius-xs)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"),style:{height:xe},children:[ye?e("div",{className:$("flex h-full items-center justify-center text-(--neba-muted-fg)",j[O]),children:J??ee.title}):Z>0?t("svg",{width:Z,height:xe,viewBox:`0 0 ${Z} ${xe}`,"aria-hidden":"true",className:"block",children:[ke.map(l=>{const n=ue(l.cell.value??0),i=ne?.row===l.row&&ne?.index===l.index,a=Math.max(0,l.width-m),r=Math.max(0,l.height-m);if(a<=0||r<=0)return null;const o=ae(l.cell.value??0),d="treemap"===_?"all"===q?[ze(l),o]:[ze(l)]:"all"===q?[o]:[],h=d.filter(e=>function(e,t,l,n){return l>=1.8*n&&t>=Math.min(w(e,n),2.5*n)+8}(e,a,r/d.length,fe)),s=l.cell.color?"var(--neba-surface)":f(n,D);return t("g",{children:[e("rect",{x:l.x+m/2,y:l.y+m/2,width:a,height:r,rx:Math.min(3,a/2,r/2),fill:l.cell.color??x(n,D),opacity:i?1:.94,onPointerEnter:be?void 0:()=>ie({row:l.row,index:l.index}),className:"[transition:opacity_var(--neba-duration)_var(--neba-ease)]"}),h.map((t,n)=>e("text",{x:l.x+l.width/2,y:l.y+l.height/2+(n-(h.length-1)/2)*(fe+2),textAnchor:"middle",dominantBaseline:"central",fontSize:fe,fontWeight:0===n?500:400,fill:s,opacity:0===n?1:.85,pointerEvents:"none",className:0===n&&"treemap"===_?void 0:"tabular-nums",children:y(t,l.width-8,fe)},n))]},`${l.row}-${l.index}`)}),"grid"===_?Me.texts.map((t,l)=>e("text",{x:je.left-8,y:(l+.5)*je.height/Math.max(1,C.length),textAnchor:"end",dominantBaseline:"central",fontSize:fe,fill:"var(--neba-muted-fg)",children:t},`row-${l}`)):null,"grid"===_?de.map((t,l)=>{const n=je.width/Math.max(1,oe),i=c(t,U);return l%Math.max(1,Math.ceil((w(i,fe)+8)/Math.max(1,n)))!==0?null:e("text",{x:je.left+(l+.5)*n,y:je.height+fe,textAnchor:"middle",fontSize:fe,fill:"var(--neba-muted-fg)",children:i},`col-${l}`)}):null]}):null,Ae&&!be?we.render?e("div",{className:"pointer-events-none absolute z-10",style:{left:Ae.x+Ae.width/2,top:Ae.y},children:we.render({index:Ae.index,category:Ae.cell.x??de[Ae.index]??Ae.index,items:Ne})}):e(r,{heading:`${he[Ae.row]} · ${ze(Ae)}`,items:Ne,x:Ae.x+Ae.width/2,y:Ae.y,flip:Ae.x+Ae.width/2>.6*Z,size:O}):null]}),be?null:e(i,{heading:Ae?`${he[Ae.row]} · ${ze(Ae)}`:void 0,items:Ne})]})}function S(e,t,l){return Math.max(Math.abs(t-l),Math.abs(l-e))}
@@ -1 +1 @@
1
- "use client";import{jsx as n}from"react/jsx-runtime";import*as e from"react";import{cx as t,transitionClasses as r}from"../../internal/styles.js";const o={solid:"bg-(--n-fill) text-(--n-on-solid)",outline:"border bg-(--n-panel) text-(--n-accent) [border-color:var(--n-line)]",text:"bg-transparent text-(--n-accent)"},l={regular:"font-normal",medium:"font-medium",semibold:"font-semibold",bold:"font-bold"},i=/[\p{L}\p{N}_]/u;function a(n){return n.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function s(n,e,t){const r=e>0?n[e-1]:"",o=t<n.length?n[t]:"";return!i.test(r)&&!i.test(o)}function c(n,e,t,r){e.lastIndex=0;const o=[];let l,i=0;for(;null!==(l=e.exec(n));){if(""===l[0]){e.lastIndex+=1;continue}const a=l.index,c=a+l[0].length;!t||s(n,a,c)?(a>i&&o.push(n.slice(i,a)),o.push(r(l[0],`${a}`)),i=c):e.lastIndex=a+1}return 0===o.length?n:(i<n.length&&o.push(n.slice(i)),o)}function u(n,t,r,o){if("string"==typeof n)return c(n,t,r,o);if("number"==typeof n)return c(String(n),t,r,o);if(Array.isArray(n))return e.Children.map(n,n=>u(n,t,r,o));if(e.isValidElement(n)){const l=n.props.children;return void 0===l||"function"==typeof l?n:e.cloneElement(n,void 0,u(l,t,r,o))}return n}export const Highlight=/*@__PURE__*/e.forwardRef(function({query:i,variant:s="solid",color:c="warning",caseSensitive:f=!1,wholeWord:d=!1,underline:m=!1,weight:g,className:p,style:h,children:x,...b},y){const v=e.useMemo(()=>function(n,e){if(n instanceof RegExp)return new RegExp(n.source,n.global?n.flags:`${n.flags}g`);const t=(Array.isArray(n)?n:[n]).map(n=>n.trim()).filter(Boolean).sort((n,e)=>e.length-n.length);return 0===t.length?null:new RegExp(t.map(a).join("|"),e?"gu":"giu")}(i,f),[i,f]),$=t("rounded-[0.25rem] px-0.5 -mx-0.5","box-decoration-clone",o[s],m?"underline decoration-2 underline-offset-2":"",g?l[g]:"",r),w=v?u(x,v,d,(e,t)=>n("mark",{className:$,children:e},t)):x;return n("span",{ref:y,className:p,style:{"--n-fill":`var(--neba-${c}-fill)`,"--n-on-solid":`var(--neba-${c}-on-solid)`,"--n-accent":`var(--neba-${c}-accent)`,"--n-panel":`var(--neba-${c}-panel)`,"--n-line":`var(--neba-${c}-line)`,...h},...b,children:w})});
1
+ "use client";import{jsx as n}from"react/jsx-runtime";import*as e from"react";import{cx as t,transitionClasses as r}from"../../internal/styles.js";import{useStyleDefaults as o}from"../../internal/defaults.js";const l={solid:"bg-(--n-fill) text-(--n-on-solid)",outline:"border bg-(--n-panel) text-(--n-accent) [border-color:var(--n-line)]",text:"bg-transparent text-(--n-accent)"},i={regular:"font-normal",medium:"font-medium",semibold:"font-semibold",bold:"font-bold"},a=/[\p{L}\p{N}_]/u;function s(n){return n.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function c(n,e,t){const r=e>0?n[e-1]:"",o=t<n.length?n[t]:"";return!a.test(r)&&!a.test(o)}function u(n,e,t,r){e.lastIndex=0;const o=[];let l,i=0;for(;null!==(l=e.exec(n));){if(""===l[0]){e.lastIndex+=1;continue}const a=l.index,s=a+l[0].length;!t||c(n,a,s)?(a>i&&o.push(n.slice(i,a)),o.push(r(l[0],`${a}`)),i=s):e.lastIndex=a+1}return 0===o.length?n:(i<n.length&&o.push(n.slice(i)),o)}function f(n,t,r,o){if("string"==typeof n)return u(n,t,r,o);if("number"==typeof n)return u(String(n),t,r,o);if(Array.isArray(n))return e.Children.map(n,n=>f(n,t,r,o));if(e.isValidElement(n)){const l=n.props.children;return void 0===l||"function"==typeof l?n:e.cloneElement(n,void 0,f(l,t,r,o))}return n}export const Highlight=/*@__PURE__*/e.forwardRef(function(a,c){const{query:u,variant:d="solid",color:m="warning",caseSensitive:p=!1,wholeWord:g=!1,underline:h=!1,weight:x,className:b,style:v,children:y,...$}=o(a,["variant"]),w=e.useMemo(()=>function(n,e){if(n instanceof RegExp)return new RegExp(n.source,n.global?n.flags:`${n.flags}g`);const t=(Array.isArray(n)?n:[n]).map(n=>n.trim()).filter(Boolean).sort((n,e)=>e.length-n.length);return 0===t.length?null:new RegExp(t.map(s).join("|"),e?"gu":"giu")}(u,p),[u,p]),j=t("rounded-[0.25rem] px-0.5 -mx-0.5","box-decoration-clone",l[d],h?"underline decoration-2 underline-offset-2":"",x?i[x]:"",r),E=w?f(y,w,g,(e,t)=>n("mark",{className:j,children:e},t)):y;return n("span",{ref:c,className:b,style:{"--n-fill":`var(--neba-${m}-fill)`,"--n-on-solid":`var(--neba-${m}-on-solid)`,"--n-accent":`var(--neba-${m}-accent)`,"--n-panel":`var(--neba-${m}-panel)`,"--n-line":`var(--neba-${m}-line)`,...v},...$,children:E})});
@@ -75,4 +75,4 @@ export interface HoverCardProps extends Pick<NebaStyleProps, 'size' | 'color' |
75
75
  * without hover, a touchscreen with no pointer at all, and a screen reader all
76
76
  * arrive by that route instead.
77
77
  */
78
- export declare function HoverCard({ size, color, density, trigger, title, description, children, side, align, sideOffset, alignOffset, arrow, open, defaultOpen, onOpenChange, delay, closeDelay, width, className, style, ...props }: HoverCardProps): React.JSX.Element;
78
+ export declare function HoverCard(rawProps: HoverCardProps): React.JSX.Element;
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import{PreviewCard as t}from"@base-ui/react/preview-card";import{boxPaddingXClasses as l,boxPaddingYClasses as i}from"../box/Box.js";import{cx as n,hasContent as o,metaTextClasses as r,radiusClasses as s,sheetBodyClasses as d,sheetHeaderGapClasses as c,sheetSectionGapClasses as m,sheetTitleClasses as p,surfaceClasses as f,surfaceSlots as x,toLength as h}from"../../internal/styles.js";const g={xs:"max-w-64",sm:"max-w-72",md:"max-w-84",lg:"max-w-md",xl:"max-w-xl"},u=[f,"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]","[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),b={xs:8,sm:9,md:10,lg:11,xl:12};export function HoverCard({size:f="md",color:v="primary",density:w="default",trigger:y,title:N,description:O,children:j,side:k="bottom",align:z="center",sideOffset:C=6,alignOffset:P=0,arrow:$=!1,open:B,defaultOpen:D,onOpenChange:M,delay:W,closeDelay:_,width:A,className:E,style:H,...L}){const R=l[w][f],T=i[w][f],q=b[f],F=o(N)||o(O),G=h(A);return a(t.Root,{open:B,defaultOpen:D,onOpenChange:e=>M?.(e),children:[e(t.Trigger,{render:y,delay:W,closeDelay:_}),e(t.Portal,{children:e(t.Positioner,{className:"neba-portal z-50 [outline:none]",side:k,align:z,sideOffset:C,alignOffset:P,children:a(t.Popup,{className:n(u,s[f],d[f],m[f],R,T,void 0===G?g[f]:"",E??""),style:{...x(v,3),...void 0===G?null:{maxWidth:G},...H},...L,children:[$?e(t.Arrow,{className:["data-[side=top]:bottom-[-1px]","data-[side=bottom]:top-[-1px] data-[side=bottom]:rotate-180","data-[side=left]:right-[-1px] data-[side=left]:-rotate-90","data-[side=right]:left-[-1px] data-[side=right]:rotate-90"].join(" "),children:a("svg",{width:q,height:q/2,viewBox:"0 0 10 5","aria-hidden":"true",className:"block",children:[e("path",{d:"M0 0h10L5 5z",fill:"var(--n-panel-press)"}),e("path",{d:"M0 0 5 5 10 0",fill:"none",stroke:"var(--n-line)",strokeWidth:"1",vectorEffect:"non-scaling-stroke"})]})}):null,F?a("div",{className:`flex min-w-0 flex-col ${c[f]}`,children:[o(N)?e("div",{className:`m-0 font-semibold ${p[f]}`,children:N}):null,o(O)?e("div",{className:`m-0 text-(--neba-muted-fg) ${r[f]}`,children:O}):null]}):null,o(j)?e("div",{className:"min-w-0",children:j}):null]})})})]})}
1
+ "use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import{PreviewCard as t}from"@base-ui/react/preview-card";import{boxPaddingXClasses as l,boxPaddingYClasses as i}from"../box/Box.js";import{cx as n,hasContent as s,metaTextClasses as r,radiusClasses as o,sheetBodyClasses as d,sheetHeaderGapClasses as m,sheetSectionGapClasses as c,sheetTitleClasses as p,surfaceClasses as f,surfaceSlots as x,toLength as h}from"../../internal/styles.js";import{useStyleDefaults as g}from"../../internal/defaults.js";const u={xs:"max-w-64",sm:"max-w-72",md:"max-w-84",lg:"max-w-md",xl:"max-w-xl"},b=[f,"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]","[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),v={xs:8,sm:9,md:10,lg:11,xl:12};export function HoverCard(f){const{size:w="md",color:y="primary",density:N="default",trigger:j,title:O,description:k,children:z,side:C="bottom",align:P="center",sideOffset:$=6,alignOffset:B=0,arrow:D=!1,open:M,defaultOpen:W,onOpenChange:_,delay:A,closeDelay:E,width:H,className:L,style:R,...T}=g(f,["size","density"]),q=l[N][w],F=i[N][w],G=v[w],I=s(O)||s(k),J=h(H);return a(t.Root,{open:M,defaultOpen:W,onOpenChange:e=>_?.(e),children:[e(t.Trigger,{render:j,delay:A,closeDelay:E}),e(t.Portal,{children:e(t.Positioner,{className:"neba-portal z-50 [outline:none]",side:C,align:P,sideOffset:$,alignOffset:B,children:a(t.Popup,{className:n(b,o[w],d[w],c[w],q,F,void 0===J?u[w]:"",L??""),style:{...x(y,3),...void 0===J?null:{maxWidth:J},...R},...T,children:[D?e(t.Arrow,{className:["data-[side=top]:bottom-[-1px]","data-[side=bottom]:top-[-1px] data-[side=bottom]:rotate-180","data-[side=left]:right-[-1px] data-[side=left]:-rotate-90","data-[side=right]:left-[-1px] data-[side=right]:rotate-90"].join(" "),children:a("svg",{width:G,height:G/2,viewBox:"0 0 10 5","aria-hidden":"true",className:"block",children:[e("path",{d:"M0 0h10L5 5z",fill:"var(--n-panel-press)"}),e("path",{d:"M0 0 5 5 10 0",fill:"none",stroke:"var(--n-line)",strokeWidth:"1",vectorEffect:"non-scaling-stroke"})]})}):null,I?a("div",{className:`flex min-w-0 flex-col ${m[w]}`,children:[s(O)?e("div",{className:`m-0 font-semibold ${p[w]}`,children:O}):null,s(k)?e("div",{className:`m-0 text-(--neba-muted-fg) ${r[w]}`,children:k}):null]}):null,s(z)?e("div",{className:"min-w-0",children:z}):null]})})})]})}
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as l from"react";import{Button as a}from"../button/Button.js";import{boxPaddingClasses as r}from"../box/Box.js";import{CheckIcon as i,ChevronIcon as o,RestartIcon as s,SuccessIcon as c}from"../../internal/icons.js";import{fill as m,stepsMessages as d,useMessages as p}from"../../internal/i18n.js";import{transitionProps as f}from"../../internal/animate.js";import{cx as x,hasContent as u,iconClasses as b,metaTextClasses as h,radiusClasses as g,sheetBodyClasses as v,sheetSectionGapClasses as N,sheetTitleClasses as w,srOnlyClasses as y,surfaceClasses as k,surfaceSlots as j,toLength as C,transitionClasses as z}from"../../internal/styles.js";const S={xs:{box:"1.25rem",text:"text-[0.625rem]"},sm:{box:"1.5rem",text:"text-[0.6875rem]"},md:{box:"1.75rem",text:"text-[0.75rem]"},lg:{box:"2rem",text:"text-[0.8125rem]"},xl:{box:"2.25rem",text:"text-[0.875rem]"}},L={default:{xs:"gap-0.5",sm:"gap-1",md:"gap-1",lg:"gap-1.5",xl:"gap-2"},compact:{xs:"gap-0",sm:"gap-0",md:"gap-0.5",lg:"gap-0.5",xl:"gap-1"}},I={solid:[k,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[k,"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"};function M(e){return"string"==typeof e?e:""}function R({level:e,...t}){return l.createElement(`h${Math.min(6,Math.max(1,e))}`,t)}export const HowToSteps=/*@__PURE__*/l.forwardRef(function({steps:k,title:B,headingLevel:_=3,step:H,defaultStep:T=0,onStepChange:$,completed:E,defaultCompleted:A=!1,onCompletedChange:F,orientation:W="vertical",maxHeight:q,railWidth:D="15rem",navigation:G=!0,divider:J=!0,transition:K="fade",completion:O=!0,completedContent:P,variant:Q="outline",size:U="md",color:V="primary",density:X="default",elevation:Y=0,locale:Z,previousLabel:ee,nextLabel:te,doneLabel:ne,restartLabel:le,className:ae,style:re,...ie},oe){const se=p(d,Z),ce=l.useId(),[me,de]=l.useState(T),[pe,fe]=l.useState(A),xe=void 0!==H,ue=void 0!==E,be=k.length,he=Math.min(Math.max(xe?H:me,0),Math.max(be-1,0)),ge=O&&(ue?E:pe),ve=void 0!==q,Ne="vertical"===W,we=l.useRef(null),ye=l.useRef(null);if(l.useEffect(()=>{const e=we.current,t=ye.current;if(!e||!t)return;const n=e.getBoundingClientRect(),l=t.getBoundingClientRect();Ne?l.top<n.top?e.scrollTop-=n.top-l.top:l.bottom>n.bottom&&(e.scrollTop+=l.bottom-n.bottom):l.left<n.left?e.scrollLeft-=n.left-l.left:l.right>n.right&&(e.scrollLeft+=l.right-n.right)},[he,Ne]),0===be)return null;const ke=(e,t=!1)=>{ue||fe(t),ge!==t&&F?.(t),t||(xe||de(e),e!==he&&$?.(e))},je=0===he,Ce=he===be-1,ze="none"===K?null:f(K),Se=t=>{const n=ge||t<he,l=!ge&&t===he;return e("span",{"aria-hidden":"true",className:x("z-1 flex shrink-0 items-center justify-center rounded-full border font-medium","size-(--n-step-mark) [&_svg]:size-[1.15em]",S[U].text,z,n?"bg-(--n-fill) text-(--n-on-solid) [border-color:transparent]":l?"bg-(--neba-surface) text-(--n-accent) [border-color:var(--n-accent)]":"bg-(--neba-surface) text-(--neba-muted-fg) [border-color:var(--n-line)]"),children:n?e(i,{}):t+1})},Le=e("ol",{ref:we,"aria-label":se.steps,className:x("m-0 flex list-none p-0",Ne?"flex-col":"flex-row",L[X][U],ve&&Ne?"min-h-0 overflow-y-auto overscroll-contain":"",Ne?"":"overflow-x-auto overscroll-contain"),children:k.map((n,l)=>{const a=ge||l<he,r=!ge&&l===he;return t("li",{ref:r?ye:void 0,className:x("relative",Ne?"":"min-w-0 flex-1"),children:[l<be-1?e("span",{"aria-hidden":"true",className:x("absolute",z,a?"bg-(--n-fill)":"bg-(--n-line)",Ne?["w-px","[inset-inline-start:calc(0.25rem+var(--n-step-mark)/2)]","[top:calc(0.25rem+var(--n-step-mark))]","[height:calc(100%-var(--n-step-mark))]"].join(" "):["h-px","[inset-inline-start:calc(50%+var(--n-step-mark)/2)]","[top:calc(0.25rem+var(--n-step-mark)/2)]","[width:calc(100%-var(--n-step-mark))]"].join(" "))}):null,t("button",{type:"button",onClick:()=>ke(l),"aria-current":r?"step":void 0,className:x("flex w-full cursor-pointer items-center p-1 text-start",Ne?"gap-3":"flex-col gap-1.5 text-center",g.sm,"hover:bg-(--n-soft)",z,"focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1"),children:[Se(l),e("span",{className:x("min-w-0",Ne?"truncate":"",h[U],r?"font-medium text-(--neba-fg)":"text-(--neba-muted-fg)"),children:n.title}),e("span",{className:y,children:m(se.step,{index:String(l+1),title:M(n.title)})})]})]},l)})}),Ie=t("div",{className:x("grid flex-1 grid-cols-1",ve?"min-h-0":""),children:[k.map((n,l)=>{const a=ge||l!==he;return t("div",{"aria-hidden":a,inert:a||void 0,className:x("col-start-1 row-start-1 min-w-0",ve?"overflow-y-auto overscroll-contain":"",a?"invisible":ze?.className??""),style:a?void 0:ze?.style,children:[t("div",{className:"mb-3 flex items-baseline gap-3",children:[u(n.icon)?e("span",{"aria-hidden":"true",className:x("flex h-[1lh] shrink-0 items-center text-(--n-accent)",w[U],b),children:n.icon}):null,e(R,{level:_+1,className:x("m-0 min-w-0 flex-1 font-medium",w[U]),children:n.title}),e("span",{className:x("shrink-0 text-(--neba-muted-fg) tabular-nums",h[U]),children:m(se.position,{index:String(l+1),total:String(be)})})]}),n.image?e("img",{src:n.image,alt:n.imageAlt??M(n.title),loading:"lazy",decoding:"async",className:x("mb-3 max-h-72 w-full object-contain",g[U])}):null,u(n.content)?e("div",{className:x("min-w-0",v[U]),children:n.content}):null]},l)}),O?t("div",{"aria-hidden":!ge,inert:!ge||void 0,className:x("col-start-1 row-start-1 flex min-w-0 flex-col items-center justify-center gap-2 py-4 text-center",ge?ze?.className??"":"invisible"),style:ge?ze?.style:void 0,children:[e("span",{"aria-hidden":"true",className:"text-(--n-accent) [&_svg]:size-9",children:e(c,{})}),e("p",{className:x("m-0 font-medium",v[U]),children:P??se.completed})]}):null]});return t("div",{ref:oe,"aria-labelledby":u(B)?ce:void 0,className:x("flex min-w-0 flex-col",g[U],r[X][U],N[U],I[Q],z,ae),style:{...j(V,Y),"--n-fill":`var(--neba-${V}-fill)`,"--n-on-solid":`var(--neba-${V}-on-solid)`,"--n-step-mark":S[U].box,"--n-step-rail":C(D),...ve?{maxHeight:C(q)}:null,...re},...ie,children:[u(B)?e(R,{level:_,id:ce,className:x("m-0 shrink-0 font-medium",w[U]),children:B}):null,t("div",{className:x("flex min-w-0 flex-1 flex-col",ve?"min-h-0":"",Ne?"gap-4 sm:flex-row sm:gap-5":"gap-4"),children:[e("div",{className:x("flex min-w-0 flex-col",ve?"min-h-0":"",Ne?"sm:w-(--n-step-rail) sm:shrink-0":"",J?Ne?"border-b pb-4 sm:border-b-0 sm:border-e sm:pb-0 sm:pe-5":"border-b pb-4":"",J?"[border-color:var(--n-line)]":""),children:Le}),t("div",{className:x("flex min-w-0 flex-1 flex-col",ve?"min-h-0":"",N[U]),children:[Ie,G?e("div",{className:"flex shrink-0 flex-wrap items-center justify-end gap-2",children:ge?e(a,{size:U,variant:"outline",color:V,startIcon:e(s,{}),onClick:()=>ke(0),children:le??se.restart}):t(n,{children:[e(a,{size:U,variant:"outline",color:V,disabled:je,startIcon:e("span",{className:"rotate-90 rtl:-rotate-90",children:e(o,{})}),onClick:()=>ke(he-1),children:ee??se.previous}),e(a,Ce&&O?{size:U,variant:"solid",color:V,startIcon:e(i,{}),onClick:()=>ke(he,!0),children:ne??se.done}:{size:U,variant:"solid",color:V,disabled:Ce,endIcon:e("span",{className:"-rotate-90 rtl:rotate-90",children:e(o,{})}),onClick:()=>ke(he+1),children:te??se.next})]})}):null]})]})]})});
1
+ "use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as l from"react";import{Button as a}from"../button/Button.js";import{boxPaddingClasses as r}from"../box/Box.js";import{CheckIcon as i,ChevronIcon as o,RestartIcon as s,SuccessIcon as c}from"../../internal/icons.js";import{fill as m,stepsMessages as d,useMessages as p}from"../../internal/i18n.js";import{transitionProps as f}from"../../internal/animate.js";import{cx as x,hasContent as u,iconClasses as b,metaTextClasses as h,radiusClasses as v,sheetBodyClasses as g,sheetSectionGapClasses as N,sheetTitleClasses as w,srOnlyClasses as y,surfaceClasses as k,surfaceSlots as j,toLength as C,transitionClasses as z}from"../../internal/styles.js";import{useStyleDefaults as S}from"../../internal/defaults.js";const L={xs:{box:"1.25rem",text:"text-[0.625rem]"},sm:{box:"1.5rem",text:"text-[0.6875rem]"},md:{box:"1.75rem",text:"text-[0.75rem]"},lg:{box:"2rem",text:"text-[0.8125rem]"},xl:{box:"2.25rem",text:"text-[0.875rem]"}},I={default:{xs:"gap-0.5",sm:"gap-1",md:"gap-1",lg:"gap-1.5",xl:"gap-2"},compact:{xs:"gap-0",sm:"gap-0",md:"gap-0.5",lg:"gap-0.5",xl:"gap-1"}},M={solid:[k,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[k,"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"};function R(e){return"string"==typeof e?e:""}function B({level:e,...t}){return l.createElement(`h${Math.min(6,Math.max(1,e))}`,t)}export const HowToSteps=/*@__PURE__*/l.forwardRef(function(k,_){const{steps:H,title:T,headingLevel:$=3,step:E,defaultStep:A=0,onStepChange:F,completed:W,defaultCompleted:q=!1,onCompletedChange:D,orientation:G="vertical",maxHeight:J,railWidth:K="15rem",navigation:O=!0,divider:P=!0,transition:Q="fade",completion:U=!0,completedContent:V,variant:X="outline",size:Y="md",color:Z="primary",density:ee="default",elevation:te=0,locale:ne,previousLabel:le,nextLabel:ae,doneLabel:re,restartLabel:ie,className:oe,style:se,...ce}=S(k,["size","density","variant","locale"]),me=p(d,ne),de=l.useId(),[pe,fe]=l.useState(A),[xe,ue]=l.useState(q),be=void 0!==E,he=void 0!==W,ve=H.length,ge=Math.min(Math.max(be?E:pe,0),Math.max(ve-1,0)),Ne=U&&(he?W:xe),we=void 0!==J,ye="vertical"===G,ke=l.useRef(null),je=l.useRef(null);if(l.useEffect(()=>{const e=ke.current,t=je.current;if(!e||!t)return;const n=e.getBoundingClientRect(),l=t.getBoundingClientRect();ye?l.top<n.top?e.scrollTop-=n.top-l.top:l.bottom>n.bottom&&(e.scrollTop+=l.bottom-n.bottom):l.left<n.left?e.scrollLeft-=n.left-l.left:l.right>n.right&&(e.scrollLeft+=l.right-n.right)},[ge,ye]),0===ve)return null;const Ce=(e,t=!1)=>{he||ue(t),Ne!==t&&D?.(t),t||(be||fe(e),e!==ge&&F?.(e))},ze=0===ge,Se=ge===ve-1,Le="none"===Q?null:f(Q),Ie=t=>{const n=Ne||t<ge,l=!Ne&&t===ge;return e("span",{"aria-hidden":"true",className:x("z-1 flex shrink-0 items-center justify-center rounded-full border font-medium","size-(--n-step-mark) [&_svg]:size-[1.15em]",L[Y].text,z,n?"bg-(--n-fill) text-(--n-on-solid) [border-color:transparent]":l?"bg-(--neba-surface) text-(--n-accent) [border-color:var(--n-accent)]":"bg-(--neba-surface) text-(--neba-muted-fg) [border-color:var(--n-line)]"),children:n?e(i,{}):t+1})},Me=e("ol",{ref:ke,"aria-label":me.steps,className:x("m-0 flex list-none p-0",ye?"flex-col":"flex-row",I[ee][Y],we&&ye?"min-h-0 overflow-y-auto overscroll-contain":"",ye?"":"overflow-x-auto overscroll-contain"),children:H.map((n,l)=>{const a=Ne||l<ge,r=!Ne&&l===ge;return t("li",{ref:r?je:void 0,className:x("relative",ye?"":"min-w-0 flex-1"),children:[l<ve-1?e("span",{"aria-hidden":"true",className:x("absolute",z,a?"bg-(--n-fill)":"bg-(--n-line)",ye?["w-px","[inset-inline-start:calc(0.25rem+var(--n-step-mark)/2)]","[top:calc(0.25rem+var(--n-step-mark))]","[height:calc(100%-var(--n-step-mark))]"].join(" "):["h-px","[inset-inline-start:calc(50%+var(--n-step-mark)/2)]","[top:calc(0.25rem+var(--n-step-mark)/2)]","[width:calc(100%-var(--n-step-mark))]"].join(" "))}):null,t("button",{type:"button",onClick:()=>Ce(l),"aria-current":r?"step":void 0,className:x("flex w-full cursor-pointer items-center p-1 text-start",ye?"gap-3":"flex-col gap-1.5 text-center",v.sm,"hover:bg-(--n-soft)",z,"focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1"),children:[Ie(l),e("span",{className:x("min-w-0",ye?"truncate":"",h[Y],r?"font-medium text-(--neba-fg)":"text-(--neba-muted-fg)"),children:n.title}),e("span",{className:y,children:m(me.step,{index:String(l+1),title:R(n.title)})})]})]},l)})}),Re=t("div",{className:x("grid flex-1 grid-cols-1",we?"min-h-0":""),children:[H.map((n,l)=>{const a=Ne||l!==ge;return t("div",{"aria-hidden":a,inert:a||void 0,className:x("col-start-1 row-start-1 min-w-0",we?"overflow-y-auto overscroll-contain":"",a?"invisible":Le?.className??""),style:a?void 0:Le?.style,children:[t("div",{className:"mb-3 flex items-baseline gap-3",children:[u(n.icon)?e("span",{"aria-hidden":"true",className:x("flex h-[1lh] shrink-0 items-center text-(--n-accent)",w[Y],b),children:n.icon}):null,e(B,{level:$+1,className:x("m-0 min-w-0 flex-1 font-medium",w[Y]),children:n.title}),e("span",{className:x("shrink-0 text-(--neba-muted-fg) tabular-nums",h[Y]),children:m(me.position,{index:String(l+1),total:String(ve)})})]}),n.image?e("img",{src:n.image,alt:n.imageAlt??R(n.title),loading:"lazy",decoding:"async",className:x("mb-3 max-h-72 w-full object-contain",v[Y])}):null,u(n.content)?e("div",{className:x("min-w-0",g[Y]),children:n.content}):null]},l)}),U?t("div",{"aria-hidden":!Ne,inert:!Ne||void 0,className:x("col-start-1 row-start-1 flex min-w-0 flex-col items-center justify-center gap-2 py-4 text-center",Ne?Le?.className??"":"invisible"),style:Ne?Le?.style:void 0,children:[e("span",{"aria-hidden":"true",className:"text-(--n-accent) [&_svg]:size-9",children:e(c,{})}),e("p",{className:x("m-0 font-medium",g[Y]),children:V??me.completed})]}):null]});return t("div",{ref:_,"aria-labelledby":u(T)?de:void 0,className:x("flex min-w-0 flex-col",v[Y],r[ee][Y],N[Y],M[X],z,oe),style:{...j(Z,te),"--n-fill":`var(--neba-${Z}-fill)`,"--n-on-solid":`var(--neba-${Z}-on-solid)`,"--n-step-mark":L[Y].box,"--n-step-rail":C(K),...we?{maxHeight:C(J)}:null,...se},...ce,children:[u(T)?e(B,{level:$,id:de,className:x("m-0 shrink-0 font-medium",w[Y]),children:T}):null,t("div",{className:x("flex min-w-0 flex-1 flex-col",we?"min-h-0":"",ye?"gap-4 sm:flex-row sm:gap-5":"gap-4"),children:[e("div",{className:x("flex min-w-0 flex-col",we?"min-h-0":"",ye?"sm:w-(--n-step-rail) sm:shrink-0":"",P?ye?"border-b pb-4 sm:border-b-0 sm:border-e sm:pb-0 sm:pe-5":"border-b pb-4":"",P?"[border-color:var(--n-line)]":""),children:Me}),t("div",{className:x("flex min-w-0 flex-1 flex-col",we?"min-h-0":"",N[Y]),children:[Re,O?e("div",{className:"flex shrink-0 flex-wrap items-center justify-end gap-2",children:Ne?e(a,{size:Y,variant:"outline",color:Z,startIcon:e(s,{}),onClick:()=>Ce(0),children:ie??me.restart}):t(n,{children:[e(a,{size:Y,variant:"outline",color:Z,disabled:ze,startIcon:e("span",{className:"rotate-90 rtl:-rotate-90",children:e(o,{})}),onClick:()=>Ce(ge-1),children:le??me.previous}),e(a,Se&&U?{size:Y,variant:"solid",color:Z,startIcon:e(i,{}),onClick:()=>Ce(ge,!0),children:re??me.done}:{size:Y,variant:"solid",color:Z,disabled:Se,endIcon:e("span",{className:"-rotate-90 rtl:rotate-90",children:e(o,{})}),onClick:()=>Ce(ge+1),children:ae??me.next})]})}):null]})]})]})});
@@ -0,0 +1,70 @@
1
+ import * as React from 'react';
2
+ import type { NebaAspectFit } from '../aspect-ratio/AspectRatio.js';
3
+ import type { NebaSize, NebaSlots } from '../../types.js';
4
+ /** The parts an Image draws behind its root. */
5
+ export type ImageSlot = 'image' | 'placeholder' | 'fallback';
6
+ /** Where the picture is in its own life. */
7
+ type Phase = 'loading' | 'loaded' | 'failed';
8
+ export interface ImageProps extends Omit<React.ComponentPropsWithoutRef<'img'>, 'width' | 'height' | 'children'> {
9
+ /** Required, and required to be right. See the note on the component. */
10
+ alt: string;
11
+ /**
12
+ * The proportion to hold while the file is still arriving.
13
+ *
14
+ * This is the whole reason to use this over an `<img>`: a picture with no
15
+ * reserved box is a picture that pushes the page down when it lands, which is
16
+ * the single largest source of layout shift on most sites. `'auto'` opts out
17
+ * and lets the file decide, which is right only when the space around it can
18
+ * absorb the jump.
19
+ * @default 'auto'
20
+ */
21
+ ratio?: number | string | 'auto';
22
+ /** How the picture fills that box. @default 'cover' */
23
+ fit?: NebaAspectFit;
24
+ /** Rounds the corners at this step of the radius ladder. `false` for square. */
25
+ rounded?: NebaSize | boolean;
26
+ /**
27
+ * What stands in while the file is arriving. A Skeleton of the right shape by
28
+ * default, `false` for nothing at all.
29
+ */
30
+ placeholder?: React.ReactNode | false;
31
+ /**
32
+ * What is drawn instead when the file does not arrive.
33
+ *
34
+ * Something rather than nothing by default: a broken image icon is the
35
+ * browser telling the reader that the *page* is broken, and a box that says
36
+ * what was meant to be there is a better answer than a blank space.
37
+ */
38
+ fallback?: React.ReactNode;
39
+ /** Called when the file fails. Useful for swapping a `src` you control. */
40
+ onLoadingStatusChange?: (status: Phase) => void;
41
+ /**
42
+ * Opens the full picture in a Dialog when it is clicked.
43
+ *
44
+ * The picture becomes a button when this is on, so it is reachable by
45
+ * keyboard — an image you can only enlarge with a pointer is an image half
46
+ * the readers cannot enlarge.
47
+ * @default false
48
+ */
49
+ preview?: boolean;
50
+ /** Class names for the parts behind the root. */
51
+ classNames?: NebaSlots<ImageSlot>;
52
+ }
53
+ /**
54
+ * A picture that holds its space, says when it is loading and says when it
55
+ * failed.
56
+ *
57
+ * An `<img>` does none of those three, and each is a real defect rather than a
58
+ * nicety: an unsized picture shoves the page down when it lands, a slow one
59
+ * leaves a hole with no explanation, and a broken one draws the browser's own
60
+ * torn-page glyph, which tells a reader the site is broken rather than that one
61
+ * file is missing.
62
+ *
63
+ * `alt` is required by the type, which is deliberate and is the one place this
64
+ * component is stricter than the tag it wraps. A missing `alt` and an empty one
65
+ * mean different things — "nobody wrote this" and "this picture says nothing a
66
+ * reader needs" — and only the second is ever correct. Being made to type
67
+ * `alt=""` is being made to say which one you meant.
68
+ */
69
+ export declare const Image: React.ForwardRefExoticComponent<ImageProps & React.RefAttributes<HTMLImageElement>>;
70
+ export {};
@@ -0,0 +1 @@
1
+ "use client";import{jsx as e,jsxs as a,Fragment as l}from"react/jsx-runtime";import*as o from"react";import{AspectRatio as t}from"../aspect-ratio/AspectRatio.js";import{Dialog as s}from"../dialog/Dialog.js";import{Skeleton as n}from"../skeleton/Skeleton.js";import{cx as i,radiusClasses as c,transitionClasses as r}from"../../internal/styles.js";const m={cover:"object-cover",contain:"object-contain",fill:"object-fill",none:"object-none"};export const Image=/*@__PURE__*/o.forwardRef(function({alt:d,ratio:f="auto",fit:u="cover",rounded:p=!1,placeholder:b,fallback:g,onLoadingStatusChange:h,preview:x=!1,className:v,classNames:j,style:N,src:k,...y},w){const[z,S]=o.useState("loading"),[C,E]=o.useState(!1);o.useEffect(()=>{S("loading")},[k]);const I=e=>{S(e),h?.(e)},L=!1===p?"":c[!0===p?"md":p],R=e("img",{ref:w,src:k,alt:d,className:i("block size-full",m[u],L,r,"loaded"===z?"opacity-100":"opacity-0",j?.image),onLoad:()=>I("loaded"),onError:()=>I("failed"),...y}),_="failed"===z?e("span",{className:i("absolute inset-0 flex items-center justify-center","bg-(--neba-disabled-bg) text-(--neba-muted-fg)",L,j?.fallback),children:g??e("span",{className:"px-2 text-center text-sm",children:d||"Image unavailable"})}):"loading"===z&&!1!==b?e("span",{className:i("absolute inset-0",j?.placeholder),children:b??e(n,{shape:"rect",className:i("size-full",L)})}):null,A=a("span",{className:"relative block size-full",children:[R,_]}),D="auto"===f?e("span",{className:i("relative block overflow-hidden",L,v),style:N,children:A}):e(t,{ratio:f,className:i("overflow-hidden",L,v),style:N,children:A});return x?a(l,{children:[e("button",{type:"button","aria-label":d,className:i("block w-full cursor-zoom-in [outline:none]","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:2px]",L),onClick:()=>E(!0),children:D}),e(s,{open:C,onOpenChange:E,size:"xl",title:d,children:e("img",{src:k,alt:d,className:"mx-auto block max-h-[70vh] w-auto max-w-full"})})]}):D});
@@ -0,0 +1,2 @@
1
+ export { Image } from './Image.js';
2
+ export type { ImageProps, ImageSlot } from './Image.js';
@@ -0,0 +1 @@
1
+ export{Image}from"./Image.js";
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as r,Fragment as s}from"react/jsx-runtime";import*as n from"react";import{useRender as t}from"@base-ui/react/use-render";import{boxPaddingXClasses as l}from"../box/Box.js";import{cx as a,focusRingClasses as i,gapClasses as o,hasContent as d,iconClasses as c,metaTextClasses as m,radiusClasses as f,sheetBodyClasses as x,surfaceClasses as p,surfaceSlots as u,transitionClasses as h}from"../../internal/styles.js";const b=/*@__PURE__*/n.createContext({size:"md",density:"default",dividers:!1}),v={solid:[p,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[p,"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"},g={default:{xs:"py-1",sm:"py-1.5",md:"py-2",lg:"py-2.5",xl:"py-3"},compact:{xs:"py-0.5",sm:"py-0.5",md:"py-1",lg:"py-1.5",xl:"py-2"}},y={xs:f.xs,sm:f.xs,md:f.sm,lg:f.sm,xl:f.md};export const List=/*@__PURE__*/n.forwardRef(function({variant:r="outline",size:s="md",color:l="primary",density:i="default",elevation:o=0,dividers:d=!1,render:c,className:m,style:x,children:p,...g},y){const N=n.useMemo(()=>({size:s,density:i,dividers:d}),[s,i,d]),w=a("flex flex-col",f[s],v[r],h,d?"overflow-hidden [&>li+li]:border-t [&>li+li]:[border-color:var(--n-line)]":"p-1",m??""),j=t({render:c,ref:y,props:{role:"list",className:w,style:{...u(l,o),...x},children:p,...g}});return e(b.Provider,{value:N,children:j})});export const ListItem=/*@__PURE__*/n.forwardRef(function({startIcon:t,endIcon:f,description:p,action:u,href:v,selected:N=!1,disabled:w=!1,className:j,children:k,onClick:C,...z},I){const{size:$,density:B,dividers:L}=n.useContext(b),R=Boolean(C||v)&&!w,F=l[B][$],M=g[B][$],P=a("flex min-w-0 flex-1 items-center text-start",F,M,o[$],x[$],h,c,L?"":y[$],w?"cursor-not-allowed text-(--neba-disabled-fg)":N?"bg-(--n-soft-press) font-medium text-(--n-accent)":"",R?`cursor-pointer ${i}`:"",R&&!N?"hover:bg-(--n-soft)":"",R&&N?"hover:bg-(--n-soft-press)":""),q=r(s,{children:[d(t)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:t}):null,r("span",{className:"flex min-w-0 flex-1 flex-col",children:[d(k)?e("span",{className:"truncate",children:k}):null,d(p)?e("span",{className:`truncate text-(--neba-muted-fg) ${m[$]}`,children:p}):null]}),d(f)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:f}):null]});return r("li",{ref:I,className:a("flex w-full items-center",j??""),...z,children:[R&&v?e("a",{href:v,className:P,"aria-current":N?"page":void 0,onClick:C,children:q}):R?e("button",{type:"button",className:P,"aria-current":!!N||void 0,onClick:C,children:q}):e("div",{className:P,"aria-disabled":w||void 0,children:q}),d(u)?e("div",{className:`flex shrink-0 items-center ${F}`,children:u}):null]})});
1
+ "use client";import{jsx as e,jsxs as r,Fragment as s}from"react/jsx-runtime";import*as n from"react";import{useRender as t}from"@base-ui/react/use-render";import{boxPaddingXClasses as l}from"../box/Box.js";import{cx as a,focusRingClasses as i,gapClasses as o,hasContent as d,iconClasses as c,metaTextClasses as m,radiusClasses as f,sheetBodyClasses as x,surfaceClasses as p,surfaceSlots as u,transitionClasses as h}from"../../internal/styles.js";import{useStyleDefaults as b}from"../../internal/defaults.js";const v=/*@__PURE__*/n.createContext({size:"md",density:"default",dividers:!1}),y={solid:[p,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[p,"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"},g={default:{xs:"py-1",sm:"py-1.5",md:"py-2",lg:"py-2.5",xl:"py-3"},compact:{xs:"py-0.5",sm:"py-0.5",md:"py-1",lg:"py-1.5",xl:"py-2"}},N={xs:f.xs,sm:f.xs,md:f.sm,lg:f.sm,xl:f.md};export const List=/*@__PURE__*/n.forwardRef(function(r,s){const{variant:l="outline",size:i="md",color:o="primary",density:d="default",elevation:c=0,dividers:m=!1,render:x,className:p,style:g,children:N,...w}=b(r,["size","density","variant"]),j=n.useMemo(()=>({size:i,density:d,dividers:m}),[i,d,m]),k=a("flex flex-col",f[i],y[l],h,m?"overflow-hidden [&>li+li]:border-t [&>li+li]:[border-color:var(--n-line)]":"p-1",p??""),z=t({render:x,ref:s,props:{role:"list",className:k,style:{...u(o,c),...g},children:N,...w}});return e(v.Provider,{value:j,children:z})});export const ListItem=/*@__PURE__*/n.forwardRef(function({startIcon:t,endIcon:f,description:p,action:u,href:b,selected:y=!1,disabled:w=!1,className:j,children:k,onClick:z,...C},I){const{size:$,density:B,dividers:L}=n.useContext(v),R=Boolean(z||b)&&!w,F=l[B][$],M=g[B][$],P=a("flex min-w-0 flex-1 items-center text-start",F,M,o[$],x[$],h,c,L?"":N[$],w?"cursor-not-allowed text-(--neba-disabled-fg)":y?"bg-(--n-soft-press) font-medium text-(--n-accent)":"",R?`cursor-pointer ${i}`:"",R&&!y?"hover:bg-(--n-soft)":"",R&&y?"hover:bg-(--n-soft-press)":""),q=r(s,{children:[d(t)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:t}):null,r("span",{className:"flex min-w-0 flex-1 flex-col",children:[d(k)?e("span",{className:"truncate",children:k}):null,d(p)?e("span",{className:`truncate text-(--neba-muted-fg) ${m[$]}`,children:p}):null]}),d(f)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:f}):null]});return r("li",{ref:I,className:a("flex w-full items-center",j??""),...C,children:[R&&b?e("a",{href:b,className:P,"aria-current":y?"page":void 0,onClick:z,children:q}):R?e("button",{type:"button",className:P,"aria-current":!!y||void 0,onClick:z,children:q}):e("div",{className:P,"aria-disabled":w||void 0,children:q}),d(u)?e("div",{className:`flex shrink-0 items-center ${F}`,children:u}):null]})});
@@ -1 +1 @@
1
- "use client";import{jsxs as e,jsx as n}from"react/jsx-runtime";import*as t from"react";import{Menubar as o}from"@base-ui/react/menubar";import{Menu as r}from"../menu/Menu.js";import{MenuContext as s}from"../../internal/menu.js";import{controlTextClasses as a,cx as i,gapClasses as l,hasContent as c,iconClasses as d,paddingXClasses as u,radiusClasses as f,transitionClasses as m}from"../../internal/styles.js";const p={xs:"h-4.5",sm:"h-5.5",md:"h-6.5",lg:"h-8",xl:"h-10"},b=["inline-flex shrink-0 cursor-pointer select-none items-center justify-center","whitespace-nowrap font-medium leading-none","text-(--neba-fg) bg-transparent","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",m,d,"hover:bg-(--n-soft)","data-[popup-open]:bg-(--n-soft-hover) data-[popup-open]:text-(--n-accent)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]","disabled:cursor-not-allowed disabled:text-(--neba-disabled-fg) disabled:hover:bg-transparent"].join(" ");export function MenubarMenu({label:o,startIcon:i,disabled:d=!1,children:m}){const{size:h,color:x,density:v}=t.useContext(s);return n(r,{size:h,color:x,density:v,disabled:d,openOnHover:!0,sideOffset:4,trigger:e("button",{type:"button",disabled:d,className:[b,p[h],a[h],l[h],u["default"===v?"compact":v][h],f[h]].join(" "),children:[c(i)?i:null,o]}),children:m})}export const Menubar=/*@__PURE__*/t.forwardRef(function({size:e="md",color:r="primary",density:a="default",orientation:c="horizontal",modal:d=!0,loopFocus:u=!0,disabled:f=!1,className:m,style:p,children:b,...h},x){const v=t.useMemo(()=>({size:e,color:r,density:a}),[e,r,a]);return n(s.Provider,{value:v,children:n(o,{ref:x,orientation:c,modal:d,loopFocus:u,disabled:f,className:i("flex items-center","vertical"===c?"flex-col items-stretch":"flex-row",l[e],m??""),style:{"--n-soft":`var(--neba-${r}-soft)`,"--n-soft-hover":`var(--neba-${r}-soft-hover)`,"--n-accent":`var(--neba-${r}-accent)`,"--n-ring":`var(--neba-${r}-ring)`,...p},...h,children:b})})});
1
+ "use client";import{jsxs as e,jsx as t}from"react/jsx-runtime";import*as n from"react";import{Menubar as o}from"@base-ui/react/menubar";import{Menu as r}from"../menu/Menu.js";import{MenuContext as s}from"../../internal/menu.js";import{controlTextClasses as i,cx as a,gapClasses as l,hasContent as c,iconClasses as d,paddingXClasses as u,radiusClasses as f,transitionClasses as m}from"../../internal/styles.js";import{useStyleDefaults as p}from"../../internal/defaults.js";const b={xs:"h-4.5",sm:"h-5.5",md:"h-6.5",lg:"h-8",xl:"h-10"},h=["inline-flex shrink-0 cursor-pointer select-none items-center justify-center","whitespace-nowrap font-medium leading-none","text-(--neba-fg) bg-transparent","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",m,d,"hover:bg-(--n-soft)","data-[popup-open]:bg-(--n-soft-hover) data-[popup-open]:text-(--n-accent)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]","disabled:cursor-not-allowed disabled:text-(--neba-disabled-fg) disabled:hover:bg-transparent"].join(" ");export function MenubarMenu({label:o,startIcon:a,disabled:d=!1,children:m}){const{size:p,color:x,density:v}=n.useContext(s);return t(r,{size:p,color:x,density:v,disabled:d,openOnHover:!0,sideOffset:4,trigger:e("button",{type:"button",disabled:d,className:[h,b[p],i[p],l[p],u["default"===v?"compact":v][p],f[p]].join(" "),children:[c(a)?a:null,o]}),children:m})}export const Menubar=/*@__PURE__*/n.forwardRef(function(e,r){const{size:i="md",color:c="primary",density:d="default",orientation:u="horizontal",modal:f=!0,loopFocus:m=!0,disabled:b=!1,className:h,style:x,children:v,...g}=p(e,["size","density"]),y=n.useMemo(()=>({size:i,color:c,density:d}),[i,c,d]);return t(s.Provider,{value:y,children:t(o,{ref:r,orientation:u,modal:f,loopFocus:m,disabled:b,className:a("flex items-center","vertical"===u?"flex-col items-stretch":"flex-row",l[i],h??""),style:{"--n-soft":`var(--neba-${c}-soft)`,"--n-soft-hover":`var(--neba-${c}-soft-hover)`,"--n-accent":`var(--neba-${c}-accent)`,"--n-ring":`var(--neba-${c}-ring)`,...x},...g,children:v})})});
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{Meter as l}from"@base-ui/react/meter";import{barThicknessClasses as t,progressFraction as n,progressSlots as s}from"../../internal/progress.js";import{cx as o,metaTextClasses as i,stackGapClasses as m}from"../../internal/styles.js";export const Meter=/*@__PURE__*/a.forwardRef(function({value:a,min:u=0,max:f=100,label:c,showValue:d=!1,format:b,thresholds:h,size:x="md",color:p="primary",className:v,style:g,...j},w){const N=n(a,u,f),y=function(e,r,a){if(!a||0===a.length)return r;let l=r;for(const r of a)e>=r.from&&(l=r.color);return l}(a,p,h),_=void 0!==b;return r(l.Root,{ref:w,value:a,min:u,max:f,format:b,className:o("flex w-full flex-col",m[x],v??""),style:{...s(y),...g},...j,children:[c||d?r("div",{className:["flex items-baseline gap-2",c?"justify-between":"justify-end",i[x]].join(" "),children:[c?e(l.Label,{className:"min-w-0 truncate text-(--neba-fg)",children:c}):null,d?e(l.Value,{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:e=>_?e:`${Math.round(100*(N??0))}%`}):null]}):null,e(l.Track,{className:`relative w-full overflow-hidden rounded-full bg-(--n-soft) ${t[x]}`,children:e(l.Indicator,{className:"absolute top-0 rounded-full bg-(--n-fill) [transition:width_var(--neba-duration-fill)_var(--neba-ease),background-color_var(--neba-duration)_var(--neba-ease)]"})})]})});
1
+ "use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{Meter as l}from"@base-ui/react/meter";import{barThicknessClasses as t,progressFraction as n,progressSlots as s}from"../../internal/progress.js";import{cx as o,metaTextClasses as i,stackGapClasses as m}from"../../internal/styles.js";import{useStyleDefaults as f}from"../../internal/defaults.js";export const Meter=/*@__PURE__*/a.forwardRef(function(a,u){const{value:c,min:d=0,max:b=100,label:h,showValue:p=!1,format:x,thresholds:v,size:j="md",color:g="primary",className:w,style:N,...y}=f(a,["size"]),_=n(c,d,b),k=function(e,r,a){if(!a||0===a.length)return r;let l=r;for(const r of a)e>=r.from&&(l=r.color);return l}(c,g,v),M=void 0!==x;return r(l.Root,{ref:u,value:c,min:d,max:b,format:x,className:o("flex w-full flex-col",m[j],w??""),style:{...s(k),...N},...y,children:[h||p?r("div",{className:["flex items-baseline gap-2",h?"justify-between":"justify-end",i[j]].join(" "),children:[h?e(l.Label,{className:"min-w-0 truncate text-(--neba-fg)",children:h}):null,p?e(l.Value,{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:e=>M?e:`${Math.round(100*(_??0))}%`}):null]}):null,e(l.Track,{className:`relative w-full overflow-hidden rounded-full bg-(--n-soft) ${t[j]}`,children:e(l.Indicator,{className:"absolute top-0 rounded-full bg-(--n-fill) [transition:width_var(--neba-duration-fill)_var(--neba-ease),background-color_var(--neba-duration)_var(--neba-ease)]"})})]})});
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import*as r from"react";import{useRender as a}from"@base-ui/react/use-render";import{transitionProps as n}from"../../internal/animate.js";import{MockupCutout as o,defaultNotch as s,elevationFilters as h,finishSlots as d,mockupChrome as l,mockupMetrics as c,resolveOs as u,shellClasses as m}from"../../internal/mockup.js";import{observeResize as p}from"../../internal/observe.js";import{cx as f,surfaceSlots as g}from"../../internal/styles.js";const b="undefined"==typeof document?r.useEffect:r.useLayoutEffect;export const Mockup=/*@__PURE__*/r.forwardRef(function({device:v,os:w,hardware:y="monitor",size:x="md",resolution:k,orientation:N="portrait",bezel:R="standard",finish:$="graphite",notch:z,systemUi:M=!0,scroll:j=!1,wallpaper:W,time:H="9:41",width:B,height:C,color:E="primary",elevation:L=0,transition:P,render:S,className:F,style:I,children:T,...U},q){const A=u(v,w),D=z??s(v,A),G="desktop"!==v&&"landscape"===N,J=c({device:v,size:x,resolution:k,orientation:N,bezel:R,hardware:y}),{screen:K,frame:O,body:Q,stand:V,base:X}=J,Y=r.useRef(null),[Z,_]=r.useState(null);b(()=>{const e=Y.current;if(!e)return;const t=()=>{const t=e.getBoundingClientRect();if(t.width<=0||t.height<=0)return;const i=Math.min(t.width/O.width,t.height/O.height);_(e=>null!==e&&Math.abs(e-i)<1e-4?e:i)};return t(),p(e,t)},[O.width,O.height]);const ee=r.useCallback(e=>{Y.current=e,"function"==typeof q?q(e):q&&(q.current=e)},[q]),te=M?l({os:A,notch:D,landscape:G,time:H}):{},ie=n(P),re="none"===R,ae=t("div",{className:"neba-mockup-screen relative flex flex-col overflow-hidden",style:{width:K.width,height:K.height,borderRadius:J.screenRadius,background:W??"var(--neba-surface)",boxShadow:re?void 0:"inset 0 0 0 1px var(--n-shell-shade)"},children:[te.top?.node,t("div",{className:"flex min-h-0 flex-1",children:[te.start?.node,e("div",{className:"min-w-0 flex-1 "+(j?"overflow-auto":"overflow-hidden"),style:{containerType:"size",containerName:"neba-screen"},children:T})]}),te.bottom?.node,e(o,{notch:D,screen:K,landscape:G})]}),ne=f("neba-mockup relative block",ie.className,F??"");return a({render:S,ref:ee,props:{className:ne,style:{...g(E,L),...d[$],...ie.style,width:B??(void 0===C?"100%":"auto"),height:C??"auto",aspectRatio:`${O.width} / ${O.height}`,filter:h[L],...I},children:t("div",{className:"absolute top-1/2 left-1/2 flex flex-col items-center",style:{width:O.width,height:O.height,transform:`translate(-50%, -50%) scale(${Z??1})`,visibility:null===Z?"hidden":void 0},children:[e("div",{className:re?"":m,style:{width:Q.width,height:Q.height,borderRadius:J.frameRadius,paddingBlock:`${J.bezel.top}px ${J.bezel.bottom}px`,paddingInline:J.bezel.x},children:ae}),V?t(i,{children:[e("div",{"aria-hidden":"true",style:{width:V.neckWidth,height:V.neckHeight,background:"var(--n-shell-shade)",clipPath:"polygon(16% 0, 84% 0, 100% 100%, 0 100%)"}}),e("div",{"aria-hidden":"true",className:m,style:{width:V.footWidth,height:V.footHeight,borderRadius:V.footHeight/2}})]}):null,X?e("div",{"aria-hidden":"true",className:`relative ${m}`,style:{width:X.width,height:X.height,borderRadius:`0 0 ${Math.round(.55*X.height)}px ${Math.round(.55*X.height)}px`,clipPath:"polygon(0 0, 100% 0, 98.5% 100%, 1.5% 100%)"},children:e("div",{className:"absolute top-0 left-1/2",style:{width:X.lipWidth,height:Math.round(.34*X.height),marginLeft:-X.lipWidth/2,borderRadius:`0 0 ${Math.round(.2*X.height)}px ${Math.round(.2*X.height)}px`,background:"var(--n-shell-shade)"}})}):null]}),...U}})});
1
+ "use client";import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import*as r from"react";import{useRender as a}from"@base-ui/react/use-render";import{transitionProps as n}from"../../internal/animate.js";import{MockupCutout as o,defaultNotch as s,elevationFilters as h,finishSlots as d,mockupChrome as l,mockupMetrics as c,resolveOs as u,shellClasses as m}from"../../internal/mockup.js";import{observeResize as p}from"../../internal/observe.js";import{cx as f,surfaceSlots as g}from"../../internal/styles.js";import{useStyleDefaults as b}from"../../internal/defaults.js";const v="undefined"==typeof document?r.useEffect:r.useLayoutEffect;export const Mockup=/*@__PURE__*/r.forwardRef(function(w,y){const{device:x,os:k,hardware:N="monitor",size:R="md",resolution:$,orientation:z="portrait",bezel:j="standard",finish:M="graphite",notch:W,systemUi:H=!0,scroll:B=!1,wallpaper:C,time:E="9:41",width:L,height:P,color:S="primary",elevation:F=0,transition:I,render:T,className:U,style:q,children:A,...D}=b(w,["size"]),G=u(x,k),J=W??s(x,G),K="desktop"!==x&&"landscape"===z,O=c({device:x,size:R,resolution:$,orientation:z,bezel:j,hardware:N}),{screen:Q,frame:V,body:X,stand:Y,base:Z}=O,_=r.useRef(null),[ee,te]=r.useState(null);v(()=>{const e=_.current;if(!e)return;const t=()=>{const t=e.getBoundingClientRect();if(t.width<=0||t.height<=0)return;const i=Math.min(t.width/V.width,t.height/V.height);te(e=>null!==e&&Math.abs(e-i)<1e-4?e:i)};return t(),p(e,t)},[V.width,V.height]);const ie=r.useCallback(e=>{_.current=e,"function"==typeof y?y(e):y&&(y.current=e)},[y]),re=H?l({os:G,notch:J,landscape:K,time:E}):{},ae=n(I),ne="none"===j,oe=t("div",{className:"neba-mockup-screen relative flex flex-col overflow-hidden",style:{width:Q.width,height:Q.height,borderRadius:O.screenRadius,background:C??"var(--neba-surface)",boxShadow:ne?void 0:"inset 0 0 0 1px var(--n-shell-shade)"},children:[re.top?.node,t("div",{className:"flex min-h-0 flex-1",children:[re.start?.node,e("div",{className:"min-w-0 flex-1 "+(B?"overflow-auto":"overflow-hidden"),style:{containerType:"size",containerName:"neba-screen"},children:A})]}),re.bottom?.node,e(o,{notch:J,screen:Q,landscape:K})]}),se=f("neba-mockup relative block",ae.className,U??"");return a({render:T,ref:ie,props:{className:se,style:{...g(S,F),...d[M],...ae.style,width:L??(void 0===P?"100%":"auto"),height:P??"auto",aspectRatio:`${V.width} / ${V.height}`,filter:h[F],...q},children:t("div",{className:"absolute top-1/2 left-1/2 flex flex-col items-center",style:{width:V.width,height:V.height,transform:`translate(-50%, -50%) scale(${ee??1})`,visibility:null===ee?"hidden":void 0},children:[e("div",{className:ne?"":m,style:{width:X.width,height:X.height,borderRadius:O.frameRadius,paddingBlock:`${O.bezel.top}px ${O.bezel.bottom}px`,paddingInline:O.bezel.x},children:oe}),Y?t(i,{children:[e("div",{"aria-hidden":"true",style:{width:Y.neckWidth,height:Y.neckHeight,background:"var(--n-shell-shade)",clipPath:"polygon(16% 0, 84% 0, 100% 100%, 0 100%)"}}),e("div",{"aria-hidden":"true",className:m,style:{width:Y.footWidth,height:Y.footHeight,borderRadius:Y.footHeight/2}})]}):null,Z?e("div",{"aria-hidden":"true",className:`relative ${m}`,style:{width:Z.width,height:Z.height,borderRadius:`0 0 ${Math.round(.55*Z.height)}px ${Math.round(.55*Z.height)}px`,clipPath:"polygon(0 0, 100% 0, 98.5% 100%, 1.5% 100%)"},children:e("div",{className:"absolute top-0 left-1/2",style:{width:Z.lipWidth,height:Math.round(.34*Z.height),marginLeft:-Z.lipWidth/2,borderRadius:`0 0 ${Math.round(.2*Z.height)}px ${Math.round(.2*Z.height)}px`,background:"var(--n-shell-shade)"}})}):null]}),...D}})});
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import type { NebaElevation, NebaStyleProps } from '../../types.js';
2
+ import type { NebaElevation, NebaFieldSlot, NebaShortcuts, NebaSlots, NebaStyleProps } from '../../types.js';
3
3
  /**
4
4
  * Where the two steppers sit.
5
5
  *
@@ -14,6 +14,15 @@ import type { NebaElevation, NebaStyleProps } from '../../types.js';
14
14
  * nobody hits.
15
15
  */
16
16
  export type NumberFieldSteppers = 'end' | 'split' | 'none';
17
+ /**
18
+ * The parts a NumberField draws behind its root.
19
+ *
20
+ * `shell` is the framed box, `control` the `<input>` inside it, and `stepper`
21
+ * both of the two buttons — they are one slot rather than an `increment` and a
22
+ * `decrement`, because a pair of steppers that do not match is not a thing
23
+ * anyone is trying to build.
24
+ */
25
+ export type NumberFieldSlot = NebaFieldSlot | 'shell' | 'stepper';
17
26
  export interface NumberFieldProps extends NebaStyleProps, Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'defaultValue' | 'children'> {
18
27
  /**
19
28
  * Drop shadow depth. `0` (the default) is flat — a field is a well, not a
@@ -99,6 +108,22 @@ export interface NumberFieldProps extends NebaStyleProps, Omit<React.ComponentPr
99
108
  /** Placeholder shown while the field is empty. */
100
109
  placeholder?: string;
101
110
  id?: string;
111
+ /**
112
+ * Class names for the parts behind the root. `className` is the root — the
113
+ * column holding the label, the shell and the two lines under it — so the
114
+ * `<input>` itself is `classNames.control`.
115
+ */
116
+ classNames?: NebaSlots<NumberFieldSlot>;
117
+ /**
118
+ * Key combinations to act on, spelled the way
119
+ * [Shortcut](../display/shortcut) draws them — `{ Enter: commit }`.
120
+ *
121
+ * Bound to the `<input>` rather than to the root, which is the difference
122
+ * that makes it worth having here: a plain `onKeyDown` lands on the column
123
+ * the label and the messages are in, so `event.currentTarget` is not the
124
+ * field and the arrow keys the steppers use never reach it as themselves.
125
+ */
126
+ shortcuts?: NebaShortcuts<HTMLInputElement>;
102
127
  }
103
128
  /**
104
129
  * A field that only holds a number.
@@ -114,4 +139,4 @@ export interface NumberFieldProps extends NebaStyleProps, Omit<React.ComponentPr
114
139
  * clamping, the press-and-hold repeat on the steppers, and the hidden input
115
140
  * that submits with a form.
116
141
  */
117
- export declare function NumberField({ variant, size, color, density, elevation, value, defaultValue, onValueChange, onValueCommitted, min, max, step, largeStep, smallStep, snapOnStep, allowWheelScrub, format, locale, steppers, incrementLabel, decrementLabel, label, description, error, invalid, startIcon, endIcon, fullWidth, disabled, readOnly, required, name, placeholder, id, className, style, ...props }: NumberFieldProps): React.JSX.Element;
142
+ export declare function NumberField(rawProps: NumberFieldProps): React.JSX.Element;