neba 1.8.1 → 1.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -7
- package/dist/components/accordion/Accordion.js +1 -1
- package/dist/components/alert/Alert.js +1 -1
- package/dist/components/anchor/Anchor.d.ts +73 -0
- package/dist/components/anchor/Anchor.js +1 -0
- package/dist/components/anchor/index.d.ts +2 -0
- package/dist/components/anchor/index.js +1 -0
- package/dist/components/animate-marquee/AnimateMarquee.js +1 -1
- package/dist/components/app-logo/AppLogo.js +1 -1
- package/dist/components/aspect-ratio/AspectRatio.js +1 -1
- package/dist/components/avatar/Avatar.js +1 -1
- package/dist/components/avatar-group/AvatarGroup.d.ts +47 -0
- package/dist/components/avatar-group/AvatarGroup.js +1 -0
- package/dist/components/avatar-group/index.d.ts +2 -0
- package/dist/components/avatar-group/index.js +1 -0
- package/dist/components/badge/Badge.js +1 -1
- package/dist/components/blockquote/Blockquote.js +1 -1
- package/dist/components/box/Box.js +1 -1
- package/dist/components/button/Button.js +1 -1
- package/dist/components/button-group/ButtonGroup.js +1 -1
- package/dist/components/card/Card.js +1 -1
- package/dist/components/carousel/Carousel.js +1 -1
- package/dist/components/chat-bubble/ChatBubble.js +1 -1
- package/dist/components/checkbox/Checkbox.js +1 -1
- package/dist/components/combobox/Combobox.js +1 -1
- package/dist/components/command-palette/CommandPalette.d.ts +88 -0
- package/dist/components/command-palette/CommandPalette.js +1 -0
- package/dist/components/command-palette/index.d.ts +2 -0
- package/dist/components/command-palette/index.js +1 -0
- package/dist/components/container/Container.js +1 -1
- package/dist/components/data-list/DataList.d.ts +55 -0
- package/dist/components/data-list/DataList.js +1 -0
- package/dist/components/data-list/index.d.ts +2 -0
- package/dist/components/data-list/index.js +1 -0
- package/dist/components/data-table/DataTable.js +1 -1
- package/dist/components/dialog/Dialog.js +1 -1
- package/dist/components/divider/Divider.js +1 -1
- package/dist/components/drawer/Drawer.js +1 -1
- package/dist/components/empty/Empty.js +1 -1
- package/dist/components/fieldset/Fieldset.d.ts +33 -0
- package/dist/components/fieldset/Fieldset.js +1 -0
- package/dist/components/fieldset/index.d.ts +2 -0
- package/dist/components/fieldset/index.js +1 -0
- package/dist/components/file-picker/FilePicker.js +1 -1
- package/dist/components/floating-bottom-navigation/FloatingBottomNavigation.js +1 -1
- package/dist/components/form/Form.d.ts +58 -0
- package/dist/components/form/Form.js +1 -0
- package/dist/components/form/index.d.ts +2 -0
- package/dist/components/form/index.js +1 -0
- package/dist/components/gauge-chart/GaugeChart.d.ts +62 -0
- package/dist/components/gauge-chart/GaugeChart.js +1 -0
- package/dist/components/gauge-chart/index.d.ts +2 -0
- package/dist/components/gauge-chart/index.js +1 -0
- package/dist/components/grid/Grid.js +1 -1
- package/dist/components/grid-container/GridContainer.js +1 -1
- package/dist/components/heatmap-chart/HeatmapChart.js +1 -1
- package/dist/components/highlight/Highlight.js +1 -1
- package/dist/components/hover-card/HoverCard.d.ts +78 -0
- package/dist/components/hover-card/HoverCard.js +1 -0
- package/dist/components/hover-card/index.d.ts +2 -0
- package/dist/components/hover-card/index.js +1 -0
- package/dist/components/how-to-steps/HowToSteps.d.ts +11 -25
- package/dist/components/how-to-steps/HowToSteps.js +1 -1
- package/dist/components/icon/Icon.js +1 -1
- package/dist/components/list/List.js +1 -1
- package/dist/components/menu/Menu.d.ts +16 -4
- package/dist/components/menu/Menu.js +1 -1
- package/dist/components/menubar/Menubar.d.ts +56 -0
- package/dist/components/menubar/Menubar.js +1 -0
- package/dist/components/menubar/index.d.ts +2 -0
- package/dist/components/menubar/index.js +1 -0
- package/dist/components/meter/Meter.d.ts +52 -0
- package/dist/components/meter/Meter.js +1 -0
- package/dist/components/meter/index.d.ts +2 -0
- package/dist/components/meter/index.js +1 -0
- package/dist/components/mockup/Mockup.js +1 -1
- package/dist/components/navigation-menu/NavigationMenu.d.ts +100 -0
- package/dist/components/navigation-menu/NavigationMenu.js +1 -0
- package/dist/components/navigation-menu/index.d.ts +2 -0
- package/dist/components/navigation-menu/index.js +1 -0
- package/dist/components/number-field/NumberField.js +1 -1
- package/dist/components/otp-field/OtpField.js +1 -1
- package/dist/components/overlay/Overlay.js +1 -1
- package/dist/components/page-layout/PageLayout.js +1 -1
- package/dist/components/pagination/Pagination.js +1 -1
- package/dist/components/panes/Panes.js +1 -1
- package/dist/components/pie-chart/PieChart.js +1 -1
- package/dist/components/pill/Pill.js +1 -1
- package/dist/components/popover/Popover.js +1 -1
- package/dist/components/progress-box/ProgressBox.js +1 -1
- package/dist/components/progress-circular/ProgressCircular.js +1 -1
- package/dist/components/progress-linear/ProgressLinear.js +1 -1
- package/dist/components/radio-group/RadioGroup.js +1 -1
- package/dist/components/rating/Rating.js +1 -1
- package/dist/components/scroll-area/ScrollArea.d.ts +50 -0
- package/dist/components/scroll-area/ScrollArea.js +1 -0
- package/dist/components/scroll-area/index.d.ts +2 -0
- package/dist/components/scroll-area/index.js +1 -0
- package/dist/components/scroll-zone/ScrollZone.d.ts +35 -17
- package/dist/components/scroll-zone/ScrollZone.js +1 -1
- package/dist/components/segmented-button/SegmentedButton.js +1 -1
- package/dist/components/select/Select.js +1 -1
- package/dist/components/shortcut/Shortcut.js +1 -1
- package/dist/components/sidebar/Sidebar.js +1 -1
- package/dist/components/skeleton/Skeleton.js +1 -1
- package/dist/components/slider/Slider.js +1 -1
- package/dist/components/spoiler/Spoiler.js +1 -1
- package/dist/components/statistic/Statistic.js +1 -1
- package/dist/components/switch/Switch.js +1 -1
- package/dist/components/table/Table.js +1 -1
- package/dist/components/tabs/Tabs.js +1 -1
- package/dist/components/text-field/TextField.js +1 -1
- package/dist/components/text-link/TextLink.js +1 -1
- package/dist/components/toast/Toast.js +1 -1
- package/dist/components/toggle/Toggle.d.ts +53 -0
- package/dist/components/toggle/Toggle.js +1 -0
- package/dist/components/toggle/index.d.ts +2 -0
- package/dist/components/toggle/index.js +1 -0
- package/dist/components/toggle-group/ToggleGroup.d.ts +51 -0
- package/dist/components/toggle-group/ToggleGroup.js +1 -0
- package/dist/components/toggle-group/index.d.ts +2 -0
- package/dist/components/toggle-group/index.js +1 -0
- package/dist/components/toolbar/Toolbar.js +1 -1
- package/dist/components/tooltip/Tooltip.js +1 -1
- package/dist/components/tour/Tour.d.ts +82 -0
- package/dist/components/tour/Tour.js +1 -0
- package/dist/components/tour/index.d.ts +2 -0
- package/dist/components/tour/index.js +1 -0
- package/dist/components/transfer/Transfer.d.ts +52 -0
- package/dist/components/transfer/Transfer.js +1 -0
- package/dist/components/transfer/index.d.ts +2 -0
- package/dist/components/transfer/index.js +1 -0
- package/dist/components/tree-view/TreeView.js +1 -1
- package/dist/components/typography/Typography.js +1 -1
- package/dist/components/window-pane/WindowPane.js +1 -1
- package/dist/index.d.ts +16 -0
- package/dist/index.js +1 -1
- package/dist/internal/animate.d.ts +7 -1
- package/dist/internal/animate.js +1 -1
- package/dist/internal/avatar-group.d.ts +22 -0
- package/dist/internal/avatar-group.js +1 -0
- package/dist/internal/button-group.d.ts +6 -2
- package/dist/internal/chart-frame.d.ts +18 -1
- package/dist/internal/chart-frame.js +1 -1
- package/dist/internal/data-table.d.ts +0 -14
- package/dist/internal/data-table.js +1 -1
- package/dist/internal/drag.d.ts +62 -0
- package/dist/internal/drag.js +1 -0
- package/dist/internal/highlight.js +1 -1
- package/dist/internal/i18n.d.ts +82 -0
- package/dist/internal/i18n.js +1 -1
- package/dist/internal/link.d.ts +19 -0
- package/dist/internal/link.js +1 -0
- package/dist/internal/media.d.ts +29 -0
- package/dist/internal/media.js +1 -0
- package/dist/internal/observe.d.ts +42 -0
- package/dist/internal/observe.js +1 -0
- package/dist/internal/page-layout.js +1 -1
- package/dist/internal/picker.js +1 -1
- package/dist/internal/progress.d.ts +5 -0
- package/dist/internal/search.d.ts +33 -0
- package/dist/internal/search.js +1 -0
- package/dist/internal/styles.d.ts +39 -0
- package/dist/internal/styles.js +1 -1
- package/dist/locales/ar.js +1 -1
- package/dist/locales/de.js +1 -1
- package/dist/locales/es.js +1 -1
- package/dist/locales/fr.js +1 -1
- package/dist/locales/hi.js +1 -1
- package/dist/locales/id.js +1 -1
- package/dist/locales/it.js +1 -1
- package/dist/locales/ja.js +1 -1
- package/dist/locales/ko.js +1 -1
- package/dist/locales/nl.js +1 -1
- package/dist/locales/pl.js +1 -1
- package/dist/locales/pt.js +1 -1
- package/dist/locales/ru.js +1 -1
- package/dist/locales/th.js +1 -1
- package/dist/locales/tr.js +1 -1
- package/dist/locales/vi.js +1 -1
- package/dist/locales/zh-hans.js +1 -1
- package/dist/locales/zh-hant.js +1 -1
- package/dist/styles.css +1 -1
- package/dist/tailwind.css +104 -0
- package/dist/types.d.ts +16 -0
- package/package.json +2 -2
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { NebaColor, NebaSize, NebaThreshold } from '../../types.js';
|
|
3
|
+
export interface MeterProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'children'> {
|
|
4
|
+
/**
|
|
5
|
+
* How much there is. Required, and that is the whole difference from a
|
|
6
|
+
* [ProgressLinear](./progress-linear): a meter reports a quantity that is
|
|
7
|
+
* already known, so there is no indeterminate case to have a default for.
|
|
8
|
+
*/
|
|
9
|
+
value: number;
|
|
10
|
+
/** @default 0 */
|
|
11
|
+
min?: number;
|
|
12
|
+
/** @default 100 */
|
|
13
|
+
max?: number;
|
|
14
|
+
/** A name for what is being measured. Read out with the value. */
|
|
15
|
+
label?: React.ReactNode;
|
|
16
|
+
/**
|
|
17
|
+
* Shows the value as text beside the bar. A percentage of the range unless
|
|
18
|
+
* `format` says otherwise.
|
|
19
|
+
* @default false
|
|
20
|
+
*/
|
|
21
|
+
showValue?: boolean;
|
|
22
|
+
/**
|
|
23
|
+
* How to write the value — `Intl.NumberFormat` options, so bytes, currencies
|
|
24
|
+
* and plain counts all work. A meter usually has real units, which is when
|
|
25
|
+
* this matters more than it does on a progress bar.
|
|
26
|
+
*/
|
|
27
|
+
format?: Intl.NumberFormatOptions;
|
|
28
|
+
/**
|
|
29
|
+
* Where the bar changes colour, smallest `from` first. The family of the last
|
|
30
|
+
* threshold the value has reached wins; below all of them `color` stands.
|
|
31
|
+
*/
|
|
32
|
+
thresholds?: readonly NebaThreshold[];
|
|
33
|
+
/** Thickness of the groove. Nothing else on a bar has a size. @default 'md' */
|
|
34
|
+
size?: NebaSize;
|
|
35
|
+
/** The family the bar carries before any threshold is reached. @default 'primary' */
|
|
36
|
+
color?: NebaColor;
|
|
37
|
+
}
|
|
38
|
+
/**
|
|
39
|
+
* How much of something there is, on a scale that is known in advance — disk
|
|
40
|
+
* used, seats taken, quota spent, a password's strength.
|
|
41
|
+
*
|
|
42
|
+
* It looks exactly like a [ProgressLinear](./progress-linear) and is not one.
|
|
43
|
+
* A progress bar is about *time*: something is happening and this is how far it
|
|
44
|
+
* has got, so it may have no value at all and it is expected to move on its own.
|
|
45
|
+
* A meter is about *quantity*: the number is already known, it does not move
|
|
46
|
+
* unless the thing it measures does, and it is meaningful to say the reading is
|
|
47
|
+
* bad — which is what `thresholds` is for.
|
|
48
|
+
*
|
|
49
|
+
* Base UI's Meter owns the semantics: `role="meter"`, the value and range
|
|
50
|
+
* attributes, and formatting the number for `aria-valuetext`.
|
|
51
|
+
*/
|
|
52
|
+
export declare const Meter: React.ForwardRefExoticComponent<MeterProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as a from"react";import{Meter as l}from"@base-ui/react/meter";import{barThicknessClasses as t,progressFraction as n,progressSlots as s}from"../../internal/progress.js";import{cx as o,metaTextClasses as i,stackGapClasses as m}from"../../internal/styles.js";export const Meter=/*@__PURE__*/a.forwardRef(function({value:a,min:u=0,max:f=100,label:c,showValue:d=!1,format:b,thresholds:h,size:x="md",color:p="primary",className:v,style:g,...j},w){const N=n(a,u,f),y=function(e,r,a){if(!a||0===a.length)return r;let l=r;for(const r of a)e>=r.from&&(l=r.color);return l}(a,p,h),_=void 0!==b;return r(l.Root,{ref:w,value:a,min:u,max:f,format:b,className:o("flex w-full flex-col",m[x],v??""),style:{...s(y),...g},...j,children:[c||d?r("div",{className:["flex items-baseline gap-2",c?"justify-between":"justify-end",i[x]].join(" "),children:[c?e(l.Label,{className:"min-w-0 truncate text-(--neba-fg)",children:c}):null,d?e(l.Value,{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:e=>_?e:`${Math.round(100*(N??0))}%`}):null]}):null,e(l.Track,{className:`relative w-full overflow-hidden rounded-full bg-(--n-soft) ${t[x]}`,children:e(l.Indicator,{className:"absolute top-0 rounded-full bg-(--n-fill) [transition:width_var(--neba-duration-fill)_var(--neba-ease),background-color_var(--neba-duration)_var(--neba-ease)]"})})]})});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export{Meter}from"./Meter.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import*as
|
|
1
|
+
"use client";import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import*as r from"react";import{useRender as a}from"@base-ui/react/use-render";import{transitionProps as n}from"../../internal/animate.js";import{MockupCutout as o,defaultNotch as s,elevationFilters as h,finishSlots as d,mockupChrome as l,mockupMetrics as c,resolveOs as u,shellClasses as m}from"../../internal/mockup.js";import{observeResize as p}from"../../internal/observe.js";import{cx as f,surfaceSlots as g}from"../../internal/styles.js";const b="undefined"==typeof document?r.useEffect:r.useLayoutEffect;export const Mockup=/*@__PURE__*/r.forwardRef(function({device:v,os:w,hardware:y="monitor",size:x="md",resolution:k,orientation:N="portrait",bezel:R="standard",finish:$="graphite",notch:z,systemUi:M=!0,scroll:j=!1,wallpaper:W,time:H="9:41",width:B,height:C,color:E="primary",elevation:L=0,transition:P,render:S,className:F,style:I,children:T,...U},q){const A=u(v,w),D=z??s(v,A),G="desktop"!==v&&"landscape"===N,J=c({device:v,size:x,resolution:k,orientation:N,bezel:R,hardware:y}),{screen:K,frame:O,body:Q,stand:V,base:X}=J,Y=r.useRef(null),[Z,_]=r.useState(null);b(()=>{const e=Y.current;if(!e)return;const t=()=>{const t=e.getBoundingClientRect();if(t.width<=0||t.height<=0)return;const i=Math.min(t.width/O.width,t.height/O.height);_(e=>null!==e&&Math.abs(e-i)<1e-4?e:i)};return t(),p(e,t)},[O.width,O.height]);const ee=r.useCallback(e=>{Y.current=e,"function"==typeof q?q(e):q&&(q.current=e)},[q]),te=M?l({os:A,notch:D,landscape:G,time:H}):{},ie=n(P),re="none"===R,ae=t("div",{className:"neba-mockup-screen relative flex flex-col overflow-hidden",style:{width:K.width,height:K.height,borderRadius:J.screenRadius,background:W??"var(--neba-surface)",boxShadow:re?void 0:"inset 0 0 0 1px var(--n-shell-shade)"},children:[te.top?.node,t("div",{className:"flex min-h-0 flex-1",children:[te.start?.node,e("div",{className:"min-w-0 flex-1 "+(j?"overflow-auto":"overflow-hidden"),style:{containerType:"size",containerName:"neba-screen"},children:T})]}),te.bottom?.node,e(o,{notch:D,screen:K,landscape:G})]}),ne=f("neba-mockup relative block",ie.className,F??"");return a({render:S,ref:ee,props:{className:ne,style:{...g(E,L),...d[$],...ie.style,width:B??(void 0===C?"100%":"auto"),height:C??"auto",aspectRatio:`${O.width} / ${O.height}`,filter:h[L],...I},children:t("div",{className:"absolute top-1/2 left-1/2 flex flex-col items-center",style:{width:O.width,height:O.height,transform:`translate(-50%, -50%) scale(${Z??1})`,visibility:null===Z?"hidden":void 0},children:[e("div",{className:re?"":m,style:{width:Q.width,height:Q.height,borderRadius:J.frameRadius,paddingBlock:`${J.bezel.top}px ${J.bezel.bottom}px`,paddingInline:J.bezel.x},children:ae}),V?t(i,{children:[e("div",{"aria-hidden":"true",style:{width:V.neckWidth,height:V.neckHeight,background:"var(--n-shell-shade)",clipPath:"polygon(16% 0, 84% 0, 100% 100%, 0 100%)"}}),e("div",{"aria-hidden":"true",className:m,style:{width:V.footWidth,height:V.footHeight,borderRadius:V.footHeight/2}})]}):null,X?e("div",{"aria-hidden":"true",className:`relative ${m}`,style:{width:X.width,height:X.height,borderRadius:`0 0 ${Math.round(.55*X.height)}px ${Math.round(.55*X.height)}px`,clipPath:"polygon(0 0, 100% 0, 98.5% 100%, 1.5% 100%)"},children:e("div",{className:"absolute top-0 left-1/2",style:{width:X.lipWidth,height:Math.round(.34*X.height),marginLeft:-X.lipWidth/2,borderRadius:`0 0 ${Math.round(.2*X.height)}px ${Math.round(.2*X.height)}px`,background:"var(--n-shell-shade)"}})}):null]}),...U}})});
|
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import type { NebaOrientation, NebaStyleProps } from '../../types.js';
|
|
3
|
+
export interface NavigationMenuProps extends Pick<NebaStyleProps, 'size' | 'color' | 'density'>, Omit<React.ComponentPropsWithoutRef<'nav'>, 'color' | 'defaultValue' | 'onChange'> {
|
|
4
|
+
/**
|
|
5
|
+
* Which way the row runs. `vertical` is a nav rail whose panels open beside
|
|
6
|
+
* it; the arrow keys follow either way.
|
|
7
|
+
* @default 'horizontal'
|
|
8
|
+
*/
|
|
9
|
+
orientation?: NebaOrientation;
|
|
10
|
+
/** Which item's panel is open, by its `value`. Nullish means closed. */
|
|
11
|
+
value?: string | null;
|
|
12
|
+
/** Which starts open, for an uncontrolled menu. */
|
|
13
|
+
defaultValue?: string | null;
|
|
14
|
+
onValueChange?: (value: string | null) => void;
|
|
15
|
+
/** How long the pointer rests before a panel opens, in milliseconds. @default 50 */
|
|
16
|
+
delay?: number;
|
|
17
|
+
/** How long a panel stays after the pointer leaves, in milliseconds. @default 50 */
|
|
18
|
+
closeDelay?: number;
|
|
19
|
+
/** Distance from the row, in pixels. @default 8 */
|
|
20
|
+
sideOffset?: number;
|
|
21
|
+
/** The items. */
|
|
22
|
+
children?: React.ReactNode;
|
|
23
|
+
}
|
|
24
|
+
export interface NavigationMenuItemProps {
|
|
25
|
+
/** The word in the row. */
|
|
26
|
+
label: React.ReactNode;
|
|
27
|
+
/**
|
|
28
|
+
* Makes the item a plain link rather than something that opens a panel. An
|
|
29
|
+
* item with an `href` and no children is a destination, and it is announced as
|
|
30
|
+
* one — which is the whole reason a site nav is not a Menu.
|
|
31
|
+
*/
|
|
32
|
+
href?: string;
|
|
33
|
+
/**
|
|
34
|
+
* Where the link opens. Ignored without `href`.
|
|
35
|
+
*
|
|
36
|
+
* Anything other than this tab also gets `rel="noopener noreferrer"`, merged
|
|
37
|
+
* with whatever `rel` was asked for, exactly as on [TextLink].
|
|
38
|
+
*/
|
|
39
|
+
target?: string;
|
|
40
|
+
/** The link's `rel`. The two tokens a new tab needs are added to it. */
|
|
41
|
+
rel?: string;
|
|
42
|
+
/** Content before the label. Sized in `em`, so it tracks it. */
|
|
43
|
+
startIcon?: React.ReactNode;
|
|
44
|
+
/**
|
|
45
|
+
* Identifies the item, for a controlled menu. Defaults to nothing, which is
|
|
46
|
+
* fine for an uncontrolled one — Base UI gives each item an identity of its
|
|
47
|
+
* own.
|
|
48
|
+
*/
|
|
49
|
+
value?: string;
|
|
50
|
+
/** Unavailable. The word stays in the row and opens nothing. */
|
|
51
|
+
disabled?: boolean;
|
|
52
|
+
/** How many columns the panel lays its links out in. @default 1 */
|
|
53
|
+
columns?: number;
|
|
54
|
+
/** The panel's contents — usually `NavigationMenuLink`s. */
|
|
55
|
+
children?: React.ReactNode;
|
|
56
|
+
}
|
|
57
|
+
export interface NavigationMenuLinkProps extends Omit<React.ComponentPropsWithoutRef<'a'>, 'color' | 'title'> {
|
|
58
|
+
/** Where it goes. */
|
|
59
|
+
href: string;
|
|
60
|
+
/** The row's name. */
|
|
61
|
+
title: React.ReactNode;
|
|
62
|
+
/** A second line under it, one step down the scale and muted. */
|
|
63
|
+
description?: React.ReactNode;
|
|
64
|
+
/** A glyph before the title. */
|
|
65
|
+
startIcon?: React.ReactNode;
|
|
66
|
+
}
|
|
67
|
+
/**
|
|
68
|
+
* One row inside a panel: where it goes, what it is called, and a line saying
|
|
69
|
+
* what is there.
|
|
70
|
+
*
|
|
71
|
+
* It is a real `<a>`, which is the point of the whole component — a site's
|
|
72
|
+
* navigation is a list of destinations, and a destination that is a `<div>` with
|
|
73
|
+
* a click handler is not in the link list, not on the status bar and not in a
|
|
74
|
+
* crawler's index.
|
|
75
|
+
*/
|
|
76
|
+
export declare const NavigationMenuLink: React.ForwardRefExoticComponent<NavigationMenuLinkProps & React.RefAttributes<HTMLAnchorElement>>;
|
|
77
|
+
/**
|
|
78
|
+
* One word in the row, and what opens under it.
|
|
79
|
+
*
|
|
80
|
+
* With children it is a trigger and a panel; with an `href` and nothing else it
|
|
81
|
+
* is a link, and the difference is not cosmetic — the second one is announced as
|
|
82
|
+
* a destination and the first as something that expands.
|
|
83
|
+
*/
|
|
84
|
+
export declare function NavigationMenuItem({ label, href, target, rel, startIcon, value, disabled, columns, children }: NavigationMenuItemProps): React.JSX.Element;
|
|
85
|
+
/**
|
|
86
|
+
* A site's navigation: a row of destinations, some of which open a panel of
|
|
87
|
+
* more of them.
|
|
88
|
+
*
|
|
89
|
+
* The difference from a [Menu](./menu) is what the rows *are*. A menu holds
|
|
90
|
+
* actions, so its rows are `menuitem`s and the whole thing is a widget that
|
|
91
|
+
* traps the arrow keys. This holds links, so it is a `<nav>` full of real
|
|
92
|
+
* `<a>`s — which is what puts them in the link list, on the status bar and in a
|
|
93
|
+
* crawler's index. Reach for a Menu when the row does something and for this
|
|
94
|
+
* when the row goes somewhere.
|
|
95
|
+
*
|
|
96
|
+
* One panel is open at a time and it resizes between items rather than closing
|
|
97
|
+
* and reopening, which is Base UI's doing and is what makes crossing the row
|
|
98
|
+
* read as one surface rather than three.
|
|
99
|
+
*/
|
|
100
|
+
export declare const NavigationMenu: React.ForwardRefExoticComponent<NavigationMenuProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -0,0 +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,{})})})})]})})});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export{NavigationMenu,NavigationMenuItem,NavigationMenuLink}from"./NavigationMenu.js";
|
|
@@ -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 i}from"../../internal/i18n.js";import{MinusIcon as r,PlusIcon as s}from"../../internal/icons.js";import{controlHeightClasses as o,controlTextLeadingClasses as c,
|
|
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 i}from"../../internal/i18n.js";import{MinusIcon as r,PlusIcon as s}from"../../internal/icons.js";import{controlHeightClasses as o,controlTextLeadingClasses as c,cx as d,disabledClasses as m,fieldReadOnlyClasses as u,fieldRestClasses as p,focusWithinRingClasses as f,gapClasses as b,hasContent as h,iconClasses as x,metaTextClasses as g,paddingXClasses as v,radiusClasses as N,stackGapClasses as j,surfaceSlots as w,transitionClasses as y}from"../../internal/styles.js";const k=["group relative flex w-full cursor-text items-center","[-webkit-tap-highlight-color:transparent]",y,"focus-within:[transition-duration:0ms]",f,x].join(" "),S=["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({variant:f="outline",size:x="md",color:y="primary",density:_="default",elevation:V=0,value:C,defaultValue:I,onValueChange:O,onValueCommitted:$,min:z,max:L,step:W,largeStep:q,smallStep:D,snapOnStep:F,allowWheelScrub:R=!1,format:B,locale:E,steppers:G="end",incrementLabel:A,decrementLabel:H,label:J,description:K,error:M,invalid:P,startIcon:Q,endIcon:T,fullWidth:U=!1,disabled:X=!1,readOnly:Y=!1,required:Z=!1,name:ee,placeholder:ne,id:te,className:ae,style:le,...ie}){const re=i(l,"string"==typeof E?E:void 0),se=h(M),oe=P??se,ce=oe?"danger":y,de=v[_][x],me={end:`${de} pe-1`,split:"px-1",none:de},ue=e(t.Decrement,{"aria-label":H??re.decrease,className:S,children:e(r,{})}),pe=e(t.Increment,{"aria-label":A??re.increase,className:S,children:e(s,{})}),fe="none"!==G&&!Y;return n(a.Root,{disabled:X,invalid:oe,className:d("flex-col align-top",j[x],U?"flex w-full":"inline-flex",ae??""),style:{...w(ce,V),...le},...ie,children:[J?e(a.Label,{className:[g[x],"font-medium",X?"text-(--neba-disabled-fg)":"text-(--neba-fg)"].join(" "),children:J}):null,e(t.Root,{id:te,name:ee,className:"contents",value:C,defaultValue:I,onValueChange:e=>O?.(e),onValueCommitted:e=>$?.(e),min:z,max:L,step:W,largeStep:q,smallStep:D,snapOnStep:F,allowWheelScrub:R,format:B,locale:E,disabled:X,readOnly:Y,required:Z,children:n(t.Group,{className:[k,o[x],c[x],N[x],b[x],fe?me[G]:de,X?m[f]:Y?u[f]:p[f]].join(" "),children:[fe&&"split"===G?ue:null,Q?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:Q}):null,e(t.Input,{placeholder:ne,className:["min-w-0 flex-1 self-stretch bg-transparent [font:inherit] text-inherit","[outline:none]","tabular-nums","split"===G&&fe?"text-center":"","placeholder:text-(--neba-muted-fg)","caret-(--n-accent) selection:bg-(--n-soft-press)","disabled:cursor-not-allowed"].filter(Boolean).join(" ")}),T?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:T}):null,fe&&"end"===G?n("span",{className:"flex shrink-0 items-center gap-0.5",children:[ue,pe]}):null,fe&&"split"===G?pe:null]})}),K?e(a.Description,{className:`${g[x]} text-(--neba-muted-fg)`,children:K}):null,e(a.Error,se?{match:!0,className:`${g[x]} text-(--n-accent)`,children:M}:{className:`${g[x]} text-(--n-accent)`})]})}
|
|
@@ -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
|
|
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 s,fieldReadOnlyClasses as i,fieldRestClasses as o,metaTextClasses as m,stackGapClasses as d,surfaceSlots as u,transitionClasses as c}from"../../internal/styles.js";const p={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"},f={xs:"rounded-[0.3125rem]",sm:"rounded-[0.375rem]",md:"rounded-[0.4375rem]",lg:"rounded-[0.5625rem]",xl:"rounded-[0.6875rem]"},x={xs:"text-[0.8125rem]",sm:"text-[0.9375rem]",md:"text-[1.0625rem]",lg:"text-[1.25rem]",xl:"text-[1.5rem]"},g={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"}},h={numeric:"numeric",alpha:"alpha",alphanumeric:"alphanumeric",any:"none"};export const OtpField=/*@__PURE__*/t.forwardRef(function({variant:b="outline",size:y="md",color:v="primary",density:N="default",elevation:V=0,length:w=6,charset:j="numeric",mask:C=!1,groupSize:F,separator:M="–",value:I,defaultValue:O,onValueChange:R,onComplete:S,onValueInvalid:k,autoSubmit:q=!1,label:z,description:_,error:A,invalid:D,name:E,required:L=!1,disabled:T=!1,readOnly:B=!1,autoFocus:G=!1,className:H,style:J,...K},P){const Q=Math.min(12,Math.max(2,Math.round(w))),U=null!=A&&!1!==A&&""!==A,W=D??U,X=W?"danger":v,Y=r("text-center font-medium [font-family:inherit]",p[y],x[y],f[y],c,"caret-(--n-accent) selection:bg-(--n-soft-press)","focus:[outline:2px_solid_var(--n-ring)] focus:outline-offset-1","focus:[transition-duration:0ms]",T?s[b]:B?i[b]:o[b]),Z=F&&F>0?Math.round(F):0;return a(n.Root,{disabled:T,invalid:W,className:r("inline-flex flex-col align-top",d[y],H),style:{...u(X,V),...J},children:[z?e(n.Label,{className:r(m[y],"font-medium",T?"text-(--neba-disabled-fg)":"text-(--neba-fg)"),children:z}):null,e(l.Root,{ref:P,length:Q,validationType:h[j],mask:C,name:E,required:L,disabled:T,readOnly:B,autoSubmit:q,value:I,defaultValue:O,onValueChange:e=>R?.(e),onValueComplete:e=>S?.(e),onValueInvalid:e=>k?.(e),className:r("flex items-center",g[N][y]),...K,children:Array.from({length:Q},(n,s)=>a(t.Fragment,{children:[Z>0&&s>0&&s%Z===0?e("span",{"aria-hidden":"true",className:r("select-none px-0.5 text-(--neba-muted-fg)",x[y]),children:M}):null,e(l.Input,{className:Y,autoFocus:G&&0===s})]},s))}),_?e(n.Description,{className:r(m[y],"text-(--neba-muted-fg)"),children:_}):null,e(n.Error,U?{match:!0,className:r(m[y],"text-(--n-accent)"),children:A}:{className:r(m[y],"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 n,useMessages as t}from"../../internal/i18n.js";import{surfaceSlots as
|
|
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 n,useMessages as t}from"../../internal/i18n.js";import{cx as l,surfaceSlots as i}from"../../internal/styles.js";const s={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:""},o={start:"items-start",center:"items-center",end:"items-end"},c={xs:"p-3",sm:"p-4",md:"p-6",lg:"p-8",xl:"p-10"},m=["[transition:opacity_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" ");export function Overlay({open:p,defaultOpen:d,onOpenChange:b,tone:u="scrim",dismissible:f=!1,modal:x=!0,align:y="center",size:g="md",color:j="primary",locale:h,label:k,className:O,style:_,children:v,...N}){const z=t(n,h);return e(r.Root,{open:p,defaultOpen:d,modal:x,disablePointerDismissal:!f,onOpenChange:(e,a)=>{f||e||"escape-key"!==a.reason?b?.(e):a.cancel()},children:a(r.Portal,{children:[e(r.Backdrop,{className:`neba-portal fixed inset-0 z-50 ${m} ${s[u]}`}),e(r.Viewport,{className:["neba-portal fixed inset-0 z-50 flex justify-center",o[y],c[g]].join(" "),children:e(r.Popup,{"aria-label":k??z.label,className:l("flex max-h-full max-w-full flex-col items-center justify-center","[outline:none]",m,O??""),style:{...i(j,0),..._},...N,children:v})})]})})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as
|
|
1
|
+
"use client";import{jsx as e,jsxs as o}from"react/jsx-runtime";import*as l from"react";import{layoutMessages as n,useMessages as t}from"../../internal/i18n.js";import{PageLayoutContext as r,SidebarSideContext as s}from"../../internal/page-layout.js";import{observeResize as a}from"../../internal/observe.js";import{controlSlots as i,cx as u,hasContent as c,toLength as f}from"../../internal/styles.js";const d=["header","footer"];export const PageLayout=/*@__PURE__*/l.forwardRef(function({header:p,footer:h,sidebar:m,endSidebar:v,headerSpan:x="full",footerSpan:y="full",scroll:b="page",height:g="viewport",collapseBelow:w="md",sidebarOpen:S,defaultSidebarOpen:k=!1,onSidebarOpenChange:C,endSidebarOpen:P,defaultEndSidebarOpen:j=!1,onEndSidebarOpenChange:N,skipLink:O=!0,skipLabel:$,mainId:R="main",mainProps:z,locale:E,color:L="primary",className:B,style:H,children:M,..._},I){const T=t(n,E),[q,A]=l.useState(k),[D,F]=l.useState(j),G=l.useMemo(()=>({start:S??q,end:P??D}),[S,q,P,D]),J=l.useCallback((e,o)=>{if("start"===e)return void 0===S&&A(o),void C?.(o);void 0===P&&F(o),N?.(o)},[S,P,C,N]),K=l.useRef(null),Q=l.useCallback(e=>{K.current=e,"function"==typeof I?I(e):I&&(I.current=e)},[I]),U=l.useRef({header:null,footer:null}),V=l.useRef({header:null,footer:null}),W=l.useCallback(()=>{const e=K.current;if(e)for(const o of d){const l=U.current[o],n="header"===o?x:y;if(!l){e.style.setProperty(`--n-layout-${o}`,"0px"),e.style.setProperty(`--n-layout-${o}-inset`,"0px");continue}const t=getComputedStyle(l).position,r=`${l.offsetHeight}px`,s="sticky"===t||"fixed"===t;e.style.setProperty(`--n-layout-${o}`,s&&"full"===n?r:"0px"),e.style.setProperty(`--n-layout-${o}-inset`,"fixed"===t?r:"0px")}},[x,y]),X=l.useCallback(()=>{for(const e of d){V.current[e]?.();const o=U.current[e];V.current[e]=o?a(o,()=>W()):null}W()},[W]);l.useEffect(()=>{const e=V.current;return X(),()=>{for(const o of d)e[o]?.(),e[o]=null}},[X]);const Y=l.useCallback((e,o)=>{U.current[e]=o,X()},[X]),Z=l.useMemo(()=>({present:!0,register:Y,collapseBelow:w,open:G,setOpen:J,scroll:b,locale:E}),[Y,w,G,J,b,E]),ee="content"===b,oe=f("viewport"===g||"auto"===g?void 0:g),le=void 0!==oe?"":"auto"===g?ee?"h-full":"min-h-full":ee?"h-dvh":"min-h-dvh",ne=c(p)?p:null,te=c(h)?h:null;return e(r.Provider,{value:Z,children:o("div",{ref:Q,className:u("relative flex w-full flex-col",ee?"overflow-hidden":"",le,"full"===x?"[padding-top:var(--n-layout-header-inset,0px)]":"","full"===y?"[padding-bottom:var(--n-layout-footer-inset,0px)]":"",B),style:void 0===oe?H:{...ee?{height:oe}:{minHeight:oe},...H},..._,children:[O?e("a",{href:`#${R}`,className:u("absolute start-3 top-3 z-50 size-px overflow-hidden whitespace-nowrap","[clip-path:inset(50%)] focus:size-auto focus:overflow-visible focus:[clip-path:none]","focus:rounded-(--neba-radius-md) focus:bg-(--n-fill) focus:px-4 focus:py-2","focus:font-medium focus:text-(--n-on-solid) focus:no-underline","focus:[box-shadow:var(--neba-shadow-2),var(--neba-plate-solid)]","focus:[outline:2px_solid_var(--n-ring)] focus:outline-offset-2"),style:i(L,2,"solid"),children:$??T.skipToContent}):null,"full"===x?ne:null,o("div",{className:u("flex w-full flex-1",ee?"min-h-0":""),children:[c(m)?e(s.Provider,{value:"start",children:m}):null,o("div",{className:u("flex min-w-0 flex-1 flex-col",ee?"min-h-0":"","content"===x?"[padding-top:var(--n-layout-header-inset,0px)]":"","content"===y?"[padding-bottom:var(--n-layout-footer-inset,0px)]":""),children:["content"===x?ne:null,e("main",{...z,id:R,className:u("min-w-0 flex-1",ee?"min-h-0 overflow-y-auto":"",z?.className),children:M}),"content"===y?te:null]}),c(v)?e(s.Provider,{value:"end",children:v}):null]}),"full"===y?te:null]})})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{Button as n}from"../button/Button.js";import{fillMessage as r,paginationMessages as l,useMessages as i}from"../../internal/i18n.js";import{ChevronIcon as s}from"../../internal/icons.js";import{controlTextClasses as o,
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{Button as n}from"../button/Button.js";import{fillMessage as r,paginationMessages as l,useMessages as i}from"../../internal/i18n.js";import{ChevronIcon as s}from"../../internal/icons.js";import{controlTextClasses as o,cx as m,gapClasses as c,srOnlyClasses as u}from"../../internal/styles.js";function d(e,t){return Array.from({length:Math.max(0,t-e+1)},(t,a)=>e+a)}function h(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:e("path",{d:"m7.5 4.5 3.5 3.5-3.5 3.5M3.5 4.5 7 8l-3.5 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}const f={xs:"h-5.5 min-w-5.5",sm:"h-6.5 min-w-6.5",md:"h-8 min-w-8",lg:"h-10 min-w-10",xl:"h-12 min-w-12"};export const Pagination=/*@__PURE__*/a.forwardRef(function({variant:p="text",size:x="md",color:g="primary",density:b="compact",elevation:v=0,count:y,page:M,defaultPage:j=1,onPageChange:w,siblingCount:N=1,boundaryCount:L=1,showEdges:k=!1,showArrows:C=!0,disabled:K=!1,getPageHref:P,locale:S,label:z,pageLabel:$,previousLabel:A,nextLabel:B,firstLabel:D,lastLabel:E,className:H,children:I,...R},W){const q=i(l,S),F=$??(e=>r(q.page,{page:String(e)})),[G,J]=a.useState(j),O=Math.min(Math.max(M??G,1),Math.max(y,1));if(y<2)return null;const Q=function(e,t,a,n){const r=d(1,Math.min(n,e)),l=d(Math.max(e-n+1,n+1),e),i=Math.max(Math.min(t-a,e-n-2*a-1),n+2),s=Math.min(Math.max(t+a,n+2*a+2),l.length>0?l[0]-2:e-1);return[...r,...i>n+2?["start-ellipsis"]:n+1<e-n?[n+1]:[],...d(i,s),...s<e-n-1?["end-ellipsis"]:e-n>n?[e-n]:[],...l]}(y,O,N,L),T=O<=1,U=O>=y,V=(t,a,n)=>P&&!a?{render:e("a",{href:P(t),rel:n})}:null,X=(e,t)=>{e.metaKey||e.ctrlKey||e.shiftKey||e.altKey||P&&!w||(e.preventDefault(),(e=>{const t=Math.min(Math.max(e,1),y);t!==O&&(void 0===M&&J(t),w?.(t))})(t))},Y=(t,a,r,l,i,s,o)=>e("li",{className:"flex",children:e(n,{variant:p,size:x,color:g,density:b,elevation:v,disabled:K||l,"aria-label":a,startIcon:e("span",{className:`flex items-center ${i}`,children:s}),onClick:e=>X(e,r),...V(r,K||l,o)})},t);return t("nav",{ref:W,"aria-label":z??q.label,className:m("flex items-center",H??""),...R,children:[t("ul",{role:"list",className:`m-0 flex list-none items-center p-0 ${c[x]}`,children:[k?Y("first",D??q.first,1,T,"rotate-180 rtl:rotate-0",e(h,{})):null,C?Y("previous",A??q.previous,O-1,T,"rotate-90 rtl:-rotate-90",e(s,{}),"prev"):null,Q.map((t,a)=>e("li","number"==typeof t?{className:"flex",children:e(n,{variant:t===O?"solid":p,size:x,color:g,density:b,elevation:v,disabled:K,"aria-label":F(t),"aria-current":t===O?"page":void 0,className:"tabular-nums",onClick:e=>X(e,t),...V(t,K||t===O),children:t})}:{"aria-hidden":"true",className:["flex select-none items-center justify-center","text-(--neba-muted-fg)",o[x],f[x]].join(" "),children:"…"},`slot-${a}`)),C?Y("next",B??q.next,O+1,U,"-rotate-90 rtl:rotate-90",e(s,{}),"next"):null,k?Y("last",E??q.last,y,U,"rtl:rotate-180",e(h,{})):null]}),e("span",{className:u,"aria-live":"polite",children:r(q.status,{page:String(O),total:String(y)})}),I]})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as
|
|
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";const s=/*@__PURE__*/t.createContext({basis:null}),c={xs:"basis-1",sm:"basis-1.5",md:"basis-2",lg:"basis-2.5",xl:"basis-3"},u={xs:4,sm:6,md:8,lg:10,xl:12};function f(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({orientation:a="horizontal",resizable:m=!0,color:d="primary",size:h="md",onResize:g,onResizeEnd:p,className:x,style:v,children:b,...w},z){const y=t.Children.toArray(b).filter(t.isValidElement),R=y.length,M=t.useRef(null),S=t.useCallback(e=>{M.current=e,"function"==typeof z?z(e):z&&(z.current=e)},[z]),j=t.useRef([]);j.current=y.map(e=>e.props);const[C,k]=t.useState(null),N=C&&C.length===R?C:null,$=t.useRef(null);$.current=N;const A="horizontal"===a,E=u[h]*Math.max(0,R-1);function D(e){const n=M.current,t=$.current;if(!m||!n||!t||void 0===t[e+1])return null;const r=n.getBoundingClientRect(),i=(A?r.width:r.height)-E;if(i<=0)return null;const o=j.current[e],a=j.current[e+1],l=t[e]*i,s=l+t[e+1]*i,c=Math.max(f(o?.minSize,i,n)??0,s-(f(a?.maxSize,i,n)??s)),u=Math.min(f(o?.maxSize,i,n)??s,s-(f(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,k(o),g?.(o.map(e=>100*e)),o}}}t.useEffect(()=>{const e=M.current;if(!e)return;const n=()=>{const n=e.getBoundingClientRect(),t=(A?n.width:n.height)-E;t<=0||k(n=>n&&n.length===R?n:function(e,n,t){const r=e.map(e=>f(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)}(j.current,t,e))};return n(),i(e,n)},[R,A,E]);const P=t.useRef(null);t.useEffect(()=>()=>P.current?.(),[]);const I=o("group/handle relative z-1 flex shrink-0 grow-0 items-center justify-center",c[h],l,"[outline:none] focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-0",m?o(A?"cursor-col-resize":"cursor-row-resize","hover:bg-(--n-soft) data-[dragging]:bg-(--n-soft)"):"");return e("div",{ref:S,className:o("flex h-full w-full",A?"flex-row":"flex-col","min-h-0 min-w-0",x),style:{"--n-accent":`var(--neba-${d}-accent)`,"--n-soft":`var(--neba-${d}-soft)`,"--n-ring":`var(--neba-${d}-ring)`,...v},...w,children:y.map((i,a)=>n(t.Fragment,{children:[a>0?e("div",{role:"separator","aria-orientation":A?"vertical":"horizontal","aria-valuenow":N?Math.round(100*N[a-1]):void 0,"aria-valuemin":0,"aria-valuemax":100,"aria-disabled":!m||void 0,tabIndex:m?0:-1,className:I,onPointerDown:e=>{0===e.button&&function(e,n){const t=D(e);if(!t)return;const i=n.currentTarget,o=A?n.clientX:n.clientY,a=A&&"rtl"===getComputedStyle(t.root).direction?-1:1;let l=t.current;P.current=r({target:i,pointerId:n.pointerId,onMove:e=>{const n=A?e.clientX:e.clientY;l=t.resize((n-o)*a)},onEnd:()=>{P.current=null,p?.(l.map(e=>100*e))}})}(a-1,e)},onKeyDown:e=>{const n=A?"ArrowLeft":"ArrowUp",t=A?"ArrowRight":"ArrowDown";e.key!==n&&e.key!==t||(e.preventDefault(),function(e,n){const t=D(e);if(!t)return;const r=t.resize(n);p?.(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,A?"h-full w-px":"h-px w-full",m?"group-hover/handle:bg-(--n-accent) group-focus-visible/handle:bg-(--n-accent) group-data-[dragging]/handle:bg-(--n-accent)":"")})}):null,e(s.Provider,{value:{basis:N?`calc((100% - ${E}px) * ${N[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:c,...u},f){const{basis:m}=t.useContext(s);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:c})});
|
|
@@ -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,
|
|
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 N,emptyMessages as j,useMessages as w}from"../../internal/i18n.js";const I={pie:0,donut:.62,semi:.62};export function PieChart({data:P,categories:z,shape:k="pie",startAngle:A=0,center:$,valueLabels:L="none",height:S,format:_,locale:B,label:E,legend:R,tooltip:C,empty:D,size:O="md",variant:K="text",padded:V=!1,className:W,...q}){const F=a.useRef(null),G=s(F),H=w(j,B),J=w(N,B),Q=a.useId(),T=a.useCallback(e=>_?g(B,_).format(e):h(e,B),[_,B]),U=a.useMemo(()=>P.map(x),[P]),X=a.useMemo(()=>U.map((e,t)=>({name:v(m(t,z,[U]),B),data:[P[t]],color:e.color})),[U,z,P,B]),Y=d(X),[Z,ee]=a.useState(null),te=X.map((e,t)=>b(e,t)),ae=U.reduce((e,t,a)=>Y.visible[a]&&null!==t.value?e+Math.abs(t.value):e,0),ne="semi"===k,le="number"==typeof S?S:p[O],ie=c[O],re=!1===R?{interactive:!1}:!0===R||void 0===R?{}:R,oe=!1!==R&&X.length>1,se=re.side??"bottom",de=!1===C?{mode:"none"}:!0===C||void 0===C?{}:C,ue="none"===de.mode,me=G/2,ce=Math.max(0,Math.min(G/2,ne?le:le/2)-2),he=ne?Math.min(le,le/2+ce/2):le/2,ve=ce*I[k],fe=ae<=0||ce<=0,pe=ce>0?Math.min(4,f/ce*(180/Math.PI)):0,be=ne?180:360,xe=[];let ge=ne?-90:A;U.forEach((e,t)=>{if(!Y.visible[t]||null===e.value||0===e.value)return;const a=Math.abs(e.value)/ae,n=a*be;xe.push({index:t,start:ge,end:ge+n,value:e.value,share:a}),ge+=n});const ye=null===Z?[]:[{seriesIndex:Z,name:X[Z]?.name,color:U[Z]?.color??te[Z],value:U[Z]?.value??null,formatted:`${T(U[Z]?.value??0)} · ${Math.round(10*(Math.abs(U[Z]?.value??0)/ae*100+Number.EPSILON))/10}%`,label:U[Z]?.label}];return t(r,{...q,size:O,variant:K,padded:V,className:W,legendSide:se,legend:oe?e(l,{series:X,colors:te,options:re,visibility:Y,size:O,values:re.showValue?U.map(e=>null===e.value?void 0:T(e.value)):void 0}):null,table:fe?null:e(n,{id:Q,caption:E,categories:X.map(e=>e.name??""),series:[{name:E,data:P}],values:[U],format:T,locale:B}),children:[t("div",{ref:F,role:"img",tabIndex:fe?void 0:0,"aria-label":E??J.label,"aria-describedby":fe?void 0:Q,onPointerLeave:()=>ee(null),onBlur:()=>ee(null),onKeyDown:e=>{if("ArrowRight"!==e.key&&"ArrowLeft"!==e.key)return;const t=xe.map(e=>e.index);if(0===t.length)return;const a=null===Z?-1:t.indexOf(Z),n="ArrowRight"===e.key?a+1:a-1;ee(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:le},children:[fe?e("div",{className:y("flex h-full items-center justify-center text-(--neba-muted-fg)",M[O]),children:D??H.title}):G>0?t("svg",{width:G,height:le,viewBox:`0 0 ${G} ${le}`,"aria-hidden":"true",className:"block",children:[xe.map(t=>{const a=null!==Y.hovered&&Y.hovered!==t.index||null!==Z&&Z!==t.index,n=t.end-t.start>2*pe?pe/2:0;return e("path",{d:u(me,he,ce,ve,t.start+n,t.end-n),fill:U[t.index].color??te[t.index],opacity:a?.32:1,onPointerEnter:ue?void 0:()=>ee(t.index),className:"[transition:opacity_var(--neba-duration)_var(--neba-ease)]"},t.index)}),"all"===L?xe.map(t=>{const a=((t.start+t.end)/2-90)*(Math.PI/180),n=ve>0?(ve+ce)/2:.68*ce,l=`${Math.round(100*t.share)}%`;return(t.end-t.start)*(Math.PI/180)*n<2*ie||ce-ve<1.6*ie?null:e("text",{x:me+n*Math.cos(a),y:he+n*Math.sin(a),textAnchor:"middle",dominantBaseline:"central",fontSize:ie,fontWeight:600,fill:"var(--neba-surface)",className:"tabular-nums",children:l},t.index)}):null]}):null,$&&ve>0?e("div",{className:"pointer-events-none absolute flex flex-col items-center justify-center text-center",style:{left:me-ve,top:he-ve,width:2*ve,height:ne?ve:2*ve},children:$}):null,null===Z||ue?null:de.render?e("div",{className:"pointer-events-none absolute top-0 left-1/2 z-10",children:de.render({index:Z,category:X[Z]?.name??Z,items:ye})}):e(o,{heading:X[Z]?.name,items:ye,x:me,y:8,flip:!1,size:O})]}),ue?null:e(i,{heading:null===Z?void 0:X[Z]?.name,items:ye})]})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as n,Fragment as t}from"react/jsx-runtime";import*as l from"react";import{controlSlots as
|
|
1
|
+
"use client";import{jsx as e,jsxs as n,Fragment as t}from"react/jsx-runtime";import*as l from"react";import{observeResize as o}from"../../internal/observe.js";import{controlSlots as i,controlTextClasses as r,cx as s,focusRingClasses as a,gapClasses as c,hasContent as d,iconClasses as m,iconSizeClasses as x,metaTextClasses as f,paddingXClasses as p,pressTransitionClasses as u,sheetBodyClasses as h,surfaceClasses as v,transitionClasses as b}from"../../internal/styles.js";const g={solid:[v,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[v,"border text-(--n-accent) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:`${v} text-(--n-accent) bg-(--n-soft)`},w={solid:"hover:bg-(--n-fill-hover) active:bg-(--n-fill-active)",outline:"hover:bg-(--n-panel-hover) hover:[border-color:var(--n-line-hover)] active:bg-(--n-panel-press)",text:"hover:bg-(--n-soft-hover) active:bg-(--n-soft-press)"},j={xs:"min-h-5.5",sm:"min-h-6.5",md:"min-h-8",lg:"min-h-10",xl:"min-h-12"},y={xs:"rounded-[0.6875rem]",sm:"rounded-[0.8125rem]",md:"rounded-[1rem]",lg:"rounded-[1.25rem]",xl:"rounded-[1.5rem]"},N={default:{xs:"px-3",sm:"px-4",md:"px-5",lg:"px-6",xl:"px-8"},compact:{xs:"px-1.5",sm:"px-2",md:"px-2.5",lg:"px-3",xl:"px-4"}},k={static:{top:"",bottom:""},sticky:{top:"sticky top-3 z-20",bottom:"sticky bottom-3 z-20"},fixed:{top:"fixed inset-x-0 top-3 z-30 mx-auto w-fit",bottom:"fixed inset-x-0 bottom-3 z-30 mx-auto w-fit"}};export const Pill=/*@__PURE__*/l.forwardRef(function({variant:v="solid",size:z="md",color:$="secondary",density:_="default",elevation:C=2,startIcon:H,endIcon:I,title:R,description:B,details:E,expanded:F=!1,position:P="static",side:S="top",className:q,style:A,children:D,onClick:G,...J},K){const L=l.useRef(null),[M,O]=l.useState(0);l.useEffect(()=>{const e=L.current;if(e)return O(e.scrollHeight),o(e,()=>O(e.scrollHeight))},[E]);const Q=Boolean(G),T=p[_][z],U=n(t,{children:[d(H)?e("span",{className:`flex shrink-0 items-center justify-center overflow-hidden rounded-full [&_img]:size-full [&_img]:object-cover ${x[z]}`,children:H}):null,d(R)||d(B)||d(D)?n("span",{className:["flex min-w-0 flex-1 flex-col items-center justify-center text-center",N[_][z]].join(" "),children:[d(R)?e("span",{className:"max-w-full truncate",children:R}):null,d(B)?e("span",{className:`max-w-full truncate font-normal ${f[z]} [color:color-mix(in_oklab,currentColor_72%,transparent)]`,children:B}):null,D]}):null]});return n("div",{ref:K,className:s("inline-flex max-w-full flex-col overflow-hidden align-middle",y[z],"font-medium whitespace-nowrap select-none",r[z],g[v],b,u,m,Q?`neba-glow ${w[v]}`:"",k[P][S],q??""),style:{...i($,C,v),...A},...J,children:[n("div",{className:["flex shrink-0 items-center py-1",j[z],c[z],Q?"ps-0":T,d(I)?"pe-1":Q?"pe-0":""].join(" "),children:[Q?e("button",{type:"button",className:["flex min-w-0 flex-1 cursor-pointer items-center justify-center self-stretch","rounded-[inherit]",c[z],T,a].join(" "),onClick:G,children:U}):U,d(I)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:I}):null]}),d(E)?e("div",{className:["overflow-hidden","[transition:height_var(--neba-duration)_var(--neba-ease)]","motion-reduce:[transition-duration:0ms]"].join(" "),style:{height:F?M:0},inert:!F,children:e("div",{ref:L,className:`whitespace-normal ${T} pb-2 ${h[z]}`,children:E})}):null]})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import{Popover as
|
|
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";const g={xs:"max-w-56",sm:"max-w-64",md:"max-w-80",lg:"max-w-96",xl:"max-w-lg"},v=[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(" "),w={xs:8,sm:9,md:10,lg:11,xl:12};export const PopoverClose=t.Close;export function Popover({size:x="md",color:y="primary",density:j="default",trigger:N,title:_,description:k,children:O,side:C="bottom",align:P="center",sideOffset:z=6,alignOffset:$=0,arrow:B=!1,open:L,defaultOpen:M,onOpenChange:T,modal:W=!1,dismissible:A=!0,showClose:D=!1,locale:E,closeLabel:R,width:q,className:F,style:G,...H}){const I=i(n,E),J=o[j][x],K=s[j][x],Q=w[x],S=d(_)||d(k);return a(t.Root,{open:L,defaultOpen:M,modal:W,onOpenChange:(e,a)=>{A||e||"escape-key"!==a.reason&&"outside-press"!==a.reason&&"focus-out"!==a.reason?T?.(e):a.cancel()},children:[N?e(t.Trigger,{render:N}):null,e(t.Portal,{children:e(t.Positioner,{className:"neba-portal z-50 [outline:none]",side:C,align:P,sideOffset:z,alignOffset:$,children:a(t.Popup,{className:r(v,m[x],p[x],u[x],J,K,void 0===q?g[x]:"",F??""),style:{...b(y,3),...void 0===q?null:{maxWidth:"number"==typeof q?`${q}px`:q},...G},...H,children:[B?e(t.Arrow,{className:["data-[side=top]:bottom-[-1px]","data-[side=bottom]:top-[-1px] data-[side=bottom]:rotate-180","data-[side=left]:right-[-1px] data-[side=left]:-rotate-90","data-[side=right]:left-[-1px] data-[side=right]:rotate-90"].join(" "),children:a("svg",{width:Q,height:Q/2,viewBox:"0 0 10 5","aria-hidden":"true",className:"block",children:[e("path",{d:"M0 0h10L5 5z",fill:"var(--n-panel-press)"}),e("path",{d:"M0 0 5 5 10 0",fill:"none",stroke:"var(--n-line)",strokeWidth:"1",vectorEffect:"non-scaling-stroke"})]})}):null,S||D?a("div",{className:"flex shrink-0 items-start gap-3",children:[a("div",{className:`flex min-w-0 flex-1 flex-col ${f[x]}`,children:[d(_)?e(t.Title,{className:`m-0 font-semibold ${h[x]}`,children:_}):null,d(k)?e(t.Description,{className:`m-0 text-(--neba-muted-fg) ${c[x]}`,children:k}):null]}),D?e(t.Close,{"aria-label":R??I.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(O)?e("div",{className:"min-w-0",children:O}):null]})})})]})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{Progress as s}from"@base-ui/react/progress";import{plateGapClasses as t,plateRadiusClasses as
|
|
1
|
+
"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as l from"react";import{Progress as s}from"@base-ui/react/progress";import{plateGapClasses as t,plateRadiusClasses as r,plateSizeClasses as n,progressAriaText as i,progressFraction as o,progressSlots as m,progressText as c}from"../../internal/progress.js";import{cx as u,metaTextClasses as f,stackGapClasses as d}from"../../internal/styles.js";export const ProgressBox=/*@__PURE__*/l.forwardRef(function({size:l="md",color:h="primary",count:x=4,value:b=null,min:p=0,max:g=100,label:v,showValue:y=!1,format:w,className:j,style:N,...M},V){const k=o(b,p,g),A=null===k,R=void 0!==w,T=Math.max(1,Math.floor(x));return a(s.Root,{ref:V,value:b??null,min:p,max:g,format:w,getAriaValueText:i(k,R),className:u("inline-flex flex-col",d[l],j??""),style:{...m(h),...N},...M,children:[v||y?a("div",{className:["flex items-baseline gap-2",v?"justify-between":"justify-end",f[l]].join(" "),children:[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=>c(k,e,R)}):null]}):null,e(s.Track,{className:`flex ${t[l]}`,children:Array.from({length:T},(a,s)=>e("span",{className:u("relative overflow-hidden bg-(--n-soft)","[box-shadow:var(--neba-plate-glass)]",n[l],r[l],A?"neba-plate-wave":""),style:A?{"--n-i":s}:void 0,children:A?null:e("span",{className:"absolute inset-y-0 start-0 bg-(--n-fill) [transition:width_var(--neba-duration-fill)_var(--neba-ease)]",style:{width:`${Math.min(100,Math.max(0,100*(k*T-s)))}%`}})},s))})]})});
|
|
@@ -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{
|
|
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 u,metaTextClasses as f}from"../../internal/styles.js";export const ProgressCircular=/*@__PURE__*/a.forwardRef(function({size:a="md",color:h="primary",value:d=null,min:x=0,max:k=100,label:p,showValue:b=!1,format:g,className:v,style:y,...$},N){const j=n(d,x,k),w=null===j,V=void 0!==g,D=o[a],L=c[a],P=D/2,R=P-L/2,W=2*Math.PI*R,_=w?`${.28*W} ${W}`:`${W}`,z=w?0:W*(1-j);return r(s.Root,{ref:N,value:d??null,min:x,max:k,format:g,getAriaValueText:t(j,V),className:m("inline-flex items-center",u[a],f[a],v??""),style:{...i(h),...y},...$,children:[r("svg",{className:w?"neba-ring-spin shrink-0":"shrink-0",width:D,height:D,viewBox:`0 0 ${D} ${D}`,fill:"none","aria-hidden":"true",children:[e("circle",{cx:P,cy:P,r:R,stroke:"var(--n-soft)",strokeWidth:L}),e("circle",{cx:P,cy:P,r:R,stroke:"var(--n-accent)",strokeWidth:L,strokeLinecap:"round",strokeDasharray:_,strokeDashoffset:z,transform:`rotate(-90 ${P} ${P})`,className:"[transition:stroke-dashoffset_var(--neba-duration-fill)_var(--neba-ease)]"})]}),p?e(s.Label,{className:"min-w-0 truncate text-(--neba-fg)",children:p}):null,b?e(s.Value,{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:e=>l(j,e,V)}):null]})});
|
|
@@ -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
|
|
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";export const ProgressLinear=/*@__PURE__*/a.forwardRef(function({size:a="md",color:c="primary",value:d=null,min:b=0,max:p=100,label:x,showValue:g=!1,format:h,className:j,style:w,...v},N){const y=t(d,b,p),V=null===y,k=void 0!==h;return l(r.Root,{ref:N,value:d??null,min:b,max:p,format:h,getAriaValueText:n(y,k),className:m("flex w-full flex-col",f[a],j??""),style:{...i(c),...w},...v,children:[x||g?l("div",{className:["flex items-baseline gap-2",x?"justify-between":"justify-end",u[a]].join(" "),children:[x?e(r.Label,{className:"min-w-0 truncate text-(--neba-fg)",children:x}):null,g?e(r.Value,{className:"shrink-0 tabular-nums text-(--neba-muted-fg)",children:e=>o(y,e,k)}):null]}):null,e(r.Track,{className:`relative w-full overflow-hidden rounded-full bg-(--n-soft) ${s[a]}`,children:e(r.Indicator,{className:["absolute rounded-full bg-(--n-fill)",V?"neba-sweep":"top-0 [transition:width_var(--neba-duration-fill)_var(--neba-ease)]"].join(" ")})})]})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{Radio as n}from"@base-ui/react/radio";import{RadioGroup as l}from"@base-ui/react/radio-group";import{Field as o}from"@base-ui/react/field";import{controlTextClasses as i,
|
|
1
|
+
"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as r from"react";import{Radio as n}from"@base-ui/react/radio";import{RadioGroup as l}from"@base-ui/react/radio-group";import{Field as o}from"@base-ui/react/field";import{controlTextClasses as i,cx as t,hitAreaClasses as s,metaTextClasses as c,surfaceClasses as d,tickDotClasses as b,tickRowLeadingClasses as f,tickSizeClasses as h,transitionClasses as m}from"../../internal/styles.js";const u=/*@__PURE__*/r.createContext({size:"md",color:"primary",readOnly:!1}),p=["relative inline-flex shrink-0 items-center justify-center rounded-full border",s,"[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",m,"active:[transition-duration:0ms]","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"].join(" "),v=[d,"cursor-pointer bg-(--n-panel) [border-color:var(--n-line)]","hover:bg-(--n-panel-hover) hover:[border-color:var(--n-line-hover)]","data-[checked]:bg-(--n-fill) data-[checked]:text-(--n-on-solid)","data-[checked]:[border-color:transparent]","data-[checked]:hover:bg-(--n-fill-hover)"].join(" "),x=[d,"cursor-default bg-(--n-panel) [border-color:var(--n-line)]","[filter:saturate(0.55)]","data-[checked]:bg-(--n-fill) data-[checked]:text-(--n-on-solid)","data-[checked]:[border-color:transparent]"].join(" "),g=["cursor-not-allowed bg-transparent [border-color:var(--neba-disabled-border)] shadow-none","data-[checked]:bg-(--neba-disabled-bg)"].join(" ");export const Radio=/*@__PURE__*/r.forwardRef(function({label:l,description:s,disabled:d=!1,className:m,style:N,...y},$){const j=r.useContext(u),k=y.readOnly??j.readOnly;return e(o.Root,{disabled:d,className:t("flex flex-col",m??""),style:N,children:a("div",{className:`flex items-start gap-2 ${i[j.size]} ${f}`,children:[e("span",{className:"flex h-[1lh] shrink-0 items-center",children:e(n.Root,{ref:$,className:[p,h[j.size],d?g:k?x:v].join(" "),disabled:d,...y,children:e(n.Indicator,{className:`rounded-full bg-current ${b[j.size]}`})})}),l||s?a("span",{className:"flex min-w-0 flex-col gap-0.5",children:[l?e(o.Label,{className:["leading-[1.4]",d?"text-(--neba-disabled-fg)":"cursor-pointer text-(--neba-fg)"].join(" "),children:l}):null,s?e(o.Description,{className:`${c[j.size]} text-(--neba-muted-fg)`,children:s}):null]}):null]})})});export const RadioGroup=/*@__PURE__*/r.forwardRef(function({size:n="md",color:i="primary",orientation:s="vertical",label:d,description:b,error:f,invalid:h,disabled:m=!1,readOnly:p=!1,className:v,style:x,children:g,...N},y){const $=null!=f&&!1!==f&&""!==f,j=h??$,k=j?"danger":i,R={"--n-fill":`var(--neba-${k}-fill)`,"--n-fill-hover":`var(--neba-${k}-fill-hover)`,"--n-on-solid":`var(--neba-${k}-on-solid)`,"--n-accent":`var(--neba-${k}-accent)`,"--n-panel":"var(--neba-panel)","--n-panel-hover":"var(--neba-panel-hover)","--n-line":`var(--neba-${k}-line)`,"--n-line-hover":`var(--neba-${k}-line-hover)`,"--n-ring":`var(--neba-${k}-ring)`},w=r.useMemo(()=>({size:n,color:k,readOnly:p}),[n,k,p]);return e(u.Provider,{value:w,children:a(o.Root,{disabled:m,invalid:j,className:t("flex flex-col gap-1.5",v??""),style:{...R,...x},children:[d?e(o.Label,{className:[c[n],"font-medium",m?"text-(--neba-disabled-fg)":"text-(--neba-fg)"].join(" "),children:d}):null,b?e(o.Description,{className:`${c[n]} text-(--neba-muted-fg)`,children:b}):null,e(l,{ref:y,disabled:m,readOnly:p,className:["flex","horizontal"===s?"flex-row flex-wrap gap-x-5 gap-y-2":"flex-col gap-2"].join(" "),...N,children:g}),e(o.Error,$?{match:!0,className:`${c[n]} text-(--n-accent)`,children:f}:{className:`${c[n]} text-(--n-accent)`})]})})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as n from"react";import{StarIcon as
|
|
1
|
+
"use client";import{jsx as e,jsxs as a}from"react/jsx-runtime";import*as n from"react";import{StarIcon as t,StarOutlineIcon as l}from"../../internal/icons.js";import{fillMessage as r,ratingMessages as i,useMessages as s}from"../../internal/i18n.js";import{controlSlots as o,cx as d,focusWithinRingClasses as c,gapClasses as m,iconSizeClasses as u,radiusClasses as h,srOnlyClasses as f,transitionClasses as b}from"../../internal/styles.js";const p="flex items-center justify-center";export const Rating=/*@__PURE__*/n.forwardRef(function({value:x,defaultValue:y=0,onValueChange:v,count:g=5,precision:j=1,icon:N,emptyIcon:M,clearable:w=!0,readOnly:k=!1,disabled:S=!1,name:C,required:L=!1,size:P="md",color:q="warning",locale:I,label:A,valueLabel:R,className:V,style:z,onPointerLeave:E,...F},O){const B=s(i,I),D=n.useId(),G=C??D,[H,J]=n.useState(y),K=void 0!==x,Q=K?x:H,[T,U]=n.useState(null),W=Math.max(1,Math.floor(g)),X=j>0&&j<=1?j:1,Y=Math.round(1/X),Z=Math.max(0,Math.min(W,T??Q)),$=n.useCallback(e=>R?R(e,W):e<=0?B.empty:r(B.value,{value:String(e),max:String(W)}),[R,W,B]),_=e=>{K||J(e),v?.(e)},ee=Array.from({length:W},(n,r)=>{const i=Math.max(0,Math.min(1,Z-r));return a("span",{className:d("relative inline-flex shrink-0",u[P],h.xs,k||S?"":c),children:[e("span",{className:[p,u[P],S?"text-(--neba-disabled-fg)":"text-(--n-empty)"].join(" "),children:M??e(l,{})}),e("span",{"aria-hidden":"true",className:"pointer-events-none absolute inset-y-0 start-0 overflow-hidden",style:{width:100*i+"%"},children:e("span",{className:[p,u[P],S?"text-(--neba-disabled-fg)":"text-(--n-fill)",b].join(" "),children:N??e(t,{})})}),k?null:Array.from({length:Y},(a,n)=>{const t=Number((r+(n+1)*X).toFixed(4));return e("label",{className:["absolute inset-y-0",S?"cursor-not-allowed":"cursor-pointer"].join(" "),style:{insetInlineStart:100*n/Y+"%",width:100/Y+"%"},onPointerEnter:()=>{S||U(t)},children:e("input",{type:"radio",className:f,name:G,value:t,checked:Q===t,disabled:S,required:L,"aria-label":$(t),onChange:()=>_(t),onClick:()=>{w&&Q===t&&_(0)}})},t)})]},r)}),ae=d("inline-flex items-center align-middle",m[P],S?"cursor-not-allowed":"",V??""),ne={...o(q,0,"solid"),"--n-empty":"color-mix(in oklab, var(--neba-muted-fg) 40%, transparent)",...z};return e("div",k?{ref:O,role:"img","aria-label":$(Math.max(0,Math.min(W,Q))),className:ae,style:ne,onPointerLeave:E,...F,children:ee}:{ref:O,role:"radiogroup","aria-label":A??B.label,"aria-disabled":S||void 0,"aria-required":L||void 0,className:ae,style:ne,onPointerLeave:e=>{U(null),E?.(e)},...F,children:ee})});
|