neba 1.11.0 → 1.13.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 (218) hide show
  1. package/LICENSE +1 -1
  2. package/README.md +43 -41
  3. package/dist/components/accordion/Accordion.d.ts +18 -0
  4. package/dist/components/accordion/Accordion.js +1 -1
  5. package/dist/components/anchor/Anchor.js +1 -1
  6. package/dist/components/animate-appear/AnimateAppear.d.ts +2 -13
  7. package/dist/components/animate-appear/AnimateAppear.js +1 -1
  8. package/dist/components/animate-blink/AnimateBlink.d.ts +2 -2
  9. package/dist/components/animate-blink/AnimateBlink.js +1 -1
  10. package/dist/components/animate-counter/AnimateCounter.d.ts +45 -0
  11. package/dist/components/animate-counter/AnimateCounter.js +1 -0
  12. package/dist/components/animate-counter/index.d.ts +1 -0
  13. package/dist/components/animate-counter/index.js +1 -0
  14. package/dist/components/animate-fade/AnimateFade.d.ts +2 -2
  15. package/dist/components/animate-fade/AnimateFade.js +1 -1
  16. package/dist/components/animate-float/AnimateFloat.d.ts +35 -0
  17. package/dist/components/animate-float/AnimateFloat.js +1 -0
  18. package/dist/components/animate-float/index.d.ts +1 -0
  19. package/dist/components/animate-float/index.js +1 -0
  20. package/dist/components/animate-grow/AnimateGrow.d.ts +2 -2
  21. package/dist/components/animate-grow/AnimateGrow.js +1 -1
  22. package/dist/components/animate-marquee/AnimateMarquee.d.ts +5 -3
  23. package/dist/components/animate-marquee/AnimateMarquee.js +1 -1
  24. package/dist/components/animate-reveal/AnimateReveal.d.ts +41 -0
  25. package/dist/components/animate-reveal/AnimateReveal.js +1 -0
  26. package/dist/components/animate-reveal/index.d.ts +1 -0
  27. package/dist/components/animate-reveal/index.js +1 -0
  28. package/dist/components/animate-rotate/AnimateRotate.d.ts +2 -2
  29. package/dist/components/animate-rotate/AnimateRotate.js +1 -1
  30. package/dist/components/animate-scramble/AnimateScramble.d.ts +48 -0
  31. package/dist/components/animate-scramble/AnimateScramble.js +1 -0
  32. package/dist/components/animate-scramble/index.d.ts +1 -0
  33. package/dist/components/animate-scramble/index.js +1 -0
  34. package/dist/components/animate-shake/AnimateShake.d.ts +39 -0
  35. package/dist/components/animate-shake/AnimateShake.js +1 -0
  36. package/dist/components/animate-shake/index.d.ts +1 -0
  37. package/dist/components/animate-shake/index.js +1 -0
  38. package/dist/components/animate-slide/AnimateSlide.d.ts +2 -2
  39. package/dist/components/animate-slide/AnimateSlide.js +1 -1
  40. package/dist/components/animate-split/AnimateSplit.d.ts +61 -0
  41. package/dist/components/animate-split/AnimateSplit.js +1 -0
  42. package/dist/components/animate-split/index.d.ts +1 -0
  43. package/dist/components/animate-split/index.js +1 -0
  44. package/dist/components/animate-typing/AnimateTyping.js +1 -1
  45. package/dist/components/animate-zoom/AnimateZoom.d.ts +2 -2
  46. package/dist/components/animate-zoom/AnimateZoom.js +1 -1
  47. package/dist/components/app-logo/AppLogo.js +1 -1
  48. package/dist/components/avatar/Avatar.js +1 -1
  49. package/dist/components/bar-chart/BarChart.js +1 -1
  50. package/dist/components/bottom-navigation/BottomNavigation.d.ts +10 -0
  51. package/dist/components/bottom-navigation/BottomNavigation.js +1 -1
  52. package/dist/components/button/Button.js +1 -1
  53. package/dist/components/calendar/Calendar.js +1 -1
  54. package/dist/components/carousel/Carousel.d.ts +13 -0
  55. package/dist/components/carousel/Carousel.js +1 -1
  56. package/dist/components/checkbox/Checkbox.js +1 -1
  57. package/dist/components/code-block/CodeBlock.js +1 -1
  58. package/dist/components/color-picker/ColorPicker.js +1 -1
  59. package/dist/components/combobox/Combobox.d.ts +18 -0
  60. package/dist/components/combobox/Combobox.js +1 -1
  61. package/dist/components/command-palette/CommandPalette.js +1 -1
  62. package/dist/components/container/Container.d.ts +12 -4
  63. package/dist/components/container/Container.js +1 -1
  64. package/dist/components/data-table/DataTable.js +1 -1
  65. package/dist/components/date-picker/DatePicker.js +1 -1
  66. package/dist/components/date-range-picker/DateRangePicker.js +1 -1
  67. package/dist/components/date-time-picker/DateTimePicker.js +1 -1
  68. package/dist/components/dialog/Dialog.js +1 -1
  69. package/dist/components/drawer/Drawer.js +1 -1
  70. package/dist/components/flex/Flex.d.ts +93 -0
  71. package/dist/components/flex/Flex.js +1 -0
  72. package/dist/components/flex/index.d.ts +2 -0
  73. package/dist/components/flex/index.js +1 -0
  74. package/dist/components/floating-action-button/FloatingActionButton.js +1 -1
  75. package/dist/components/footer/Footer.d.ts +4 -3
  76. package/dist/components/footer/Footer.js +1 -1
  77. package/dist/components/gallery/Gallery.d.ts +150 -0
  78. package/dist/components/gallery/Gallery.js +1 -0
  79. package/dist/components/gallery/GalleryViewer.d.ts +30 -0
  80. package/dist/components/gallery/GalleryViewer.js +1 -0
  81. package/dist/components/gallery/index.d.ts +2 -0
  82. package/dist/components/gallery/index.js +1 -0
  83. package/dist/components/gauge-chart/GaugeChart.js +1 -1
  84. package/dist/components/grid/Grid.d.ts +11 -1
  85. package/dist/components/grid/Grid.js +1 -1
  86. package/dist/components/grid-container/GridContainer.js +1 -1
  87. package/dist/components/header/Header.d.ts +5 -4
  88. package/dist/components/header/Header.js +1 -1
  89. package/dist/components/heatmap-chart/HeatmapChart.js +1 -1
  90. package/dist/components/hover-card/HoverCard.js +1 -1
  91. package/dist/components/how-to-steps/HowToSteps.js +1 -1
  92. package/dist/components/image/Image.d.ts +155 -7
  93. package/dist/components/image/Image.js +1 -1
  94. package/dist/components/image/index.d.ts +1 -1
  95. package/dist/components/menu/Menu.js +1 -1
  96. package/dist/components/meter/Meter.d.ts +7 -0
  97. package/dist/components/meter/Meter.js +1 -1
  98. package/dist/components/navigation-menu/NavigationMenu.js +1 -1
  99. package/dist/components/number-field/NumberField.js +1 -1
  100. package/dist/components/otp-field/OtpField.js +1 -1
  101. package/dist/components/overlay/Overlay.js +1 -1
  102. package/dist/components/panes/Panes.js +1 -1
  103. package/dist/components/pie-chart/PieChart.js +1 -1
  104. package/dist/components/popover/Popover.js +1 -1
  105. package/dist/components/progress-circular/ProgressCircular.d.ts +10 -1
  106. package/dist/components/progress-circular/ProgressCircular.js +1 -1
  107. package/dist/components/progress-linear/ProgressLinear.d.ts +7 -1
  108. package/dist/components/progress-linear/ProgressLinear.js +1 -1
  109. package/dist/components/provider/NebaProvider.js +1 -1
  110. package/dist/components/radio-group/RadioGroup.js +1 -1
  111. package/dist/components/rating/Rating.js +1 -1
  112. package/dist/components/scatter-chart/ScatterChart.js +1 -1
  113. package/dist/components/scroll-area/ScrollArea.js +1 -1
  114. package/dist/components/scroll-zone/ScrollZone.d.ts +17 -11
  115. package/dist/components/scroll-zone/ScrollZone.js +1 -1
  116. package/dist/components/select/Select.d.ts +13 -0
  117. package/dist/components/select/Select.js +1 -1
  118. package/dist/components/show/Show.d.ts +60 -0
  119. package/dist/components/show/Show.js +1 -0
  120. package/dist/components/show/index.d.ts +2 -0
  121. package/dist/components/show/index.js +1 -0
  122. package/dist/components/sidebar/Sidebar.js +1 -1
  123. package/dist/components/slider/Slider.d.ts +37 -2
  124. package/dist/components/slider/Slider.js +1 -1
  125. package/dist/components/spoiler/Spoiler.js +1 -1
  126. package/dist/components/stack/Stack.d.ts +126 -0
  127. package/dist/components/stack/Stack.js +1 -0
  128. package/dist/components/stack/index.d.ts +1 -0
  129. package/dist/components/stack/index.js +1 -0
  130. package/dist/components/statistic/Statistic.d.ts +8 -3
  131. package/dist/components/tabs/Tabs.d.ts +46 -0
  132. package/dist/components/tabs/Tabs.js +1 -1
  133. package/dist/components/text-field/TextField.js +1 -1
  134. package/dist/components/time-picker/TimePicker.js +1 -1
  135. package/dist/components/timeline-chart/TimelineChart.js +1 -1
  136. package/dist/components/toast/Toast.js +1 -1
  137. package/dist/components/toggle/Toggle.js +1 -1
  138. package/dist/components/tooltip/Tooltip.js +1 -1
  139. package/dist/components/tour/Tour.js +1 -1
  140. package/dist/components/transfer/Transfer.js +1 -1
  141. package/dist/components/tree-select/TreeSelect.d.ts +2 -0
  142. package/dist/components/tree-select/TreeSelect.js +1 -1
  143. package/dist/components/tree-view/TreeView.js +1 -1
  144. package/dist/components/typography/Typography.js +1 -1
  145. package/dist/hooks/index.d.ts +1 -1
  146. package/dist/hooks/index.js +1 -1
  147. package/dist/hooks/useMediaQuery.d.ts +35 -1
  148. package/dist/hooks/useMediaQuery.js +1 -1
  149. package/dist/index.d.ts +10 -1
  150. package/dist/index.js +1 -1
  151. package/dist/internal/animate.d.ts +65 -2
  152. package/dist/internal/animate.js +1 -1
  153. package/dist/internal/cache.d.ts +24 -0
  154. package/dist/internal/cache.js +1 -0
  155. package/dist/internal/calendar.d.ts +15 -42
  156. package/dist/internal/calendar.js +1 -1
  157. package/dist/internal/chart-frame.d.ts +48 -3
  158. package/dist/internal/chart-frame.js +1 -1
  159. package/dist/internal/chart-line.js +1 -1
  160. package/dist/internal/chart.d.ts +16 -0
  161. package/dist/internal/chart.js +1 -1
  162. package/dist/internal/date.js +1 -1
  163. package/dist/internal/drag.d.ts +8 -6
  164. package/dist/internal/drag.js +1 -1
  165. package/dist/internal/format.d.ts +21 -7
  166. package/dist/internal/format.js +1 -1
  167. package/dist/internal/grid.d.ts +29 -27
  168. package/dist/internal/grid.js +1 -1
  169. package/dist/internal/i18n.d.ts +92 -0
  170. package/dist/internal/i18n.js +1 -1
  171. package/dist/internal/icons.d.ts +25 -0
  172. package/dist/internal/icons.js +1 -1
  173. package/dist/internal/link.d.ts +5 -4
  174. package/dist/internal/media.d.ts +9 -2
  175. package/dist/internal/media.js +1 -1
  176. package/dist/internal/observe.js +1 -1
  177. package/dist/internal/page-layout.d.ts +11 -9
  178. package/dist/internal/page-layout.js +1 -1
  179. package/dist/internal/picker.d.ts +8 -3
  180. package/dist/internal/picker.js +1 -1
  181. package/dist/internal/progress.d.ts +24 -1
  182. package/dist/internal/progress.js +1 -1
  183. package/dist/internal/responsive.d.ts +97 -0
  184. package/dist/internal/responsive.js +1 -0
  185. package/dist/internal/styles.d.ts +140 -2
  186. package/dist/internal/styles.js +1 -1
  187. package/dist/internal/text.d.ts +32 -0
  188. package/dist/internal/text.js +1 -0
  189. package/dist/internal/wheel.d.ts +38 -0
  190. package/dist/internal/wheel.js +1 -0
  191. package/dist/locales/ar.js +1 -1
  192. package/dist/locales/de.js +1 -1
  193. package/dist/locales/es.js +1 -1
  194. package/dist/locales/fr.js +1 -1
  195. package/dist/locales/hi.js +1 -1
  196. package/dist/locales/id.js +1 -1
  197. package/dist/locales/it.js +1 -1
  198. package/dist/locales/ja.js +1 -1
  199. package/dist/locales/ko.js +1 -1
  200. package/dist/locales/nl.js +1 -1
  201. package/dist/locales/pl.js +1 -1
  202. package/dist/locales/pt.js +1 -1
  203. package/dist/locales/ru.js +1 -1
  204. package/dist/locales/th.js +1 -1
  205. package/dist/locales/tr.js +1 -1
  206. package/dist/locales/vi.js +1 -1
  207. package/dist/locales/zh-hans.js +1 -1
  208. package/dist/locales/zh-hant.js +1 -1
  209. package/dist/styles.css +1 -1
  210. package/dist/tailwind.css +411 -30
  211. package/dist/types.d.ts +119 -6
  212. package/package.json +19 -18
  213. package/dist/components/avatar-group/AvatarGroup.d.ts +0 -47
  214. package/dist/components/avatar-group/AvatarGroup.js +0 -1
  215. package/dist/components/avatar-group/index.d.ts +0 -2
  216. package/dist/components/avatar-group/index.js +0 -1
  217. package/dist/internal/avatar-group.d.ts +0 -22
  218. package/dist/internal/avatar-group.js +0 -1
@@ -1,11 +1,96 @@
1
1
  import * as React from 'react';
2
2
  import type { NebaAspectFit } from '../aspect-ratio/AspectRatio.js';
3
- import type { NebaSize, NebaSlots } from '../../types.js';
3
+ import type { NebaCorner, NebaElevation, NebaSize, NebaSlots } from '../../types.js';
4
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. */
5
+ export type ImageSlot = 'image' | 'placeholder' | 'fallback' | 'frame' | 'watermark';
6
+ /**
7
+ * How the picture is coloured.
8
+ *
9
+ * Seven names and an escape hatch: anything else a caller wants is a CSS
10
+ * `filter` chain, and passing one through is better than growing this list
11
+ * until it is a photo editor. `filter="hue-rotate(40deg) contrast(1.1)"` is a
12
+ * valid value.
13
+ */
14
+ export type NebaImageFilter = 'none' | 'grayscale' | 'sepia' | 'invert' | 'saturate' | 'mute' | 'contrast';
15
+ /** The silhouette a frame cuts the picture to. */
16
+ export type NebaImageFrameShape = 'rect' | 'rounded' | 'circle' | 'cut' | 'arch';
17
+ export interface NebaImageFrameOptions {
18
+ /** @default 'rounded' */
19
+ shape?: NebaImageFrameShape;
20
+ /**
21
+ * How big the corner treatment is — a step of the radius ladder, a number in
22
+ * pixels, or a CSS length. Defaults to whatever `rounded` says, and to `md`
23
+ * when `rounded` says nothing.
24
+ */
25
+ corner?: NebaSize | number | string;
26
+ /**
27
+ * A line around the picture. `true` is a hairline; a number is its width in
28
+ * pixels.
29
+ *
30
+ * Drawn as an inset shadow rather than as a `border`, which is not a detail a
31
+ * caller can ignore: it is what lets the line follow a cut corner or a
32
+ * circle, and what keeps it out of the layout so the picture is the size it
33
+ * was going to be either way.
34
+ */
35
+ border?: boolean | number | string;
36
+ /** What colour that line is. Defaults to the house hairline. */
37
+ borderColor?: string;
38
+ /**
39
+ * The mount: space between the line and the picture, in pixels or as a CSS
40
+ * length. This is the one part of a frame that does take room.
41
+ */
42
+ mat?: number | string;
43
+ /** What fills the mount. Defaults to the page's own surface. */
44
+ background?: string;
45
+ /** Drop shadow depth, on the house ladder. @default 0 */
46
+ elevation?: NebaElevation;
47
+ /**
48
+ * Fades the picture's edge out over this distance instead of cutting it. A
49
+ * number in pixels, or a CSS length — `'8%'` reads well on any size of
50
+ * picture.
51
+ */
52
+ feather?: number | string;
53
+ }
54
+ /**
55
+ * A frame is either the silhouette on its own — `frame="circle"` — or the whole
56
+ * arrangement written out. The same shape `transition` takes, for the same
57
+ * reason: one word covers most of it, and the rest is not worth a second prop.
58
+ */
59
+ export type NebaImageFrame = NebaImageFrameShape | NebaImageFrameOptions;
60
+ export interface NebaImageWatermarkOptions {
61
+ /** The mark: a line of text, or a node for a logo. */
62
+ content: React.ReactNode;
63
+ /** Where a single mark sits. @default 'bottom-end' */
64
+ position?: NebaCorner | 'center';
65
+ /**
66
+ * Tiles the mark across the whole picture instead of placing one, which is
67
+ * the arrangement that actually deters a screenshot. Text only — a node
68
+ * cannot be drawn into the tile, and is placed once instead.
69
+ * @default false
70
+ */
71
+ repeat?: boolean;
72
+ /** How strongly the mark shows, from 0 to 1. @default 0.35 */
73
+ opacity?: number;
74
+ /** Turns the mark, in degrees. @default 0, or -24 when tiled */
75
+ rotate?: number;
76
+ /** Type size — a step of the meta ladder, a number in pixels, or a length. */
77
+ size?: NebaSize | number | string;
78
+ /** Ink. Defaults to white, which is what reads over a photograph. */
79
+ color?: string;
80
+ }
81
+ /** A line of text, or the mark written out. */
82
+ export type NebaImageWatermark = string | NebaImageWatermarkOptions;
83
+ export interface NebaImageProtection {
84
+ /** Suppresses the right-click menu over the picture. @default true */
85
+ contextMenu?: boolean;
86
+ /** Stops the picture being dragged out into another window. @default true */
87
+ drag?: boolean;
88
+ /** Takes the picture out of a selection, and off an iOS long press. @default true */
89
+ select?: boolean;
90
+ }
91
+ /** Where a picture is in its own life. */
7
92
  type Phase = 'loading' | 'loaded' | 'failed';
8
- export interface ImageProps extends Omit<React.ComponentPropsWithoutRef<'img'>, 'width' | 'height' | 'children'> {
93
+ export interface ImageProps extends Omit<React.ComponentPropsWithoutRef<'img'>, 'children'> {
9
94
  /** Required, and required to be right. See the note on the component. */
10
95
  alt: string;
11
96
  /**
@@ -13,12 +98,27 @@ export interface ImageProps extends Omit<React.ComponentPropsWithoutRef<'img'>,
13
98
  *
14
99
  * This is the whole reason to use this over an `<img>`: a picture with no
15
100
  * 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.
101
+ * the single largest source of layout shift on most sites. `'auto'` lets the
102
+ * file decide — and `width` and `height` are how you tell it what the file
103
+ * will say, so the box is right before anything has arrived.
19
104
  * @default 'auto'
20
105
  */
21
106
  ratio?: number | string | 'auto';
107
+ /**
108
+ * The file's own pixel dimensions, as an `<img>` takes them.
109
+ *
110
+ * They are the platform's own answer to layout shift, and they are what to
111
+ * reach for when the proportion is the picture's rather than the layout's:
112
+ * `ratio` says "hold this shape whatever arrives", these two say "this is
113
+ * what will arrive". Give both and an `'auto'` ratio becomes their
114
+ * proportion, so the box is reserved without anybody working out that 1200 by
115
+ * 800 is 3/2.
116
+ *
117
+ * They reach the `<img>` either way. One on its own reserves nothing, since
118
+ * a proportion needs two numbers.
119
+ */
120
+ width?: number | string;
121
+ height?: number | string;
22
122
  /** How the picture fills that box. @default 'cover' */
23
123
  fit?: NebaAspectFit;
24
124
  /** Rounds the corners at this step of the radius ladder. `false` for square. */
@@ -47,6 +147,50 @@ export interface ImageProps extends Omit<React.ComponentPropsWithoutRef<'img'>,
47
147
  * @default false
48
148
  */
49
149
  preview?: boolean;
150
+ /**
151
+ * How the picture is coloured: a named filter, or a CSS `filter` chain of
152
+ * your own. It travels, so a `className` that changes it on hover is a
153
+ * treatment that fades in rather than snapping.
154
+ * @default 'none'
155
+ */
156
+ filter?: NebaImageFilter | (string & {});
157
+ /**
158
+ * How the picture is mounted: the silhouette it is cut to, and the line, the
159
+ * mount, the shadow and the softened edge around it.
160
+ */
161
+ frame?: NebaImageFrame;
162
+ /**
163
+ * A mark drawn over the picture — a credit line, a licence, the word DRAFT.
164
+ *
165
+ * A deterrent and not a lock. It is on top of the picture rather than in it,
166
+ * so anybody who opens the network tab has the file exactly as it was served;
167
+ * what a mark stops is the copy that gets made without thinking about it.
168
+ */
169
+ watermark?: NebaImageWatermark;
170
+ /**
171
+ * Turns off the ways a picture is casually taken: the right-click menu, the
172
+ * drag that drops a copy into another window, the iOS long press, and the
173
+ * selection a Ctrl-A sweeps up.
174
+ *
175
+ * The same deterrent, and the same caveat: the file is still one request
176
+ * away, and a reader who wants it will have it. Turning this on to protect a
177
+ * secret is turning it on for the wrong reason.
178
+ * @default false
179
+ */
180
+ protect?: boolean | NebaImageProtection;
181
+ /**
182
+ * Which language the picture names its own absence in — a BCP 47 tag such as
183
+ * `ko`, `pt-BR` or `zh-Hant`. Unsupported tags fall back to English.
184
+ *
185
+ * It is read for one string, and only when a file fails and there is no `alt`
186
+ * to put in its place. `unavailableLabel` writes the words out instead.
187
+ */
188
+ locale?: string;
189
+ /**
190
+ * What the box says when the file does not arrive and `alt` is empty.
191
+ * Defaults to the `locale`'s wording.
192
+ */
193
+ unavailableLabel?: string;
50
194
  /** Class names for the parts behind the root. */
51
195
  classNames?: NebaSlots<ImageSlot>;
52
196
  }
@@ -65,6 +209,10 @@ export interface ImageProps extends Omit<React.ComponentPropsWithoutRef<'img'>,
65
209
  * mean different things — "nobody wrote this" and "this picture says nothing a
66
210
  * reader needs" — and only the second is ever correct. Being made to type
67
211
  * `alt=""` is being made to say which one you meant.
212
+ *
213
+ * Everything past that is opt-in and costs nothing until it is asked for:
214
+ * `filter` is one declaration, `frame` is one element, `watermark` is one, and
215
+ * `preview` is a chunk that is not fetched at all unless it is on.
68
216
  */
69
217
  export declare const Image: React.ForwardRefExoticComponent<ImageProps & React.RefAttributes<HTMLImageElement>>;
70
218
  export {};
@@ -1 +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});
1
+ "use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as a from"react";import{AspectRatio as o}from"../aspect-ratio/AspectRatio.js";import{Skeleton as r}from"../skeleton/Skeleton.js";import{useStyleDefaults as l}from"../../internal/defaults.js";import{imageMessages as s,useMessages as i}from"../../internal/i18n.js";import{cx as c,metaTextValues as u,radiusClasses as d,toLength as f}from"../../internal/styles.js";const m={cover:"object-cover",contain:"object-contain",fill:"object-fill",none:"object-none"},p={none:"none",grayscale:"grayscale(1)",sepia:"sepia(0.72)",invert:"invert(1)",saturate:"saturate(1.5)",mute:"saturate(0.45)",contrast:"contrast(1.25)"},b={"top-start":"items-start justify-start","top-end":"items-start justify-end","bottom-start":"items-end justify-start","bottom-end":"items-end justify-end",center:"items-center justify-center"},g=a.lazy(()=>import("../dialog/Dialog.js").then(e=>({default:e.Dialog})));function h(e,t){switch(e){case"rect":return{borderRadius:"0px"};case"circle":return{borderRadius:"50%"};case"arch":return{borderRadius:`50% 50% ${t} ${t} / 55% 55% ${t} ${t}`};case"cut":return{clipPath:`polygon(${t} 0, calc(100% - ${t}) 0, 100% ${t}, 100% calc(100% - ${t}), calc(100% - ${t}) 100%, ${t} 100%, 0 calc(100% - ${t}), 0 ${t})`};default:return{borderRadius:t}}}function v(e){const t=t=>`linear-gradient(to ${t}, transparent, #000 ${e}, #000 calc(100% - ${e}), transparent)`,n=`${t("right")}, ${t("bottom")}`;return{maskImage:n,maskComposite:"intersect",WebkitMaskImage:n,WebkitMaskComposite:"source-in"}}export const Image=/*@__PURE__*/a.forwardRef(function(y,x){const{alt:$,ratio:k="auto",width:w,height:N,fit:j="cover",rounded:S=!1,placeholder:C,fallback:z,onLoadingStatusChange:M,preview:R=!1,filter:D="none",frame:_,watermark:I,protect:W=!1,locale:E,unavailableLabel:F,className:L,classNames:A,style:H,src:O,...P}=l(y,["locale"]),T=i(s,E),[U,q]=a.useState("loading"),[B,G]=a.useState(!1),J=a.useRef(null),K=a.useRef(M);a.useEffect(()=>{K.current=M});const Q=a.useCallback(e=>{J.current=e,"function"==typeof x?x(e):x&&(x.current=e)},[x]);a.useEffect(()=>{const e=J.current,t=O&&e?.complete?e.naturalWidth>0?"loaded":"failed":null;q(t??"loading"),t&&K.current?.(t)},[O]);const V=e=>{q(e),M?.(e)},X=!1===S?"":d[!0===S?"md":S],Y=D in p?p[D]:D,Z=!0===W?{}:!1===W?null:W,ee=null!==Z&&!1!==Z.contextMenu,te=null!==Z&&!1!==Z.drag,ne=null!==Z&&!1!==Z.select,ae=e=>e.preventDefault(),oe=Z?{onContextMenu:ee?ae:void 0,onDragStart:te?ae:void 0,draggable:!te&&void 0,className:ne?"select-none":"",style:ne?{WebkitTouchCallout:"none"}:void 0}:null,re=e("img",{ref:Q,src:O,alt:$,width:w,height:N,className:c("block size-full",m[j],X,"[transition:opacity_var(--neba-duration-fill)_var(--neba-ease),filter_var(--neba-duration-fill)_var(--neba-ease)]","loaded"===U?"opacity-100":"opacity-0",oe?.className,A?.image),style:{filter:"none"===Y?void 0:Y,...oe?.style},onLoad:()=>V("loaded"),onError:()=>V("failed"),onContextMenu:oe?.onContextMenu,onDragStart:oe?.onDragStart,draggable:oe?.draggable,...P}),le="failed"===U?e("span",{className:c("absolute inset-0 flex items-center justify-center","bg-(--neba-disabled-bg) text-(--neba-muted-fg)",X,A?.fallback),children:z??e("span",{className:"px-2 text-center text-sm",children:$||F||T.unavailable})}):"loading"===U&&!1!==C?e("span",{className:c("absolute inset-0",A?.placeholder),children:C??e(r,{shape:"rect",className:c("size-full",X)})}):null,se=void 0===I?null:function(t,n){const a="string"==typeof t?{content:t}:t,{content:o,position:r="bottom-end",repeat:l=!1,opacity:s=.35,size:i="xs",color:d="#ffffff"}=a,m="string"==typeof i&&i in u?u[i]:f(i)??u.xs,p=a.rotate??(l&&"string"==typeof o?-24:0);if(l&&"string"==typeof o){const t=function(e,t){let n=0;for(const t of e)n+=/[ᄀ-ᇿ⺀-꓏가-퟿豈-﫿︰-﹏]/.test(t)?1:.6;const a=Math.max(16,Math.round(16*(n+2.4))),o=e.replace(/[&<>]/g,e=>"&"===e?"&amp;":"<"===e?"&lt;":"&gt;");return{uri:`data:image/svg+xml,${encodeURIComponent(`<svg xmlns="http://www.w3.org/2000/svg" width="${a}" height="52"><text x="0" y="32" font-family="system-ui, sans-serif" font-size="16" fill="${t}" stroke="rgba(0,0,0,0.28)" stroke-width="0.6" paint-order="stroke">${o}</text></svg>`)}`,width:a,height:52}}(o,d);return e("span",{"aria-hidden":"true",className:c("pointer-events-none absolute select-none",n),style:{inset:"-40%",opacity:s,transform:`rotate(${p}deg)`,backgroundImage:`url("${t.uri}")`,backgroundSize:`calc(${m} * ${t.width/16}) calc(${m} * ${t.height/16})`}})}return e("span",{"aria-hidden":"true",className:c("pointer-events-none absolute inset-0 flex select-none p-2",b[r],n),children:e("span",{style:{color:d,opacity:s,fontSize:m,lineHeight:1.2,textShadow:"0 1px 2px rgba(0, 0, 0, 0.45)",transform:p?`rotate(${p}deg)`:void 0},children:o})})}(I,A?.watermark),ie=t("span",{className:"relative block size-full",children:[re,le,se]}),ce="auto"===k?function(e,t){const n="number"==typeof e?e:Number(e),a="number"==typeof t?t:Number(t);return Number.isFinite(n)&&Number.isFinite(a)&&n>0&&a>0?n/a:null}(w,N):null,ue=ce??k,de=void 0===_?null:function(e,t){const n=!0===t?"md":t;return{shape:"rounded",corner:!1===n?"md":n,..."string"==typeof e?{shape:e}:e}}(_,S),fe=null===de?"0px":function(e){return"string"==typeof e&&e in d?`var(--neba-radius-${e})`:f(e)??"0px"}(de.corner??"md"),me=null===de?void 0:f(de.mat),pe=null===de?void 0:f(de.feather),be={...null===de?null:h(de.shape,fe),...void 0===pe?null:v(pe),...null===de?H:null},ge="auto"===ue?e("span",{className:c("relative block overflow-hidden",null===de?X:"",null===de?L:""),style:be,children:ie}):e(o,{ratio:ue,className:c("overflow-hidden",null===de?X:"",null===de?L:""),style:be,children:ie}),he=null===de?void 0:function(e){if(void 0===e.border||!1===e.border)return;const t=!0===e.border?"1px":f(e.border);return`inset 0 0 0 ${t} ${e.borderColor??"var(--neba-line)"}`}(de),ve=void 0===me?fe:`calc(${fe} + ${me})`,ye=null===de?ge:t("span",{className:c("relative block",A?.frame,L),style:{...h(de.shape,ve),padding:me,background:de.background??(void 0===me?void 0:"var(--neba-surface)"),boxShadow:de.elevation?`var(--neba-shadow-${de.elevation})`:void 0,...H},children:[ge,void 0===he?null:e("span",{"aria-hidden":"true",className:"pointer-events-none absolute inset-0",style:{...h(de.shape,ve),boxShadow:he}})]});return R?t(n,{children:[e("button",{type:"button","aria-label":$,className:c("block w-full cursor-zoom-in [outline:none]","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:2px]",X),onClick:()=>G(!0),children:ye}),e(a.Suspense,{fallback:null,children:e(g,{open:B,onOpenChange:G,size:"xl",title:$,children:t("span",{className:"relative mx-auto block w-fit",children:[e("img",{src:O,alt:$,className:c("mx-auto block max-h-[70vh] w-auto max-w-full",oe?.className),style:{filter:"none"===Y?void 0:Y,...oe?.style},onContextMenu:oe?.onContextMenu,onDragStart:oe?.onDragStart,draggable:oe?.draggable}),se]})})})]}):ye});
@@ -1,2 +1,2 @@
1
1
  export { Image } from './Image.js';
2
- export type { ImageProps, ImageSlot } from './Image.js';
2
+ export type { ImageProps, ImageSlot, NebaImageFilter, NebaImageFrame, NebaImageFrameOptions, NebaImageFrameShape, NebaImageProtection, NebaImageWatermark, NebaImageWatermarkOptions } from './Image.js';
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as n,Fragment as t}from"react/jsx-runtime";import*as a from"react";import{Menu as l}from"@base-ui/react/menu";import{ContextMenu as s}from"@base-ui/react/context-menu";import{MenuContext as i}from"../../internal/menu.js";import{CheckIcon as o,ChevronIcon as r,DotIcon as c}from"../../internal/icons.js";import{safeRel as d}from"../../internal/link.js";import{controlTextLeadingClasses as u,cx as m,gapClasses as p,hasContent as h,iconClasses as x,metaTextClasses as f,radiusClasses as b,surfaceClasses as g,surfaceSlots as y,transitionClasses as N}from"../../internal/styles.js";const C=[g,"max-h-[min(24rem,var(--available-height))] min-w-40 overflow-y-auto overscroll-contain","border bg-(--n-panel-press) p-1","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]","[outline:none]","[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),v={default:{xs:"px-1.5 py-0.5",sm:"px-2 py-1",md:"px-2.5 py-1.5",lg:"px-3 py-2",xl:"px-3.5 py-2.5"},compact:{xs:"px-1 py-0.5",sm:"px-1.5 py-0.5",md:"px-2 py-1",lg:"px-2.5 py-1",xl:"px-3 py-1.5"}},k={xs:b.xs,sm:b.xs,md:b.sm,lg:b.sm,xl:b.md};function O(e,n,t,a){return m("relative flex w-full cursor-pointer items-center select-none",t?"text-(--n-accent)":"text-(--neba-fg)",v[n][e],k[e],p[e],u[e],N,x,"data-[highlighted]:bg-(--n-soft-hover)","data-[popup-open]:bg-(--n-soft)","data-[disabled]:cursor-not-allowed data-[disabled]:text-(--neba-disabled-fg)","[outline:none]",a??"")}const z="flex h-[1lh] w-[1.2em] shrink-0 items-center justify-center";function I({children:t,description:a,size:l}){return h(a)?n("span",{className:"flex min-w-0 flex-1 flex-col text-start",children:[e("span",{className:"truncate",children:t}),e("span",{className:`truncate text-(--neba-muted-fg) ${f[l]}`,children:a})]}):e("span",{className:"min-w-0 flex-1 truncate text-start",children:t})}export function MenuItem({onClick:s,href:o,target:r,rel:c,startIcon:u,endIcon:m,shortcut:p,description:x,color:b,closeOnClick:g=!0,disabled:N=!1,label:C,children:v,className:k,style:M}){const j=a.useContext(i),{size:$,density:w}=j,P=n(t,{children:[h(u)?e("span",{className:`${z} text-(--neba-muted-fg)`,children:u}):null,e(I,{description:x,size:$,children:v}),h(m)?e("span",{className:`${z} text-(--neba-muted-fg)`,children:m}):null,h(p)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${f[$]}`,children:p}):null]}),R=b?y(b,0):void 0,F=R||M?{...R,...M}:void 0;return void 0!==o?e(l.LinkItem,{href:o,target:r,rel:d(r,c),label:C,closeOnClick:g,onClick:s,className:O($,w,Boolean(b),k),style:F,children:P}):e(l.Item,{disabled:N,label:C,closeOnClick:g,onClick:s,className:O($,w,Boolean(b),k),style:F,children:P})}export function MenuCheckboxItem({checked:t,defaultChecked:s,onCheckedChange:r,endIcon:c,shortcut:d,description:u,color:m,closeOnClick:p=!1,disabled:x=!1,label:b,children:g,className:N,style:C}){const{size:v,density:k}=a.useContext(i),M=m?y(m,0):void 0;return n(l.CheckboxItem,{checked:t,defaultChecked:s,onCheckedChange:e=>r?.(e),disabled:x,label:b,closeOnClick:p,className:O(v,k,Boolean(m),N),style:M||C?{...M,...C}:void 0,children:[e("span",{className:`${z} text-(--n-accent)`,children:e(l.CheckboxItemIndicator,{className:"flex items-center justify-center",children:e(o,{})})}),e(I,{description:u,size:v,children:g}),h(c)?e("span",{className:`${z} text-(--neba-muted-fg)`,children:c}):null,h(d)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${f[v]}`,children:d}):null]})}export function MenuRadioGroup({value:n,defaultValue:t,onValueChange:a,disabled:s=!1,children:i,className:o}){return e(l.RadioGroup,{value:n,defaultValue:t,onValueChange:e=>a?.(e),disabled:s,className:o,children:i})}export function MenuRadioItem({value:t,endIcon:s,shortcut:o,description:r,color:d,closeOnClick:u=!1,disabled:m=!1,label:p,children:x,className:b,style:g}){const{size:N,density:C}=a.useContext(i),v=d?y(d,0):void 0;return n(l.RadioItem,{value:t,disabled:m,label:p,closeOnClick:u,className:O(N,C,Boolean(d),b),style:v||g?{...v,...g}:void 0,children:[e("span",{className:`${z} text-(--n-accent)`,children:e(l.RadioItemIndicator,{className:"flex items-center justify-center",children:e(c,{})})}),e(I,{description:r,size:N,children:x}),h(s)?e("span",{className:`${z} text-(--neba-muted-fg)`,children:s}):null,h(o)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${f[N]}`,children:o}):null]})}export function MenuGroup({label:t,children:s,className:o}){const{size:r,density:c}=a.useContext(i);return n(l.Group,{className:o,children:[h(t)?e(l.GroupLabel,{className:[v[c][r],f[r],"font-semibold tracking-wide text-(--neba-muted-fg) uppercase"].join(" "),children:t}):null,s]})}export function MenuSeparator({className:n,...t}){return e(l.Separator,{className:m("-mx-1 my-1 h-px bg-(--n-line)",n??""),...t})}export function MenuSubmenu({label:t,startIcon:s,disabled:o=!1,side:c="right",sideOffset:d=4,children:p,className:x,style:f}){const g=a.useContext(i),{size:N,density:v,color:k}=g;return n(l.SubmenuRoot,{children:[n(l.SubmenuTrigger,{disabled:o,className:O(N,v,!1),children:[h(s)?e("span",{className:`${z} text-(--neba-muted-fg)`,children:s}):null,e("span",{className:"min-w-0 flex-1 truncate text-start",children:t}),e("span",{className:`${z} text-(--neba-muted-fg) -rotate-90`,children:e(r,{})})]}),e(l.Portal,{children:e(l.Positioner,{className:"neba-portal z-50 [outline:none]",side:c,sideOffset:d,align:"start",children:e(l.Popup,{className:m(C,b[N],u[N],x??""),style:{...y(k,3),...f},children:p})})})]})}export function Menu({size:t="md",color:s="primary",density:o="default",trigger:r,open:c,defaultOpen:d,onOpenChange:p,side:h="bottom",align:x="start",sideOffset:f=6,modal:g,openOnHover:N=!1,loopFocus:v=!0,disabled:k=!1,className:O,style:z,children:I}){const M=a.useMemo(()=>({size:t,color:s,density:o}),[t,s,o]);return e(i.Provider,{value:M,children:n(l.Root,{open:c,defaultOpen:d,onOpenChange:e=>p?.(e),modal:g,loopFocus:v,disabled:k,children:[r?e(l.Trigger,{render:r,openOnHover:N,disabled:k}):null,e(l.Portal,{children:e(l.Positioner,{className:"neba-portal z-50 [outline:none]",side:h,align:x,sideOffset:f,children:e(l.Popup,{className:m(C,b[t],u[t],O??""),style:{...y(s,3),...z},children:I})})})]})})}export function ContextMenu({size:t="md",color:l="primary",density:o="default",content:r,children:c,open:d,defaultOpen:p,onOpenChange:h,loopFocus:x=!0,disabled:f=!1,className:g,style:N}){const v=a.useMemo(()=>({size:t,color:l,density:o}),[t,l,o]);return e(i.Provider,{value:v,children:n(s.Root,{open:d,defaultOpen:p,onOpenChange:e=>h?.(e),loopFocus:x,disabled:f,children:[e(s.Trigger,{children:c}),e(s.Portal,{children:e(s.Positioner,{className:"neba-portal z-50 [outline:none]",children:e(s.Popup,{className:m(C,b[t],u[t],g??""),style:{...y(l,3),...N},children:r})})})]})})}
1
+ "use client";import{jsx as e,jsxs as n,Fragment as l}from"react/jsx-runtime";import*as t from"react";import{Menu as a}from"@base-ui/react/menu";import{ContextMenu as s}from"@base-ui/react/context-menu";import{MenuContext as o}from"../../internal/menu.js";import{CheckIcon as r,ChevronIcon as i,DotIcon as c}from"../../internal/icons.js";import{safeRel as d}from"../../internal/link.js";import{controlTextLeadingClasses as u,cx as m,gapClasses as p,hasContent as h,iconClasses as x,metaTextClasses as b,popupFadeClasses as f,radiusClasses as g,surfaceClasses as N,surfaceSlots as y,transitionClasses as C}from"../../internal/styles.js";const k=[N,"max-h-[min(24rem,var(--available-height))] min-w-40 overflow-y-auto overscroll-contain","border bg-(--n-panel-press) p-1","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]","[outline:none]",f].join(" "),v={default:{xs:"px-1.5 py-0.5",sm:"px-2 py-1",md:"px-2.5 py-1.5",lg:"px-3 py-2",xl:"px-3.5 py-2.5"},compact:{xs:"px-1 py-0.5",sm:"px-1.5 py-0.5",md:"px-2 py-1",lg:"px-2.5 py-1",xl:"px-3 py-1.5"}},O={xs:g.xs,sm:g.xs,md:g.sm,lg:g.sm,xl:g.md};function z(e,n,l,t){return m("relative flex w-full cursor-pointer items-center select-none",l?"text-(--n-accent)":"text-(--neba-fg)",v[n][e],O[e],p[e],u[e],C,x,"data-[highlighted]:bg-(--n-soft-hover)","data-[popup-open]:bg-(--n-soft)","data-[disabled]:cursor-not-allowed data-[disabled]:text-(--neba-disabled-fg)","[outline:none]",t??"")}const I="flex h-[1lh] w-[1.2em] shrink-0 items-center justify-center";function M({children:l,description:t,size:a}){return h(t)?n("span",{className:"flex min-w-0 flex-1 flex-col text-start",children:[e("span",{className:"truncate",children:l}),e("span",{className:`truncate text-(--neba-muted-fg) ${b[a]}`,children:t})]}):e("span",{className:"min-w-0 flex-1 truncate text-start",children:l})}export function MenuItem({onClick:s,href:r,target:i,rel:c,startIcon:u,endIcon:m,shortcut:p,description:x,color:f,closeOnClick:g=!0,disabled:N=!1,label:C,children:k,className:v,style:O}){const j=t.useContext(o),{size:$,density:w}=j,P=n(l,{children:[h(u)?e("span",{className:`${I} text-(--neba-muted-fg)`,children:u}):null,e(M,{description:x,size:$,children:k}),h(m)?e("span",{className:`${I} text-(--neba-muted-fg)`,children:m}):null,h(p)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${b[$]}`,children:p}):null]}),R=f?y(f,0):void 0,F=R||O?{...R,...O}:void 0;return void 0!==r?e(a.LinkItem,{href:r,target:i,rel:d(i,c),label:C,closeOnClick:g,onClick:s,className:z($,w,Boolean(f),v),style:F,children:P}):e(a.Item,{disabled:N,label:C,closeOnClick:g,onClick:s,className:z($,w,Boolean(f),v),style:F,children:P})}export function MenuCheckboxItem({checked:l,defaultChecked:s,onCheckedChange:i,endIcon:c,shortcut:d,description:u,color:m,closeOnClick:p=!1,disabled:x=!1,label:f,children:g,className:N,style:C}){const{size:k,density:v}=t.useContext(o),O=m?y(m,0):void 0;return n(a.CheckboxItem,{checked:l,defaultChecked:s,onCheckedChange:e=>i?.(e),disabled:x,label:f,closeOnClick:p,className:z(k,v,Boolean(m),N),style:O||C?{...O,...C}:void 0,children:[e("span",{className:`${I} text-(--n-accent)`,children:e(a.CheckboxItemIndicator,{className:"flex items-center justify-center",children:e(r,{})})}),e(M,{description:u,size:k,children:g}),h(c)?e("span",{className:`${I} text-(--neba-muted-fg)`,children:c}):null,h(d)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${b[k]}`,children:d}):null]})}export function MenuRadioGroup({value:n,defaultValue:l,onValueChange:t,disabled:s=!1,children:o,className:r}){return e(a.RadioGroup,{value:n,defaultValue:l,onValueChange:e=>t?.(e),disabled:s,className:r,children:o})}export function MenuRadioItem({value:l,endIcon:s,shortcut:r,description:i,color:d,closeOnClick:u=!1,disabled:m=!1,label:p,children:x,className:f,style:g}){const{size:N,density:C}=t.useContext(o),k=d?y(d,0):void 0;return n(a.RadioItem,{value:l,disabled:m,label:p,closeOnClick:u,className:z(N,C,Boolean(d),f),style:k||g?{...k,...g}:void 0,children:[e("span",{className:`${I} text-(--n-accent)`,children:e(a.RadioItemIndicator,{className:"flex items-center justify-center",children:e(c,{})})}),e(M,{description:i,size:N,children:x}),h(s)?e("span",{className:`${I} text-(--neba-muted-fg)`,children:s}):null,h(r)?e("span",{className:`ms-2 shrink-0 text-(--neba-muted-fg) tabular-nums ${b[N]}`,children:r}):null]})}export function MenuGroup({label:l,children:s,className:r}){const{size:i,density:c}=t.useContext(o);return n(a.Group,{className:r,children:[h(l)?e(a.GroupLabel,{className:[v[c][i],b[i],"font-semibold tracking-wide text-(--neba-muted-fg) uppercase"].join(" "),children:l}):null,s]})}export function MenuSeparator({className:n,...l}){return e(a.Separator,{className:m("-mx-1 my-1 h-px bg-(--n-line)",n??""),...l})}export function MenuSubmenu({label:l,startIcon:s,disabled:r=!1,side:c="right",sideOffset:d=4,children:p,className:x,style:b}){const f=t.useContext(o),{size:N,density:C,color:v}=f;return n(a.SubmenuRoot,{children:[n(a.SubmenuTrigger,{disabled:r,className:z(N,C,!1),children:[h(s)?e("span",{className:`${I} text-(--neba-muted-fg)`,children:s}):null,e("span",{className:"min-w-0 flex-1 truncate text-start",children:l}),e("span",{className:`${I} text-(--neba-muted-fg) -rotate-90`,children:e(i,{})})]}),e(a.Portal,{children:e(a.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",side:c,sideOffset:d,align:"start",children:e(a.Popup,{className:m(k,g[N],u[N],x??""),style:{...y(v,3),...b},children:p})})})]})}export function Menu({size:l="md",color:s="primary",density:r="default",trigger:i,open:c,defaultOpen:d,onOpenChange:p,side:h="bottom",align:x="start",sideOffset:b=6,modal:f,openOnHover:N=!1,loopFocus:C=!0,disabled:v=!1,className:O,style:z,children:I}){const M=t.useMemo(()=>({size:l,color:s,density:r}),[l,s,r]);return e(o.Provider,{value:M,children:n(a.Root,{open:c,defaultOpen:d,onOpenChange:e=>p?.(e),modal:f,loopFocus:C,disabled:v,children:[i?e(a.Trigger,{render:i,openOnHover:N,disabled:v}):null,e(a.Portal,{children:e(a.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",side:h,align:x,sideOffset:b,children:e(a.Popup,{className:m(k,g[l],u[l],O??""),style:{...y(s,3),...z},children:I})})})]})})}export function ContextMenu({size:l="md",color:a="primary",density:r="default",content:i,children:c,open:d,defaultOpen:p,onOpenChange:h,loopFocus:x=!0,disabled:b=!1,className:f,style:N}){const C=t.useMemo(()=>({size:l,color:a,density:r}),[l,a,r]);return e(o.Provider,{value:C,children:n(s.Root,{open:d,defaultOpen:p,onOpenChange:e=>h?.(e),loopFocus:x,disabled:b,children:[e(s.Trigger,{children:c}),e(s.Portal,{children:e(s.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",children:e(s.Popup,{className:m(k,g[l],u[l],f??""),style:{...y(a,3),...N},children:i})})})]})})}
@@ -1,4 +1,5 @@
1
1
  import * as React from 'react';
2
+ import { type ProgressThickness } from '../../internal/progress.js';
2
3
  import type { NebaColor, NebaSize, NebaThreshold } from '../../types.js';
3
4
  export interface MeterProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'children'> {
4
5
  /**
@@ -32,6 +33,12 @@ export interface MeterProps extends Omit<React.ComponentPropsWithoutRef<'div'>,
32
33
  thresholds?: readonly NebaThreshold[];
33
34
  /** Thickness of the groove. Nothing else on a bar has a size. @default 'md' */
34
35
  size?: NebaSize;
36
+ /**
37
+ * The groove's thickness in pixels, when the step's own is not the one you
38
+ * want. The same prop a [ProgressLinear](./progress-linear) takes, because
39
+ * the two draw the same groove.
40
+ */
41
+ thickness?: ProgressThickness;
35
42
  /** The family the bar carries before any threshold is reached. @default 'primary' */
36
43
  color?: NebaColor;
37
44
  }
@@ -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";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
+ "use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{Meter as l}from"@base-ui/react/meter";import{barThicknessClasses as t,progressFraction as s,progressSlots as n,thresholdColor as i}from"../../internal/progress.js";import{cx as o,metaTextClasses as m,stackGapClasses as u}from"../../internal/styles.js";import{useStyleDefaults as f}from"../../internal/defaults.js";export const Meter=/*@__PURE__*/r.forwardRef(function(r,c){const{value:d,min:b=0,max:h=100,label:p,showValue:v=!1,format:x,thresholds:j,thickness:g,size:w="md",color:y="primary",className:N,style:k,..._}=f(r,["size"]),M=s(d,b,h),$=i(d,y,j),z=void 0!==x;return a(l.Root,{ref:c,value:d,min:b,max:h,format:x,className:o("flex w-full flex-col",u[w],N??""),style:{...n($),...k},..._,children:[p||v?a("div",{className:["flex items-baseline gap-2",p?"justify-between":"justify-end",m[w]].join(" "),children:[p?e(l.Label,{className:"min-w-0 truncate text-(--neba-fg)",children:p}):null,v?e(l.Value,{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:e=>z?e:`${Math.round(100*(M??0))}%`}):null]}):null,e(l.Track,{className:`relative w-full overflow-hidden rounded-full bg-(--n-soft) ${t[w]}`,style:void 0===g?void 0:{height:`${g}px`},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 n,Fragment as a}from"react/jsx-runtime";import*as t from"react";import{NavigationMenu as i}from"@base-ui/react/navigation-menu";import{ChevronIcon as r}from"../../internal/icons.js";import{safeRel as o}from"../../internal/link.js";import{controlHeightClasses as s,controlTextClasses as l,controlTextLeadingClasses as d,cx as c,gapClasses as u,hasContent as f,iconClasses as p,metaTextClasses as m,paddingXClasses as h,radiusClasses as b,surfaceClasses as v,surfaceSlots as g,transitionClasses as x}from"../../internal/styles.js";const y=/*@__PURE__*/t.createContext({size:"md",density:"default"}),N=["inline-flex shrink-0 cursor-pointer select-none items-center justify-center","whitespace-nowrap font-medium leading-none no-underline","text-(--neba-fg) bg-transparent","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",x,p,"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-2","data-[disabled]:cursor-not-allowed data-[disabled]:text-(--neba-disabled-fg)","data-[disabled]:hover:bg-transparent"].join(" "),w=[v,"relative 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] overflow-hidden","[transition:opacity_var(--neba-duration)_var(--neba-ease),width_var(--neba-duration)_var(--neba-ease),height_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),j=["flex min-w-0 cursor-pointer items-start no-underline","text-(--neba-fg) bg-transparent",x,p,"hover:bg-(--n-soft)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]"].join(" "),_={xs:"p-1",sm:"p-1.5",md:"p-2",lg:"p-2.5",xl:"p-3"};export const NavigationMenuLink=/*@__PURE__*/t.forwardRef(function({href:a,title:r,description:o,startIcon:s,className:l,children:p,...v},g){const{size:x,density:N}=t.useContext(y);return n(i.Link,{ref:g,href:a,className:c(j,b[x],u[x],h[N??"default"][x],"py-2",l??""),...v,children:[f(s)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:s}):null,n("span",{className:"flex min-w-0 flex-col gap-0.5",children:[e("span",{className:`font-medium ${d[x]}`,children:r}),f(o)?e("span",{className:`text-(--neba-muted-fg) ${m[x]}`,children:o}):null,p]})]})});export function NavigationMenuItem({label:d,href:c,target:p,rel:m,startIcon:v,value:g,disabled:x=!1,columns:w=1,children:j}){const{size:k,density:z}=t.useContext(y),C=void 0!==c&&!f(j),$=[N,s[k],l[k],u[k],h[z??"default"][k],b[k]].join(" ");return e(i.Item,{value:g,children:C?n(i.Link,{href:c,target:p,rel:o(p,m),className:$,children:[f(v)?v:null,d]}):n(a,{children:[n(i.Trigger,{disabled:x,className:$,children:[f(v)?v:null,d,e(i.Icon,{className:"flex items-center [transition:rotate_var(--neba-duration)_var(--neba-ease)] data-[popup-open]:rotate-180",children:e(r,{})})]}),e(i.Content,{className:`grid gap-1 ${_[k]}`,style:w>1?{gridTemplateColumns:`repeat(${w}, minmax(0, 1fr))`}:void 0,children:j})]})})}export const NavigationMenu=/*@__PURE__*/t.forwardRef(function({size:a="md",color:r="primary",density:o="default",orientation:s="horizontal",value:l,defaultValue:d,onValueChange:c,delay:f,closeDelay:p,sideOffset:m=8,className:h,style:v,children:x,...N},j){const _=t.useMemo(()=>({size:a,density:o}),[a,o]);return e(y.Provider,{value:_,children:n(i.Root,{ref:j,orientation:s,value:l,defaultValue:d,onValueChange:e=>c?.(e),delay:f,closeDelay:p,className:h,style:{...g(r,3),"--n-soft-hover":`var(--neba-${r}-soft-hover)`,...v},...N,children:[e(i.List,{className:["flex items-center","vertical"===s?"flex-col items-stretch":"flex-row",u[a]].join(" "),children:x}),e(i.Portal,{children:e(i.Positioner,{className:"neba-portal z-50 [outline:none]",sideOffset:m,collisionPadding:12,children:e(i.Popup,{className:`${w} ${b[a]}`,children:e(i.Viewport,{})})})})]})})});
1
+ "use client";import{jsx as e,jsxs as n,Fragment as a}from"react/jsx-runtime";import*as t from"react";import{NavigationMenu as i}from"@base-ui/react/navigation-menu";import{ChevronIcon as r}from"../../internal/icons.js";import{safeRel as o}from"../../internal/link.js";import{controlHeightClasses as s,controlTextClasses as l,controlTextLeadingClasses as d,cx as c,gapClasses as u,hasContent as f,iconClasses as p,metaTextClasses as m,paddingXClasses as h,popupFadeStateClasses as b,radiusClasses as g,surfaceClasses as v,surfaceSlots as x,transitionClasses as N}from"../../internal/styles.js";const y=/*@__PURE__*/t.createContext({size:"md",density:"default"}),w=["inline-flex shrink-0 cursor-pointer select-none items-center justify-center","whitespace-nowrap font-medium leading-none no-underline","text-(--neba-fg) bg-transparent","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",N,p,"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-2","data-[disabled]:cursor-not-allowed data-[disabled]:text-(--neba-disabled-fg)","data-[disabled]:hover:bg-transparent"].join(" "),j=[v,"relative 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] overflow-hidden","[transition:opacity_var(--neba-duration)_var(--neba-ease),width_var(--neba-duration)_var(--neba-ease),height_var(--neba-duration)_var(--neba-ease)]",b].join(" "),_=["flex min-w-0 cursor-pointer items-start no-underline","text-(--neba-fg) bg-transparent",N,p,"hover:bg-(--n-soft)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]"].join(" "),z={xs:"p-1",sm:"p-1.5",md:"p-2",lg:"p-2.5",xl:"p-3"};export const NavigationMenuLink=/*@__PURE__*/t.forwardRef(function({href:a,title:r,description:o,startIcon:s,className:l,children:p,...b},v){const{size:x,density:N}=t.useContext(y);return n(i.Link,{ref:v,href:a,className:c(_,g[x],u[x],h[N??"default"][x],"py-2",l??""),...b,children:[f(s)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:s}):null,n("span",{className:"flex min-w-0 flex-col gap-0.5",children:[e("span",{className:`font-medium ${d[x]}`,children:r}),f(o)?e("span",{className:`text-(--neba-muted-fg) ${m[x]}`,children:o}):null,p]})]})});export function NavigationMenuItem({label:d,href:c,target:p,rel:m,startIcon:b,value:v,disabled:x=!1,columns:N=1,children:j}){const{size:_,density:k}=t.useContext(y),C=void 0!==c&&!f(j),$=[w,s[_],l[_],u[_],h[k??"default"][_],g[_]].join(" ");return e(i.Item,{value:v,children:C?n(i.Link,{href:c,target:p,rel:o(p,m),className:$,children:[f(b)?b:null,d]}):n(a,{children:[n(i.Trigger,{disabled:x,className:$,children:[f(b)?b:null,d,e(i.Icon,{className:"flex items-center [transition:rotate_var(--neba-duration)_var(--neba-ease)] data-[popup-open]:rotate-180",children:e(r,{})})]}),e(i.Content,{className:`grid gap-1 ${z[_]}`,style:N>1?{gridTemplateColumns:`repeat(${N}, minmax(0, 1fr))`}:void 0,children:j})]})})}export const NavigationMenu=/*@__PURE__*/t.forwardRef(function({size:a="md",color:r="primary",density:o="default",orientation:s="horizontal",value:l,defaultValue:d,onValueChange:c,delay:f,closeDelay:p,sideOffset:m=8,className:h,style:b,children:v,...N},w){const _=t.useMemo(()=>({size:a,density:o}),[a,o]),z=x(r,3);return e(y.Provider,{value:_,children:n(i.Root,{ref:w,orientation:s,value:l,defaultValue:d,onValueChange:e=>c?.(e),delay:f,closeDelay:p,className:h,style:{...z,...b},...N,children:[e(i.List,{className:["flex items-center","vertical"===s?"flex-col items-stretch":"flex-row",u[a]].join(" "),children:v}),e(i.Portal,{children:e(i.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",sideOffset:m,collisionPadding:12,children:e(i.Popup,{className:`${j} ${g[a]}`,style:z,children:e(i.Viewport,{})})})})]})})});
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import{NumberField as t}from"@base-ui/react/number-field";import{Field as a}from"@base-ui/react/field";import{numberMessages as l,useMessages as r}from"../../internal/i18n.js";import{MinusIcon as s,PlusIcon as i}from"../../internal/icons.js";import{keyHandler as o}from"../../internal/keys.js";import{controlHeightClasses as c,controlTextLeadingClasses as d,cx as m,disabledClasses as u,fieldReadOnlyClasses as p,fieldRestClasses as f,focusWithinRingClasses as b,gapClasses as h,hasContent as x,iconClasses as g,metaTextClasses as v,paddingXClasses as N,radiusClasses as j,stackGapClasses as y,surfaceSlots as w,transitionClasses as k}from"../../internal/styles.js";import{useStyleDefaults as S}from"../../internal/defaults.js";const _=["group relative flex w-full cursor-text items-center","[-webkit-tap-highlight-color:transparent]",k,"focus-within:[transition-duration:0ms]",b,g].join(" "),V=["inline-flex size-[1.7em] shrink-0 cursor-pointer items-center justify-center","rounded-(--neba-radius-xs) text-(--neba-muted-fg) select-none","[&_svg]:size-[0.9em] [&_svg]:shrink-0","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]","[transition:background-color_var(--neba-duration)_var(--neba-ease),color_var(--neba-duration)_var(--neba-ease)]","active:[transition-duration:0ms]","hover:bg-(--n-soft) hover:text-(--n-accent)","active:bg-(--n-soft-press)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1","disabled:cursor-not-allowed disabled:bg-transparent disabled:text-(--neba-disabled-fg)"].join(" ");export function NumberField(b){const{variant:g="outline",size:k="md",color:z="primary",density:C="default",elevation:I=0,value:O,defaultValue:D,onValueChange:L,onValueCommitted:W,min:q,max:F,step:R,largeStep:B,smallStep:E,snapOnStep:G,allowWheelScrub:K=!1,format:$,locale:A,steppers:H="end",incrementLabel:J,decrementLabel:M,label:P,description:Q,error:T,invalid:U,startIcon:X,endIcon:Y,fullWidth:Z=!1,disabled:ee=!1,readOnly:ne=!1,required:te=!1,name:ae,placeholder:le,id:re,className:se,classNames:ie,shortcuts:oe,style:ce,...de}=S(b,["size","density","variant","locale"]),me=r(l,"string"==typeof A?A:void 0),ue=x(T),pe=U??ue,fe=pe?"danger":z,be=N[C][k],he={end:`${be} pe-1`,split:"px-1",none:be},xe=e(t.Decrement,{"aria-label":M??me.decrease,className:m(V,ie?.stepper),children:e(s,{})}),ge=e(t.Increment,{"aria-label":J??me.increase,className:m(V,ie?.stepper),children:e(i,{})}),ve="none"!==H&&!ne;return n(a.Root,{disabled:ee,invalid:pe,className:m("flex-col align-top",y[k],Z?"flex w-full":"inline-flex",se??""),style:{...w(fe,I),...ce},...de,children:[P?e(a.Label,{className:m(v[k],"font-medium",ee?"text-(--neba-disabled-fg)":"text-(--neba-fg)",ie?.label),children:P}):null,e(t.Root,{id:re,name:ae,className:"contents",value:O,defaultValue:D,onValueChange:e=>L?.(e),onValueCommitted:e=>W?.(e),min:q,max:F,step:R,largeStep:B,smallStep:E,snapOnStep:G,allowWheelScrub:K,format:$,locale:A,disabled:ee,readOnly:ne,required:te,children:n(t.Group,{className:m(_,c[k],d[k],j[k],h[k],ve?he[H]:be,ee?u[g]:ne?p[g]:f[g],ie?.shell),children:[ve&&"split"===H?xe:null,X?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:X}):null,e(t.Input,{onKeyDown:o(oe),placeholder:le,className:["min-w-0 flex-1 self-stretch bg-transparent [font:inherit] text-inherit","[outline:none]","tabular-nums","split"===H&&ve?"text-center":"","placeholder:text-(--neba-muted-fg)","caret-(--n-accent) selection:bg-(--n-soft-press)","disabled:cursor-not-allowed",ie?.control].filter(Boolean).join(" ")}),Y?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:Y}):null,ve&&"end"===H?n("span",{className:"flex shrink-0 items-center gap-0.5",children:[xe,ge]}):null,ve&&"split"===H?ge:null]})}),Q?e(a.Description,{className:m(v[k],"text-(--neba-muted-fg)",ie?.description),children:Q}):null,e(a.Error,ue?{match:!0,className:m(v[k],"text-(--n-accent)",ie?.error),children:T}:{className:m(v[k],"text-(--n-accent)",ie?.error)})]})}
1
+ "use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import{NumberField as t}from"@base-ui/react/number-field";import{Field as a}from"@base-ui/react/field";import{numberMessages as l,useMessages as r}from"../../internal/i18n.js";import{MinusIcon as s,PlusIcon as i}from"../../internal/icons.js";import{keyHandler as o}from"../../internal/keys.js";import{controlTextLeadingClasses as c,cx as d,disabledClasses as m,fieldFocusTransitionClasses as u,fieldHeightClasses as p,fieldReadOnlyClasses as f,fieldRestClasses as b,fieldRingClasses as h,gapClasses as x,hasContent as g,iconClasses as v,metaTextClasses as N,paddingXClasses as j,radiusClasses as y,stackGapClasses as w,surfaceSlots as k,transitionClasses as S}from"../../internal/styles.js";import{useStyleDefaults as _}from"../../internal/defaults.js";const V=["group relative flex w-full cursor-text items-center","[-webkit-tap-highlight-color:transparent]",S,u,h,v].join(" "),z=["inline-flex size-[1.7em] shrink-0 cursor-pointer items-center justify-center","rounded-(--neba-radius-xs) text-(--neba-muted-fg) select-none","[&_svg]:size-[0.9em] [&_svg]:shrink-0","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]","[transition:background-color_var(--neba-duration)_var(--neba-ease),color_var(--neba-duration)_var(--neba-ease)]","active:[transition-duration:0ms]","hover:bg-(--n-soft) hover:text-(--n-accent)","active:bg-(--n-soft-press)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1","disabled:cursor-not-allowed disabled:bg-transparent disabled:text-(--neba-disabled-fg)"].join(" ");export function NumberField(u){const{variant:h="outline",size:v="md",color:S="primary",density:C="default",elevation:I=0,value:O,defaultValue:D,onValueChange:L,onValueCommitted:W,min:q,max:F,step:R,largeStep:B,smallStep:E,snapOnStep:G,allowWheelScrub:K=!1,format:$,locale:A,steppers:H="end",incrementLabel:J,decrementLabel:M,label:P,description:Q,error:T,invalid:U,startIcon:X,endIcon:Y,fullWidth:Z=!1,disabled:ee=!1,readOnly:ne=!1,required:te=!1,name:ae,placeholder:le,id:re,className:se,classNames:ie,shortcuts:oe,style:ce,...de}=_(u,["size","density","variant","locale"]),me=r(l,"string"==typeof A?A:void 0),ue=g(T),pe=U??ue,fe=pe?"danger":S,be=j[C][v],he={end:`${be} pe-1`,split:"px-1",none:be},xe=e(t.Decrement,{"aria-label":M??me.decrease,className:d(z,ie?.stepper),children:e(s,{})}),ge=e(t.Increment,{"aria-label":J??me.increase,className:d(z,ie?.stepper),children:e(i,{})}),ve="none"!==H&&!ne;return n(a.Root,{disabled:ee,invalid:pe,className:d("flex-col align-top",w[v],Z?"flex w-full":"inline-flex",se??""),style:{...k(fe,I),...ce},...de,children:[P?e(a.Label,{className:d(N[v],"font-medium",ee?"text-(--neba-disabled-fg)":"text-(--neba-fg)",ie?.label),children:P}):null,e(t.Root,{id:re,name:ae,className:"contents",value:O,defaultValue:D,onValueChange:e=>L?.(e),onValueCommitted:e=>W?.(e),min:q,max:F,step:R,largeStep:B,smallStep:E,snapOnStep:G,allowWheelScrub:K,format:$,locale:A,disabled:ee,readOnly:ne,required:te,children:n(t.Group,{className:d(V,p[v],c[v],y[v],x[v],ve?he[H]:be,ee?m[h]:ne?f[h]:b[h],ie?.shell),children:[ve&&"split"===H?xe:null,X?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:X}):null,e(t.Input,{onKeyDown:o(oe),placeholder:le,className:["min-w-0 flex-1 self-stretch bg-transparent [font:inherit] text-inherit","[outline:none]","tabular-nums","split"===H&&ve?"text-center":"","placeholder:text-(--neba-muted-fg)","caret-(--n-accent) selection:bg-(--n-soft-press)","disabled:cursor-not-allowed",ie?.control].filter(Boolean).join(" ")}),Y?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:Y}):null,ve&&"end"===H?n("span",{className:"flex shrink-0 items-center gap-0.5",children:[xe,ge]}):null,ve&&"split"===H?ge:null]})}),Q?e(a.Description,{className:d(N[v],"text-(--neba-muted-fg)",ie?.description),children:Q}):null,e(a.Error,ue?{match:!0,className:d(N[v],"text-(--n-accent)",ie?.error),children:T}:{className:d(N[v],"text-(--n-accent)",ie?.error)})]})}
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{Field as n}from"@base-ui/react/field";import{OTPField as l}from"@base-ui/react/otp-field";import{cx as r,disabledClasses as i,fieldReadOnlyClasses as s,fieldRestClasses as o,metaTextClasses as m,stackGapClasses as d,surfaceSlots as u,transitionClasses as c}from"../../internal/styles.js";import{useStyleDefaults as p}from"../../internal/defaults.js";const f={xs:"h-7 w-6",sm:"h-8 w-7",md:"h-10 w-8",lg:"h-12 w-10",xl:"h-14 w-12"},x={xs:"rounded-[0.3125rem]",sm:"rounded-[0.375rem]",md:"rounded-[0.4375rem]",lg:"rounded-[0.5625rem]",xl:"rounded-[0.6875rem]"},g={xs:"text-[0.8125rem]",sm:"text-[0.9375rem]",md:"text-[1.0625rem]",lg:"text-[1.25rem]",xl:"text-[1.5rem]"},h={default:{xs:"gap-1",sm:"gap-1",md:"gap-1.5",lg:"gap-2",xl:"gap-2.5"},compact:{xs:"gap-0.5",sm:"gap-0.5",md:"gap-1",lg:"gap-1",xl:"gap-1.5"}},b={numeric:"numeric",alpha:"alpha",alphanumeric:"alphanumeric",any:"none"};export const OtpField=/*@__PURE__*/t.forwardRef(function(y,v){const{variant:N="outline",size:V="md",color:w="primary",density:j="default",elevation:C=0,length:F=6,charset:M="numeric",mask:z=!1,groupSize:I,separator:O="–",value:R,defaultValue:S,onValueChange:k,onComplete:q,onValueInvalid:_,autoSubmit:A=!1,label:D,description:E,error:L,invalid:T,name:B,required:G=!1,disabled:H=!1,readOnly:J=!1,autoFocus:K=!1,className:P,style:Q,...U}=p(y,["size","density","variant"]),W=Math.min(12,Math.max(2,Math.round(F))),X=null!=L&&!1!==L&&""!==L,Y=T??X,Z=Y?"danger":w,$=r("text-center font-medium [font-family:inherit]",f[V],g[V],x[V],c,"caret-(--n-accent) selection:bg-(--n-soft-press)","focus:[outline:2px_solid_var(--n-ring)] focus:outline-offset-1","focus:[transition-duration:0ms]",H?i[N]:J?s[N]:o[N]),ee=I&&I>0?Math.round(I):0;return a(n.Root,{disabled:H,invalid:Y,className:r("inline-flex flex-col align-top",d[V],P),style:{...u(Z,C),...Q},children:[D?e(n.Label,{className:r(m[V],"font-medium",H?"text-(--neba-disabled-fg)":"text-(--neba-fg)"),children:D}):null,e(l.Root,{ref:v,length:W,validationType:b[M],mask:z,name:B,required:G,disabled:H,readOnly:J,autoSubmit:A,value:R,defaultValue:S,onValueChange:e=>k?.(e),onValueComplete:e=>q?.(e),onValueInvalid:e=>_?.(e),className:r("flex items-center",h[j][V]),...U,children:Array.from({length:W},(n,i)=>a(t.Fragment,{children:[ee>0&&i>0&&i%ee===0?e("span",{"aria-hidden":"true",className:r("select-none px-0.5 text-(--neba-muted-fg)",g[V]),children:O}):null,e(l.Input,{className:$,autoFocus:K&&0===i})]},i))}),E?e(n.Description,{className:r(m[V],"text-(--neba-muted-fg)"),children:E}):null,e(n.Error,X?{match:!0,className:r(m[V],"text-(--n-accent)"),children:L}:{className:r(m[V],"text-(--n-accent)")})]})});
1
+ "use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as t from"react";import{Field as n}from"@base-ui/react/field";import{OTPField as l}from"@base-ui/react/otp-field";import{cx as r,disabledClasses as i,fieldReadOnlyClasses as o,fieldRestClasses as s,metaTextClasses as m,stackGapClasses as d,surfaceSlots as u,transitionClasses as c}from"../../internal/styles.js";import{useStyleDefaults as p}from"../../internal/defaults.js";const f={xs:"h-7 w-6",sm:"h-8 w-7",md:"h-10 w-8",lg:"h-12 w-10",xl:"h-14 w-12"},x={xs:"rounded-[0.3125rem]",sm:"rounded-[0.375rem]",md:"rounded-[0.4375rem]",lg:"rounded-[0.5625rem]",xl:"rounded-[0.6875rem]"},g={xs:"text-[0.8125rem]",sm:"text-[0.9375rem]",md:"text-[1.0625rem]",lg:"text-[1.25rem]",xl:"text-[1.5rem]"},h={default:{xs:"gap-1",sm:"gap-1",md:"gap-1.5",lg:"gap-2",xl:"gap-2.5"},compact:{xs:"gap-0.5",sm:"gap-0.5",md:"gap-1",lg:"gap-1",xl:"gap-1.5"}},b={numeric:"numeric",alpha:"alpha",alphanumeric:"alphanumeric",any:"none"};export const OtpField=/*@__PURE__*/t.forwardRef(function(v,y){const{variant:N="outline",size:V="md",color:w="primary",density:j="default",elevation:C=0,length:F=6,charset:M="numeric",mask:_=!1,groupSize:z,separator:I="–",value:O,defaultValue:R,onValueChange:S,onComplete:k,onValueInvalid:q,autoSubmit:A=!1,label:D,description:E,error:L,invalid:T,name:B,required:G=!1,disabled:H=!1,readOnly:J=!1,autoFocus:K=!1,className:P,style:Q,...U}=p(v,["size","density","variant"]),W=Math.min(12,Math.max(2,Math.round(F))),X=null!=L&&!1!==L&&""!==L,Y=T??X,Z=Y?"danger":w,$=r("text-center font-medium [font-family:inherit]",f[V],g[V],x[V],c,"caret-(--n-accent) selection:bg-(--n-soft-press)","[outline:0_solid_var(--n-ring)] outline-offset-0 focus:[outline:2px_solid_var(--n-ring)]","focus:[transition-duration:var(--neba-duration)]",H?i[N]:J?o[N]:s[N]),ee=z&&z>0?Math.round(z):0;return a(n.Root,{disabled:H,invalid:Y,className:r("inline-flex flex-col align-top",d[V],P),style:{...u(Z,C),...Q},children:[D?e(n.Label,{className:r(m[V],"font-medium",H?"text-(--neba-disabled-fg)":"text-(--neba-fg)"),children:D}):null,e(l.Root,{ref:y,length:W,validationType:b[M],mask:_,name:B,required:G,disabled:H,readOnly:J,autoSubmit:A,value:O,defaultValue:R,onValueChange:e=>S?.(e),onValueComplete:e=>k?.(e),onValueInvalid:e=>q?.(e),className:r("flex items-center",h[j][V]),...U,children:Array.from({length:W},(n,i)=>a(t.Fragment,{children:[ee>0&&i>0&&i%ee===0?e("span",{"aria-hidden":"true",className:r("select-none px-0.5 text-(--neba-muted-fg)",g[V]),children:I}):null,e(l.Input,{className:$,autoFocus:K&&0===i})]},i))}),E?e(n.Description,{className:r(m[V],"text-(--neba-muted-fg)"),children:E}):null,e(n.Error,X?{match:!0,className:r(m[V],"text-(--n-accent)"),children:L}:{className:r(m[V],"text-(--n-accent)")})]})});
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Dialog as r}from"@base-ui/react/dialog";import{overlayMessages as t,useMessages as l}from"../../internal/i18n.js";import{cx as n,surfaceSlots as i}from"../../internal/styles.js";import{useStyleDefaults as s}from"../../internal/defaults.js";const o={scrim:"bg-(--neba-scrim) [backdrop-filter:blur(2px)]",blur:"[background-color:color-mix(in_oklab,var(--neba-scrim)_55%,transparent)] [backdrop-filter:blur(14px)_saturate(1.4)]",solid:"bg-(--neba-surface)",clear:""},c={start:"items-start",center:"items-center",end:"items-end"},m={xs:"p-3",sm:"p-4",md:"p-6",lg:"p-8",xl:"p-10"},p=["[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" ");export function Overlay(d){const{open:b,defaultOpen:f,onOpenChange:u,tone:x="scrim",dismissible:y=!1,modal:g=!0,align:j="center",size:h="md",color:k="primary",locale:O,label:_,className:v,style:z,children:N,...P}=s(d,["size","locale"]),w=l(t,O);return e(r.Root,{open:b,defaultOpen:f,modal:g,disablePointerDismissal:!y,onOpenChange:(e,a)=>{y||e||"escape-key"!==a.reason?u?.(e):a.cancel()},children:a(r.Portal,{children:[e(r.Backdrop,{className:`neba-portal fixed inset-0 z-50 ${p} ${o[x]}`}),e(r.Viewport,{className:["neba-portal fixed inset-0 z-50 flex justify-center",c[j],m[h]].join(" "),children:e(r.Popup,{"aria-label":_??w.label,className:n("flex max-h-full max-w-full flex-col items-center justify-center","[outline:none]",p,v??""),style:{...i(k,0),...z},...P,children:N})})]})})}
1
+ "use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Dialog as l}from"@base-ui/react/dialog";import{overlayMessages as r,useMessages as n}from"../../internal/i18n.js";import{cx as s,popupFadeClasses as t,surfaceSlots as i}from"../../internal/styles.js";import{useStyleDefaults as o}from"../../internal/defaults.js";const c={scrim:"bg-(--neba-scrim) [backdrop-filter:blur(2px)]",blur:"[background-color:color-mix(in_oklab,var(--neba-scrim)_55%,transparent)] [backdrop-filter:blur(14px)_saturate(1.4)]",solid:"bg-(--neba-surface)",clear:""},m={start:"items-start",center:"items-center",end:"items-end"},p={xs:"p-3",sm:"p-4",md:"p-6",lg:"p-8",xl:"p-10"};export function Overlay(d){const{open:b,defaultOpen:f,onOpenChange:u,tone:x="scrim",dismissible:g=!1,modal:j=!0,align:h="center",size:y="md",color:k="primary",locale:z,label:O,className:N,style:P,children:_,...v}=o(d,["size","locale"]),w=n(r,z);return e(l.Root,{open:b,defaultOpen:f,modal:j,disablePointerDismissal:!g,onOpenChange:(e,a)=>{g||e||"escape-key"!==a.reason?u?.(e):a.cancel()},children:a(l.Portal,{children:[e(l.Backdrop,{className:`neba-portal fixed inset-0 z-(--neba-z-portal) ${t} ${c[x]}`}),e(l.Viewport,{className:["neba-portal fixed inset-0 z-(--neba-z-portal) flex justify-center",m[h],p[y]].join(" "),children:e(l.Popup,{"aria-label":O??w.label,className:s("flex max-h-full max-w-full flex-col items-center justify-center","[outline:none]",t,N??""),style:{...i(k,0),...P},...v,children:_})})]})})}
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as t from"react";import{beginPointerDrag as r}from"../../internal/drag.js";import{observeResize as i}from"../../internal/observe.js";import{cx as o,toPixels as a,transitionClasses as l}from"../../internal/styles.js";import{useStyleDefaults as s}from"../../internal/defaults.js";const c=/*@__PURE__*/t.createContext({basis:null}),u={xs:"basis-1",sm:"basis-1.5",md:"basis-2",lg:"basis-2.5",xl:"basis-3"},f={xs:4,sm:6,md:8,lg:10,xl:12};function m(e,n,t){if(null!=e)return"number"==typeof e?n*e/100:a(e,{percentOf:n,relativeTo:t})}export const Panes=/*@__PURE__*/t.forwardRef(function(a,d){const{orientation:h="horizontal",resizable:p=!0,color:g="primary",size:x="md",onResize:v,onResizeEnd:b,className:z,style:w,children:y,...R}=s(a,["size"]),M=t.Children.toArray(y).filter(t.isValidElement),S=M.length,j=t.useRef(null),C=t.useCallback(e=>{j.current=e,"function"==typeof d?d(e):d&&(d.current=e)},[d]),k=t.useRef([]);k.current=M.map(e=>e.props);const[N,$]=t.useState(null),A=N&&N.length===S?N:null,E=t.useRef(null);E.current=A;const D="horizontal"===h,P=f[x]*Math.max(0,S-1);function I(e){const n=j.current,t=E.current;if(!p||!n||!t||void 0===t[e+1])return null;const r=n.getBoundingClientRect(),i=(D?r.width:r.height)-P;if(i<=0)return null;const o=k.current[e],a=k.current[e+1],l=t[e]*i,s=l+t[e+1]*i,c=Math.max(m(o?.minSize,i,n)??0,s-(m(a?.maxSize,i,n)??s)),u=Math.min(m(o?.maxSize,i,n)??s,s-(m(a?.minSize,i,n)??0));return u<c?null:{root:n,current:t,extent:i,start:l,pair:s,resize(n){const r=Math.min(u,Math.max(c,l+n)),o=[...t];return o[e]=r/i,o[e+1]=(s-r)/i,$(o),v?.(o.map(e=>100*e)),o}}}t.useEffect(()=>{const e=j.current;if(!e)return;const n=()=>{const n=e.getBoundingClientRect(),t=(D?n.width:n.height)-P;t<=0||$(n=>n&&n.length===S?n:function(e,n,t){const r=e.map(e=>m(e.defaultSize,n,t)),i=r.reduce((e,n)=>e+(n??0),0),o=r.filter(e=>void 0===e).length,a=o>0?Math.max(0,n-i)/o:0,l=r.map(e=>Math.max(0,e??a)),s=l.reduce((e,n)=>e+n,0);return s<=0?l.map(()=>1/Math.max(1,l.length)):l.map(e=>e/s)}(k.current,t,e))};return n(),i(e,n)},[S,D,P]);const B=t.useRef(null);t.useEffect(()=>()=>B.current?.(),[]);const F=o("group/handle relative z-1 flex shrink-0 grow-0 items-center justify-center",u[x],l,"[outline:none] focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-0",p?o(D?"cursor-col-resize":"cursor-row-resize","hover:bg-(--n-soft) data-[dragging]:bg-(--n-soft)"):"");return e("div",{ref:C,className:o("flex h-full w-full",D?"flex-row":"flex-col","min-h-0 min-w-0",z),style:{"--n-accent":`var(--neba-${g}-accent)`,"--n-soft":`var(--neba-${g}-soft)`,"--n-ring":`var(--neba-${g}-ring)`,...w},...R,children:M.map((i,a)=>n(t.Fragment,{children:[a>0?e("div",{role:"separator","aria-orientation":D?"vertical":"horizontal","aria-valuenow":A?Math.round(100*A[a-1]):void 0,"aria-valuemin":0,"aria-valuemax":100,"aria-disabled":!p||void 0,tabIndex:p?0:-1,className:F,onPointerDown:e=>{0===e.button&&function(e,n){const t=I(e);if(!t)return;const i=n.currentTarget,o=D?n.clientX:n.clientY,a=D&&"rtl"===getComputedStyle(t.root).direction?-1:1;let l=t.current;B.current=r({target:i,pointerId:n.pointerId,onMove:e=>{const n=D?e.clientX:e.clientY;l=t.resize((n-o)*a)},onEnd:()=>{B.current=null,b?.(l.map(e=>100*e))}})}(a-1,e)},onKeyDown:e=>{const n=D?"ArrowLeft":"ArrowUp",t=D?"ArrowRight":"ArrowDown";e.key!==n&&e.key!==t||(e.preventDefault(),function(e,n){const t=I(e);if(!t)return;const r=t.resize(n);b?.(r.map(e=>100*e))}(a-1,e.key===t?16:-16))},children:e("span",{"aria-hidden":"true",className:o("pointer-events-none bg-(--neba-border)",l,D?"h-full w-px":"h-px w-full",p?"group-hover/handle:bg-(--n-accent) group-focus-visible/handle:bg-(--n-accent) group-data-[dragging]/handle:bg-(--n-accent)":"")})}):null,e(c.Provider,{value:{basis:A?`calc((100% - ${P}px) * ${A[a].toFixed(6)})`:null},children:i})]},i.key??a))})});export const Pane=/*@__PURE__*/t.forwardRef(function({defaultSize:n,minSize:r,maxSize:i,className:a,style:l,children:s,...u},f){const{basis:m}=t.useContext(c);return e("div",{ref:f,className:o("relative min-h-0 min-w-0 overflow-auto",a),style:{flex:m?`0 0 ${m}`:"1 1 0%",...l},...u,children:s})});
1
+ "use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as t from"react";import{beginPointerDrag as r}from"../../internal/drag.js";import{observeResize as i}from"../../internal/observe.js";import{cx as o,toPixels as a,transitionClasses as l}from"../../internal/styles.js";import{useStyleDefaults as s}from"../../internal/defaults.js";const c=/*@__PURE__*/t.createContext({basis:null}),u={xs:"basis-1",sm:"basis-1.5",md:"basis-2",lg:"basis-2.5",xl:"basis-3"},f={xs:4,sm:6,md:8,lg:10,xl:12};function m(e,n,t){if(null!=e)return"number"==typeof e?n*e/100:a(e,{percentOf:n,relativeTo:t})}export const Panes=/*@__PURE__*/t.forwardRef(function(a,d){const{orientation:h="horizontal",resizable:p=!0,color:g="primary",size:x="md",onResize:v,onResizeEnd:b,className:z,style:w,children:y,...R}=s(a,["size"]),M=t.Children.toArray(y).filter(t.isValidElement),S=M.length,j=t.useRef(null),C=t.useCallback(e=>{j.current=e,"function"==typeof d?d(e):d&&(d.current=e)},[d]),k=t.useRef([]);k.current=M.map(e=>e.props);const[E,N]=t.useState(null),$=E&&E.length===S?E:null,A=t.useRef(null);t.useEffect(()=>{A.current=$});const D="horizontal"===h,P=f[x]*Math.max(0,S-1);function I(e){const n=j.current,t=A.current;if(!p||!n||!t||void 0===t[e+1])return null;const r=n.getBoundingClientRect(),i=(D?r.width:r.height)-P;if(i<=0)return null;const o=k.current[e],a=k.current[e+1],l=t[e]*i,s=l+t[e+1]*i,c=Math.max(m(o?.minSize,i,n)??0,s-(m(a?.maxSize,i,n)??s)),u=Math.min(m(o?.maxSize,i,n)??s,s-(m(a?.minSize,i,n)??0));return u<c?null:{root:n,current:t,extent:i,start:l,pair:s,resize(n){const r=Math.min(u,Math.max(c,l+n)),o=[...t];return o[e]=r/i,o[e+1]=(s-r)/i,N(o),v?.(o.map(e=>100*e)),o}}}t.useEffect(()=>{const e=j.current;if(!e)return;const n=()=>{const n=e.getBoundingClientRect(),t=(D?n.width:n.height)-P;t<=0||N(n=>n&&n.length===S?n:function(e,n,t){const r=e.map(e=>m(e.defaultSize,n,t)),i=r.reduce((e,n)=>e+(n??0),0),o=r.filter(e=>void 0===e).length,a=o>0?Math.max(0,n-i)/o:0,l=r.map(e=>Math.max(0,e??a)),s=l.reduce((e,n)=>e+n,0);return s<=0?l.map(()=>1/Math.max(1,l.length)):l.map(e=>e/s)}(k.current,t,e))};return n(),i(e,n)},[S,D,P]);const B=t.useRef(null);t.useEffect(()=>()=>B.current?.(),[]);const F=o("group/handle relative z-1 flex shrink-0 grow-0 items-center justify-center",u[x],l,"[outline:none] focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-0",p?o(D?"cursor-col-resize":"cursor-row-resize","hover:bg-(--n-soft) data-[dragging]:bg-(--n-soft)"):"");return e("div",{ref:C,className:o("flex h-full w-full",D?"flex-row":"flex-col","min-h-0 min-w-0",z),style:{"--n-accent":`var(--neba-${g}-accent)`,"--n-soft":`var(--neba-${g}-soft)`,"--n-ring":`var(--neba-${g}-ring)`,...w},...R,children:M.map((i,a)=>n(t.Fragment,{children:[a>0?e("div",{role:"separator","aria-orientation":D?"vertical":"horizontal","aria-valuenow":$?Math.round(100*$[a-1]):void 0,"aria-valuemin":0,"aria-valuemax":100,"aria-disabled":!p||void 0,tabIndex:p?0:-1,className:F,onPointerDown:e=>{0===e.button&&function(e,n){const t=I(e);if(!t)return;const i=n.currentTarget,o=D?n.clientX:n.clientY,a=D&&"rtl"===getComputedStyle(t.root).direction?-1:1;let l=t.current;B.current=r({target:i,pointerId:n.pointerId,onMove:e=>{const n=D?e.clientX:e.clientY;l=t.resize((n-o)*a)},onEnd:()=>{B.current=null,b?.(l.map(e=>100*e))}})}(a-1,e)},onKeyDown:e=>{const n=D?"ArrowLeft":"ArrowUp",t=D?"ArrowRight":"ArrowDown";e.key!==n&&e.key!==t||(e.preventDefault(),function(e,n){const t=I(e);if(!t)return;const r=t.resize(n);b?.(r.map(e=>100*e))}(a-1,e.key===t?16:-16))},children:e("span",{"aria-hidden":"true",className:o("pointer-events-none bg-(--neba-border)",l,D?"h-full w-px":"h-px w-full",p?"group-hover/handle:bg-(--n-accent) group-focus-visible/handle:bg-(--n-accent) group-data-[dragging]/handle:bg-(--n-accent)":"")})}):null,e(c.Provider,{value:{basis:$?`calc((100% - ${P}px) * ${$[a].toFixed(6)})`:null},children:i})]},i.key??a))})});export const Pane=/*@__PURE__*/t.forwardRef(function({defaultSize:n,minSize:r,maxSize:i,className:a,style:l,children:s,...u},f){const{basis:m}=t.useContext(c);return e("div",{ref:f,className:o("relative min-h-0 min-w-0 overflow-auto",a),style:{flex:m?`0 0 ${m}`:"1 1 0%",...l},...u,children:s})});
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{ChartDataTable as n,ChartLegendBar as l,ChartStatus as i,ChartSurface as r,ChartTooltipPanel as o,useMeasuredWidth as s,useVisibility as d}from"../../internal/chart-frame.js";import{arcPath as u,categoryAt as m,chartFontSizes as c,compactNumber as h,formatCategory as v,markGap as f,plotHeights as p,seriesColor as b,toValue as x}from"../../internal/chart.js";import{numberFormatter as g}from"../../internal/format.js";import{cx as y,metaTextClasses as M}from"../../internal/styles.js";import{chartMessages as j,emptyMessages as N,useMessages as w}from"../../internal/i18n.js";import{useStyleDefaults as z}from"../../internal/defaults.js";const I={pie:0,donut:.62,semi:.62};export function PieChart(P){const{data:k,categories:A,shape:$="pie",startAngle:L=0,center:S,valueLabels:_="none",height:B,format:E,locale:R,label:C,legend:D,tooltip:O,empty:K,size:V="md",variant:W="text",padded:q=!1,className:F,...G}=z(P,["size","variant","locale"]),H=a.useRef(null),J=s(H),Q=w(N,R),T=w(j,R),U=a.useId(),X=a.useCallback(e=>E?g(R,E).format(e):h(e,R),[E,R]),Y=a.useMemo(()=>k.map(x),[k]),Z=a.useMemo(()=>Y.map((e,t)=>({name:v(m(t,A,[Y]),R),data:[k[t]],color:e.color})),[Y,A,k,R]),ee=d(Z),[te,ae]=a.useState(null),ne=Z.map((e,t)=>b(e,t)),le=Y.reduce((e,t,a)=>ee.visible[a]&&null!==t.value?e+Math.abs(t.value):e,0),ie="semi"===$,re="number"==typeof B?B:p[V],oe=c[V],se=!1===D?{interactive:!1}:!0===D||void 0===D?{}:D,de=!1!==D&&Z.length>1,ue=se.side??"bottom",me=!1===O?{mode:"none"}:!0===O||void 0===O?{}:O,ce="none"===me.mode,he=J/2,ve=Math.max(0,Math.min(J/2,ie?re:re/2)-2),fe=ie?Math.min(re,re/2+ve/2):re/2,pe=ve*I[$],be=le<=0||ve<=0,xe=ve>0?Math.min(4,f/ve*(180/Math.PI)):0,ge=ie?180:360,ye=[];let Me=ie?-90:L;Y.forEach((e,t)=>{if(!ee.visible[t]||null===e.value||0===e.value)return;const a=Math.abs(e.value)/le,n=a*ge;ye.push({index:t,start:Me,end:Me+n,value:e.value,share:a}),Me+=n});const je=null===te?[]:[{seriesIndex:te,name:Z[te]?.name,color:Y[te]?.color??ne[te],value:Y[te]?.value??null,formatted:`${X(Y[te]?.value??0)} · ${Math.round(10*(Math.abs(Y[te]?.value??0)/le*100+Number.EPSILON))/10}%`,label:Y[te]?.label}];return t(r,{...G,size:V,variant:W,padded:q,className:F,legendSide:ue,legend:de?e(l,{series:Z,colors:ne,options:se,visibility:ee,size:V,values:se.showValue?Y.map(e=>null===e.value?void 0:X(e.value)):void 0}):null,table:be?null:e(n,{id:U,caption:C,categories:Z.map(e=>e.name??""),series:[{name:C,data:k}],values:[Y],format:X,locale:R}),children:[t("div",{ref:H,role:"img",tabIndex:be?void 0:0,"aria-label":C??T.label,"aria-describedby":be?void 0:U,onPointerLeave:()=>ae(null),onBlur:()=>ae(null),onKeyDown:e=>{if("ArrowRight"!==e.key&&"ArrowLeft"!==e.key)return;const t=ye.map(e=>e.index);if(0===t.length)return;const a=null===te?-1:t.indexOf(te),n="ArrowRight"===e.key?a+1:a-1;ae(t[(n+t.length)%t.length]),e.preventDefault()},className:y("relative w-full rounded-(--neba-radius-xs)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"),style:{height:re},children:[be?e("div",{className:y("flex h-full items-center justify-center text-(--neba-muted-fg)",M[V]),children:K??Q.title}):J>0?t("svg",{width:J,height:re,viewBox:`0 0 ${J} ${re}`,"aria-hidden":"true",className:"block",children:[ye.map(t=>{const a=null!==ee.hovered&&ee.hovered!==t.index||null!==te&&te!==t.index,n=t.end-t.start>2*xe?xe/2:0;return e("path",{d:u(he,fe,ve,pe,t.start+n,t.end-n),fill:Y[t.index].color??ne[t.index],opacity:a?.32:1,onPointerEnter:ce?void 0:()=>ae(t.index),className:"[transition:opacity_var(--neba-duration)_var(--neba-ease)]"},t.index)}),"all"===_?ye.map(t=>{const a=((t.start+t.end)/2-90)*(Math.PI/180),n=pe>0?(pe+ve)/2:.68*ve,l=`${Math.round(100*t.share)}%`;return(t.end-t.start)*(Math.PI/180)*n<2*oe||ve-pe<1.6*oe?null:e("text",{x:he+n*Math.cos(a),y:fe+n*Math.sin(a),textAnchor:"middle",dominantBaseline:"central",fontSize:oe,fontWeight:600,fill:"var(--neba-surface)",className:"tabular-nums",children:l},t.index)}):null]}):null,S&&pe>0?e("div",{className:"pointer-events-none absolute flex flex-col items-center justify-center text-center",style:{left:he-pe,top:fe-pe,width:2*pe,height:ie?pe:2*pe},children:S}):null,null===te||ce?null:me.render?e("div",{className:"pointer-events-none absolute top-0 left-1/2 z-10",children:me.render({index:te,category:Z[te]?.name??te,items:je})}):e(o,{heading:Z[te]?.name,items:je,x:he,y:8,flip:!1,size:V})]}),ce?null:e(i,{heading:null===te?void 0:Z[te]?.name,items:je})]})}
1
+ "use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{ChartDataTable as l,ChartLegendBar as n,ChartStatus as i,ChartSurface as r,ChartTooltipPanel as s,markTransitionClasses as o,useMeasuredWidth as d,useVisibility as u}from"../../internal/chart-frame.js";import{arcPath as m,categoryAt as c,chartFontSizes as h,compactNumber as v,formatCategory as f,markGap as p,plotHeights as x,seriesColor as b,toValue as g}from"../../internal/chart.js";import{numberFormatter as y}from"../../internal/format.js";import{cx as M,metaTextClasses as j}from"../../internal/styles.js";import{chartMessages as N,emptyMessages as w,useMessages as z}from"../../internal/i18n.js";import{useStyleDefaults as I}from"../../internal/defaults.js";const P={pie:0,donut:.62,semi:.62};export function PieChart(k){const{data:A,categories:$,shape:L="pie",startAngle:S=0,center:B,valueLabels:E="none",height:R,format:C,locale:D,label:O,legend:_,tooltip:K,empty:V,size:W="md",variant:q="text",padded:F=!1,className:G,...H}=I(k,["size","variant","locale"]),J=a.useRef(null),Q=d(J),T=z(w,D),U=z(N,D),X=a.useId(),Y=a.useCallback(e=>C?y(D,C).format(e):v(e,D),[C,D]),Z=a.useMemo(()=>A.map(g),[A]),ee=a.useMemo(()=>Z.map((e,t)=>({name:f(c(t,$,[Z]),D),data:[A[t]],color:e.color})),[Z,$,A,D]),te=u(ee),[ae,le]=a.useState(null),ne=ee.map((e,t)=>b(e,t)),ie=Z.reduce((e,t,a)=>te.visible[a]&&null!==t.value?e+Math.abs(t.value):e,0),re="semi"===L,se="number"==typeof R?R:x[W],oe=h[W],de=!1===_?{interactive:!1}:!0===_||void 0===_?{}:_,ue=!1!==_&&ee.length>1,me=de.side??"bottom",ce=!1===K?{mode:"none"}:!0===K||void 0===K?{}:K,he="none"===ce.mode,ve=Q/2,fe=Math.max(0,Math.min(Q/2,re?se:se/2)-2),pe=re?Math.min(se,se/2+fe/2):se/2,xe=fe*P[L],be=ie<=0||fe<=0,ge=fe>0?Math.min(4,p/fe*(180/Math.PI)):0,ye=re?180:360,Me=[];let je=re?-90:S;Z.forEach((e,t)=>{if(!te.visible[t]||null===e.value||0===e.value)return;const a=Math.abs(e.value)/ie,l=a*ye;Me.push({index:t,start:je,end:je+l,value:e.value,share:a}),je+=l});const Ne=null===ae?[]:[{seriesIndex:ae,name:ee[ae]?.name,color:Z[ae]?.color??ne[ae],value:Z[ae]?.value??null,formatted:`${Y(Z[ae]?.value??0)} · ${Math.round(10*(Math.abs(Z[ae]?.value??0)/ie*100+Number.EPSILON))/10}%`,label:Z[ae]?.label}];return t(r,{...H,size:W,variant:q,padded:F,className:G,legendSide:me,legend:ue?e(n,{series:ee,colors:ne,options:de,visibility:te,size:W,values:de.showValue?Z.map(e=>null===e.value?void 0:Y(e.value)):void 0}):null,table:be?null:e(l,{id:X,caption:O,categories:ee.map(e=>e.name??""),series:[{name:O,data:A}],values:[Z],format:Y,locale:D}),children:[t("div",{ref:J,role:"img",tabIndex:be?void 0:0,"aria-label":O??U.label,"aria-describedby":be?void 0:X,onPointerLeave:()=>le(null),onBlur:()=>le(null),onKeyDown:e=>{if("ArrowRight"!==e.key&&"ArrowLeft"!==e.key)return;const t=Me.map(e=>e.index);if(0===t.length)return;const a=null===ae?-1:t.indexOf(ae),l="ArrowRight"===e.key?a+1:a-1;le(t[(l+t.length)%t.length]),e.preventDefault()},className:M("relative w-full rounded-(--neba-radius-xs)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"),style:{height:se},children:[be?e("div",{className:M("flex h-full items-center justify-center text-(--neba-muted-fg)",j[W]),children:V??T.title}):Q>0?t("svg",{width:Q,height:se,viewBox:`0 0 ${Q} ${se}`,"aria-hidden":"true",className:"block",children:[Me.map(t=>{const a=null!==te.hovered&&te.hovered!==t.index||null!==ae&&ae!==t.index,l=t.end-t.start>2*ge?ge/2:0;return e("path",{d:m(ve,pe,fe,xe,t.start+l,t.end-l),fill:Z[t.index].color??ne[t.index],opacity:a?.32:1,onPointerEnter:he?void 0:()=>le(t.index),className:o},t.index)}),"all"===E?Me.map(t=>{const a=((t.start+t.end)/2-90)*(Math.PI/180),l=xe>0?(xe+fe)/2:.68*fe,n=`${Math.round(100*t.share)}%`;return(t.end-t.start)*(Math.PI/180)*l<2*oe||fe-xe<1.6*oe?null:e("text",{x:ve+l*Math.cos(a),y:pe+l*Math.sin(a),textAnchor:"middle",dominantBaseline:"central",fontSize:oe,fontWeight:600,fill:"var(--neba-surface)",className:"tabular-nums",children:n},t.index)}):null]}):null,B&&xe>0?e("div",{className:"pointer-events-none absolute flex flex-col items-center justify-center text-center",style:{left:ve-xe,top:pe-xe,width:2*xe,height:re?xe:2*xe},children:B}):null,null===ae||he?null:ce.render?e("div",{className:"pointer-events-none absolute top-0 left-1/2 z-10",children:ce.render({index:ae,category:ee[ae]?.name??ae,items:Ne})}):e(s,{heading:ee[ae]?.name,items:Ne,x:ve,y:8,flip:!1,size:W})]}),he?null:e(i,{heading:null===ae?void 0:ee[ae]?.name,items:Ne})]})}
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Popover as t}from"@base-ui/react/popover";import{boxPaddingXClasses as o,boxPaddingYClasses as s}from"../box/Box.js";import{actionMessages as n,useMessages as i}from"../../internal/i18n.js";import{CloseIcon as l}from"../../internal/icons.js";import{cx as r,hasContent as d,metaTextClasses as c,radiusClasses as m,sheetBodyClasses as p,sheetHeaderGapClasses as f,sheetSectionGapClasses as u,sheetTitleClasses as h,surfaceClasses as x,surfaceSlots as b}from"../../internal/styles.js";import{useStyleDefaults as g}from"../../internal/defaults.js";const v={xs:"max-w-56",sm:"max-w-64",md:"max-w-80",lg:"max-w-96",xl:"max-w-lg"},w=[x,"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(" "),y={xs:8,sm:9,md:10,lg:11,xl:12};export const PopoverClose=t.Close;export function Popover(x){const{size:j="md",color:N="primary",density:_="default",trigger:k,title:O,description:z,children:C,side:P="bottom",align:$="center",sideOffset:B=6,alignOffset:L=0,arrow:M=!1,open:T,defaultOpen:W,onOpenChange:A,modal:D=!1,dismissible:E=!0,showClose:R=!1,locale:q,closeLabel:F,width:G,className:H,style:I,...J}=g(x,["size","density","locale"]),K=i(n,q),Q=o[_][j],S=s[_][j],U=y[j],V=d(O)||d(z);return a(t.Root,{open:T,defaultOpen:W,modal:D,onOpenChange:(e,a)=>{E||e||"escape-key"!==a.reason&&"outside-press"!==a.reason&&"focus-out"!==a.reason?A?.(e):a.cancel()},children:[k?e(t.Trigger,{render:k}):null,e(t.Portal,{children:e(t.Positioner,{className:"neba-portal z-50 [outline:none]",side:P,align:$,sideOffset:B,alignOffset:L,children:a(t.Popup,{className:r(w,m[j],p[j],u[j],Q,S,void 0===G?v[j]:"",H??""),style:{...b(N,3),...void 0===G?null:{maxWidth:"number"==typeof G?`${G}px`:G},...I},...J,children:[M?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:U,height:U/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,V||R?a("div",{className:"flex shrink-0 items-start gap-3",children:[a("div",{className:`flex min-w-0 flex-1 flex-col ${f[j]}`,children:[d(O)?e(t.Title,{className:`m-0 font-semibold ${h[j]}`,children:O}):null,d(z)?e(t.Description,{className:`m-0 text-(--neba-muted-fg) ${c[j]}`,children:z}):null]}),R?e(t.Close,{"aria-label":F??K.close,className:["flex size-[1.6em] shrink-0 cursor-pointer items-center justify-center","rounded-full text-(--neba-muted-fg)","[&_svg]:size-[1.1em] [&_svg]:shrink-0","[transition:background-color_var(--neba-duration)_var(--neba-ease),color_var(--neba-duration)_var(--neba-ease)]","hover:bg-(--n-soft) hover:text-(--neba-fg)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"].join(" "),children:e(l,{})}):null]}):null,d(C)?e("div",{className:"min-w-0",children:C}):null]})})})]})}
1
+ "use client";import{jsx as e,jsxs as o}from"react/jsx-runtime";import{Popover as a}from"@base-ui/react/popover";import{boxPaddingXClasses as s,boxPaddingYClasses as t}from"../box/Box.js";import{actionMessages as l,useMessages as n}from"../../internal/i18n.js";import{CloseIcon as r}from"../../internal/icons.js";import{cx as i,hasContent as d,metaTextClasses as c,popupFadeClasses as m,radiusClasses as f,sheetBodyClasses as p,sheetHeaderGapClasses as u,sheetSectionGapClasses as h,sheetTitleClasses as x,surfaceClasses as b,surfaceSlots as g}from"../../internal/styles.js";import{useStyleDefaults as v}from"../../internal/defaults.js";const w={xs:"max-w-56",sm:"max-w-64",md:"max-w-80",lg:"max-w-96",xl:"max-w-lg"},j=[b,"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]",m].join(" "),N={xs:8,sm:9,md:10,lg:11,xl:12};export const PopoverClose=a.Close;export function Popover(m){const{size:b="md",color:k="primary",density:y="default",trigger:O,title:_,description:z,children:C,side:P="bottom",align:$="center",sideOffset:B=6,alignOffset:L=0,arrow:M=!1,open:T,defaultOpen:W,onOpenChange:A,modal:D=!1,dismissible:E=!0,showClose:R=!1,locale:q,closeLabel:F,width:G,className:H,style:I,...J}=v(m,["size","density","locale"]),K=n(l,q),Q=s[y][b],S=t[y][b],U=N[b],V=d(_)||d(z);return o(a.Root,{open:T,defaultOpen:W,modal:D,onOpenChange:(e,o)=>{E||e||"escape-key"!==o.reason&&"outside-press"!==o.reason&&"focus-out"!==o.reason?A?.(e):o.cancel()},children:[O?e(a.Trigger,{render:O}):null,e(a.Portal,{children:e(a.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",side:P,align:$,sideOffset:B,alignOffset:L,children:o(a.Popup,{className:i(j,f[b],p[b],h[b],Q,S,void 0===G?w[b]:"",H??""),style:{...g(k,3),...void 0===G?null:{maxWidth:"number"==typeof G?`${G}px`:G},...I},...J,children:[M?e(a.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:o("svg",{width:U,height:U/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,V||R?o("div",{className:"flex shrink-0 items-start gap-3",children:[o("div",{className:`flex min-w-0 flex-1 flex-col ${u[b]}`,children:[d(_)?e(a.Title,{className:`m-0 font-semibold ${x[b]}`,children:_}):null,d(z)?e(a.Description,{className:`m-0 text-(--neba-muted-fg) ${c[b]}`,children:z}):null]}),R?e(a.Close,{"aria-label":F??K.close,className:["flex size-[1.6em] shrink-0 cursor-pointer items-center justify-center","rounded-full text-(--neba-muted-fg)","[&_svg]:size-[1.1em] [&_svg]:shrink-0","[transition:background-color_var(--neba-duration)_var(--neba-ease),color_var(--neba-duration)_var(--neba-ease)]","hover:bg-(--n-soft) hover:text-(--neba-fg)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"].join(" "),children:e(r,{})}):null]}):null,d(C)?e("div",{className:"min-w-0",children:C}):null]})})})]})}
@@ -1,11 +1,20 @@
1
1
  import * as React from 'react';
2
- import { type ProgressSharedProps } from '../../internal/progress.js';
2
+ import { type ProgressSharedProps, type ProgressThickness } from '../../internal/progress.js';
3
3
  import type { NebaColor, NebaSize } from '../../types.js';
4
4
  export interface ProgressCircularProps extends ProgressSharedProps {
5
5
  /** Diameter of the ring. Sits just under the control ladder at every step. */
6
6
  size?: NebaSize;
7
7
  /** @default 'primary' */
8
8
  color?: NebaColor;
9
+ /**
10
+ * The ring's stroke in pixels, when the step's own is not the one you want —
11
+ * a heavier dial for a reading a screen is actually about. `size` still sets
12
+ * the diameter, so this is how thick the ring is and not how big.
13
+ *
14
+ * Held to less than half the radius: a stroke past that closes the hole and
15
+ * the ring stops being one.
16
+ */
17
+ thickness?: ProgressThickness;
9
18
  }
10
19
  /**
11
20
  * A ring that fills, and the one to reach for when there is no room for a bar —
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{Progress as s}from"@base-ui/react/progress";import{progressAriaText as t,progressFraction as n,progressSlots as i,progressText as l,ringDiameters as o,ringStrokes as c}from"../../internal/progress.js";import{cx as m,gapClasses as f,metaTextClasses as u}from"../../internal/styles.js";import{useStyleDefaults as h}from"../../internal/defaults.js";export const ProgressCircular=/*@__PURE__*/a.forwardRef(function(a,d){const{size:x="md",color:p="primary",value:k=null,min:b=0,max:g=100,label:v,showValue:y=!1,format:$,className:j,style:N,...w}=h(a,["size"]),V=n(k,b,g),z=null===V,D=void 0!==$,L=o[x],P=c[x],R=L/2,W=R-P/2,_=2*Math.PI*W,A=z?`${.28*_} ${_}`:`${_}`,B=z?0:_*(1-V);return r(s.Root,{ref:d,value:k??null,min:b,max:g,format:$,getAriaValueText:t(V,D),className:m("inline-flex items-center",f[x],u[x],j??""),style:{...i(p),...N},...w,children:[r("svg",{className:z?"neba-ring-spin shrink-0":"shrink-0",width:L,height:L,viewBox:`0 0 ${L} ${L}`,fill:"none","aria-hidden":"true",children:[e("circle",{cx:R,cy:R,r:W,stroke:"var(--n-soft)",strokeWidth:P}),e("circle",{cx:R,cy:R,r:W,stroke:"var(--n-accent)",strokeWidth:P,strokeLinecap:"round",strokeDasharray:A,strokeDashoffset:B,transform:`rotate(-90 ${R} ${R})`,className:"[transition:stroke-dashoffset_var(--neba-duration-fill)_var(--neba-ease)]"})]}),v?e(s.Label,{className:"min-w-0 truncate text-(--neba-fg)",children:v}):null,y?e(s.Value,{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:e=>l(V,e,D)}):null]})});
1
+ "use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{Progress as s}from"@base-ui/react/progress";import{progressAriaText as t,progressFraction as n,progressSlots as i,progressText as l,ringDiameters as o,ringStrokes as m}from"../../internal/progress.js";import{cx as c,gapClasses as f,metaTextClasses as u}from"../../internal/styles.js";import{useStyleDefaults as h}from"../../internal/defaults.js";export const ProgressCircular=/*@__PURE__*/a.forwardRef(function(a,d){const{size:x="md",color:k="primary",value:p=null,min:b=0,max:g=100,label:v,showValue:y=!1,format:$,thickness:j,className:N,style:w,...M}=h(a,["size"]),V=n(p,b,g),z=null===V,D=void 0!==$,L=o[x],P=L/2,R=Math.min(Math.max(j??m[x],.5),P),W=P-R/2,_=2*Math.PI*W,A=z?`${.28*_} ${_}`:`${_}`,B=z?0:_*(1-V);return r(s.Root,{ref:d,value:p??null,min:b,max:g,format:$,getAriaValueText:t(V,D),className:c("inline-flex items-center",f[x],u[x],N??""),style:{...i(k),...w},...M,children:[r("svg",{className:z?"neba-ring-spin shrink-0":"shrink-0",width:L,height:L,viewBox:`0 0 ${L} ${L}`,fill:"none","aria-hidden":"true",children:[e("circle",{cx:P,cy:P,r:W,stroke:"var(--n-soft)",strokeWidth:R}),e("circle",{cx:P,cy:P,r:W,stroke:"var(--n-accent)",strokeWidth:R,strokeLinecap:"round",strokeDasharray:A,strokeDashoffset:B,transform:`rotate(-90 ${P} ${P})`,className:"[transition:stroke-dashoffset_var(--neba-duration-fill)_var(--neba-ease)]"})]}),v?e(s.Label,{className:"min-w-0 truncate text-(--neba-fg)",children:v}):null,y?e(s.Value,{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:e=>l(V,e,D)}):null]})});
@@ -1,11 +1,17 @@
1
1
  import * as React from 'react';
2
- import { type ProgressSharedProps } from '../../internal/progress.js';
2
+ import { type ProgressSharedProps, type ProgressThickness } from '../../internal/progress.js';
3
3
  import type { NebaColor, NebaSize } from '../../types.js';
4
4
  export interface ProgressLinearProps extends ProgressSharedProps {
5
5
  /** Thickness of the groove. Nothing else on a bar has a size. */
6
6
  size?: NebaSize;
7
7
  /** @default 'primary' */
8
8
  color?: NebaColor;
9
+ /**
10
+ * The groove's thickness in pixels, when the step's own is not the one you
11
+ * want — a heavier bar for a page that is about the one number. `size` still
12
+ * sets the type scale beside it.
13
+ */
14
+ thickness?: ProgressThickness;
9
15
  }
10
16
  /**
11
17
  * A bar that fills. The workhorse: it is the only one of the three that can
@@ -1 +1 @@
1
- "use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as a from"react";import{Progress as r}from"@base-ui/react/progress";import{barThicknessClasses as s,progressAriaText as n,progressFraction as t,progressSlots as i,progressText as o}from"../../internal/progress.js";import{cx as m,metaTextClasses as u,stackGapClasses as f}from"../../internal/styles.js";import{useStyleDefaults as c}from"../../internal/defaults.js";export const ProgressLinear=/*@__PURE__*/a.forwardRef(function(a,d){const{size:b="md",color:p="primary",value:x=null,min:j=0,max:g=100,label:h,showValue:w=!1,format:v,className:N,style:y,...V}=c(a,["size"]),k=t(x,j,g),z=null===k,L=void 0!==v;return l(r.Root,{ref:d,value:x??null,min:j,max:g,format:v,getAriaValueText:n(k,L),className:m("flex w-full flex-col",f[b],N??""),style:{...i(p),...y},...V,children:[h||w?l("div",{className:["flex items-baseline gap-2",h?"justify-between":"justify-end",u[b]].join(" "),children:[h?e(r.Label,{className:"min-w-0 truncate text-(--neba-fg)",children:h}):null,w?e(r.Value,{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:e=>o(k,e,L)}):null]}):null,e(r.Track,{className:`relative w-full overflow-hidden rounded-full bg-(--n-soft) ${s[b]}`,children:e(r.Indicator,{className:["absolute rounded-full bg-(--n-fill)",z?"neba-sweep":"top-0 [transition:width_var(--neba-duration-fill)_var(--neba-ease)]"].join(" ")})})]})});
1
+ "use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as a from"react";import{Progress as r}from"@base-ui/react/progress";import{barThicknessClasses as s,progressAriaText as t,progressFraction as n,progressSlots as i,progressText as o}from"../../internal/progress.js";import{cx as m,metaTextClasses as u,stackGapClasses as f}from"../../internal/styles.js";import{useStyleDefaults as c}from"../../internal/defaults.js";export const ProgressLinear=/*@__PURE__*/a.forwardRef(function(a,d){const{size:b="md",color:p="primary",value:x=null,min:h=0,max:g=100,label:j,showValue:v=!1,format:w,thickness:y,className:N,style:k,...V}=c(a,["size"]),z=n(x,h,g),L=null===z,R=void 0!==w;return l(r.Root,{ref:d,value:x??null,min:h,max:g,format:w,getAriaValueText:t(z,R),className:m("flex w-full flex-col",f[b],N??""),style:{...i(p),...k},...V,children:[j||v?l("div",{className:["flex items-baseline gap-2",j?"justify-between":"justify-end",u[b]].join(" "),children:[j?e(r.Label,{className:"min-w-0 truncate text-(--neba-fg)",children:j}):null,v?e(r.Value,{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:e=>o(z,e,R)}):null]}):null,e(r.Track,{className:`relative w-full overflow-hidden rounded-full bg-(--n-soft) ${s[b]}`,style:void 0===y?void 0:{height:`${y}px`},children:e(r.Indicator,{className:["absolute rounded-full bg-(--n-fill)",L?"neba-sweep":"top-0 [transition:width_var(--neba-duration-fill)_var(--neba-ease)]"].join(" ")})})]})});
@@ -1 +1 @@
1
- "use client";import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{DirectionProvider as r}from"@base-ui/react/direction-provider";import{DefaultsContext as o}from"../../internal/defaults.js";import{useMediaQuery as c}from"../../internal/media.js";const n=/*@__PURE__*/t.createContext(null);export function colorSchemeScript(e={}){const t=e.storageKey??"neba-color-scheme",r=e.defaultColorScheme??"system";return`(function(){try{var s=localStorage.getItem(${JSON.stringify(t)})||${JSON.stringify(r)};if(s==='system'){s=matchMedia('(prefers-color-scheme: dark)').matches?'dark':'light'}document.documentElement.setAttribute('data-theme',s)}catch(e){}})()`}export function NebaProvider({children:l,defaults:s,colorScheme:a,defaultColorScheme:i="system",onColorSchemeChange:m,storageKey:u="neba-color-scheme",colorSchemeElement:d,direction:h}){const[f,S]=t.useState(()=>function(e){if(!1===e||"undefined"==typeof localStorage)return null;try{const t=localStorage.getItem(e);return"light"===t||"dark"===t||"system"===t?t:null}catch{return null}}(u)??i),g=a??f,y=c("(prefers-color-scheme: dark)"),p="system"===g?y?"dark":"light":g,C=t.useCallback(e=>{if(void 0===a&&S(e),!1!==u)try{localStorage.setItem(u,e)}catch{}m?.(e)},[a,u,m]);t.useEffect(()=>{const e=d?d():document.documentElement;e&&(e.setAttribute("data-theme",p),e.style.colorScheme=p)},[p,d]),t.useEffect(()=>{h&&document.documentElement.setAttribute("dir",h)},[h]);const b=t.useMemo(()=>({colorScheme:g,resolvedColorScheme:p,setColorScheme:C,toggleColorScheme:()=>C("dark"===p?"light":"dark")}),[g,p,C]);return e(o.Provider,{value:s??null,children:e(n.Provider,{value:b,children:e(r,{direction:h??"ltr",children:l})})})}export function useColorScheme(){const e=t.useContext(n);if(!e)throw new Error("neba: useColorScheme() needs a <NebaProvider> above it.");return e}
1
+ "use client";import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{DirectionProvider as r}from"@base-ui/react/direction-provider";import{DefaultsContext as o}from"../../internal/defaults.js";import{useMediaQuery as c}from"../../internal/media.js";const n=/*@__PURE__*/t.createContext(null);export function colorSchemeScript(e={}){const t=e.storageKey??"neba-color-scheme",r=e.defaultColorScheme??"system";return`(function(){try{var s=localStorage.getItem(${l(t)})||${l(r)};if(s==='system'){s=matchMedia('(prefers-color-scheme: dark)').matches?'dark':'light'}document.documentElement.setAttribute('data-theme',s)}catch(e){}})()`}function l(e){return JSON.stringify(e).replace(/</g,"\\u003c")}export function NebaProvider({children:l,defaults:s,colorScheme:a,defaultColorScheme:m="system",onColorSchemeChange:i,storageKey:u="neba-color-scheme",colorSchemeElement:d,direction:h}){const[f,S]=t.useState(()=>function(e){if(!1===e||"undefined"==typeof localStorage)return null;try{const t=localStorage.getItem(e);return"light"===t||"dark"===t||"system"===t?t:null}catch{return null}}(u)??m),g=a??f,p=c("(prefers-color-scheme: dark)"),y="system"===g?p?"dark":"light":g,C=t.useCallback(e=>{if(void 0===a&&S(e),!1!==u)try{localStorage.setItem(u,e)}catch{}i?.(e)},[a,u,i]);t.useEffect(()=>{const e=d?d():document.documentElement;e&&(e.setAttribute("data-theme",y),e.style.colorScheme=y)},[y,d]),t.useEffect(()=>{h&&document.documentElement.setAttribute("dir",h)},[h]);const b=t.useMemo(()=>({colorScheme:g,resolvedColorScheme:y,setColorScheme:C,toggleColorScheme:()=>C("dark"===y?"light":"dark")}),[g,y,C]);return e(o.Provider,{value:s??null,children:e(n.Provider,{value:b,children:e(r,{direction:h??"ltr",children:l})})})}export function useColorScheme(){const e=t.useContext(n);if(!e)throw new Error("neba: useColorScheme() needs a <NebaProvider> above it.");return e}