neba 1.7.0 → 1.8.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +13 -7
- package/dist/components/accordion/Accordion.js +1 -1
- package/dist/components/alert/Alert.js +1 -1
- package/dist/components/animate-appear/AnimateAppear.js +1 -1
- package/dist/components/animate-blink/AnimateBlink.js +1 -1
- package/dist/components/animate-fade/AnimateFade.js +1 -1
- package/dist/components/animate-grow/AnimateGrow.js +1 -1
- package/dist/components/animate-headline/AnimateHeadline.js +1 -1
- package/dist/components/animate-lighting/AnimateLighting.js +1 -1
- package/dist/components/animate-marquee/AnimateMarquee.js +1 -1
- package/dist/components/animate-rotate/AnimateRotate.js +1 -1
- package/dist/components/animate-slide/AnimateSlide.js +1 -1
- package/dist/components/animate-typing/AnimateTyping.js +1 -1
- package/dist/components/animate-zoom/AnimateZoom.js +1 -1
- package/dist/components/app-logo/AppLogo.d.ts +148 -0
- package/dist/components/app-logo/AppLogo.js +1 -0
- package/dist/components/app-logo/index.d.ts +2 -0
- package/dist/components/app-logo/index.js +1 -0
- package/dist/components/area-chart/AreaChart.js +1 -1
- package/dist/components/aspect-ratio/AspectRatio.js +1 -1
- package/dist/components/avatar/Avatar.js +1 -1
- package/dist/components/badge/Badge.js +1 -1
- package/dist/components/bar-chart/BarChart.js +1 -1
- package/dist/components/blockquote/Blockquote.js +1 -1
- package/dist/components/bottom-navigation/BottomNavigation.js +1 -1
- package/dist/components/box/Box.js +1 -1
- package/dist/components/breadcrumb/Breadcrumb.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/chip/Chip.js +1 -1
- package/dist/components/code-block/CodeBlock.d.ts +170 -0
- package/dist/components/code-block/CodeBlock.js +1 -0
- package/dist/components/code-block/index.d.ts +2 -0
- package/dist/components/code-block/index.js +1 -0
- package/dist/components/collapsible/Collapsible.js +1 -1
- package/dist/components/color-picker/ColorPicker.d.ts +1 -1
- package/dist/components/color-picker/ColorPicker.js +1 -1
- package/dist/components/combobox/Combobox.js +1 -1
- package/dist/components/container/Container.js +1 -1
- package/dist/components/data-table/DataTable.js +1 -1
- package/dist/components/date-picker/DatePicker.js +1 -1
- package/dist/components/date-range-picker/DateRangePicker.js +1 -1
- package/dist/components/date-time-picker/DateTimePicker.js +1 -1
- package/dist/components/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/file-picker/FilePicker.js +1 -1
- package/dist/components/floating-action-button/FloatingActionButton.js +1 -1
- package/dist/components/floating-bottom-navigation/FloatingBottomNavigation.js +1 -1
- package/dist/components/footer/Footer.d.ts +85 -0
- package/dist/components/footer/Footer.js +1 -0
- package/dist/components/footer/index.d.ts +2 -0
- package/dist/components/footer/index.js +1 -0
- package/dist/components/grid/Grid.js +1 -1
- package/dist/components/grid-container/GridContainer.js +1 -1
- package/dist/components/header/Header.d.ts +114 -0
- package/dist/components/header/Header.js +1 -0
- package/dist/components/header/index.d.ts +2 -0
- package/dist/components/header/index.js +1 -0
- package/dist/components/heatmap-chart/HeatmapChart.js +1 -1
- package/dist/components/highlight/Highlight.js +1 -1
- package/dist/components/how-to-steps/HowToSteps.d.ts +167 -0
- package/dist/components/how-to-steps/HowToSteps.js +1 -0
- package/dist/components/how-to-steps/index.d.ts +2 -0
- package/dist/components/how-to-steps/index.js +1 -0
- package/dist/components/icon/Icon.js +1 -1
- package/dist/components/icon-button/IconButton.js +1 -1
- package/dist/components/line-chart/LineChart.js +1 -1
- package/dist/components/list/List.js +1 -1
- package/dist/components/menu/Menu.js +1 -1
- package/dist/components/mockup/Mockup.js +1 -1
- 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.d.ts +144 -0
- package/dist/components/page-layout/PageLayout.js +1 -0
- package/dist/components/page-layout/index.d.ts +2 -0
- package/dist/components/page-layout/index.js +1 -0
- 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/scatter-chart/ScatterChart.js +1 -1
- package/dist/components/scroll-zone/ScrollZone.js +1 -1
- package/dist/components/segmented-button/SegmentedButton.js +1 -1
- package/dist/components/select/Select.js +1 -1
- package/dist/components/shortcut/Shortcut.js +1 -1
- package/dist/components/sidebar/Sidebar.d.ts +144 -0
- package/dist/components/sidebar/Sidebar.js +1 -0
- package/dist/components/sidebar/SidebarTrigger.d.ts +36 -0
- package/dist/components/sidebar/SidebarTrigger.js +1 -0
- package/dist/components/sidebar/index.d.ts +4 -0
- package/dist/components/sidebar/index.js +1 -0
- package/dist/components/skeleton/Skeleton.js +1 -1
- package/dist/components/slider/Slider.js +1 -1
- package/dist/components/sparkline/Sparkline.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/time-picker/TimePicker.js +1 -1
- package/dist/components/timeline/Timeline.js +1 -1
- package/dist/components/timeline-chart/TimelineChart.js +1 -1
- package/dist/components/toast/Toast.js +1 -1
- package/dist/components/toolbar/Toolbar.js +1 -1
- package/dist/components/tooltip/Tooltip.js +1 -1
- 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 +7 -0
- package/dist/index.js +1 -1
- package/dist/internal/animate.js +1 -1
- package/dist/internal/bottom-navigation.d.ts +4 -3
- package/dist/internal/bottom-navigation.js +1 -1
- package/dist/internal/button-group.js +1 -1
- package/dist/internal/calendar.js +1 -1
- package/dist/internal/chart-frame.js +1 -1
- package/dist/internal/chart.d.ts +3 -2
- package/dist/internal/color.d.ts +2 -2
- package/dist/internal/date.d.ts +3 -4
- package/dist/internal/highlight.d.ts +97 -0
- package/dist/internal/highlight.js +1 -0
- package/dist/internal/i18n.d.ts +85 -0
- package/dist/internal/i18n.js +1 -1
- package/dist/internal/icons.d.ts +20 -0
- package/dist/internal/icons.js +1 -1
- package/dist/internal/initials.d.ts +24 -0
- package/dist/internal/initials.js +1 -0
- package/dist/internal/menu.js +1 -1
- package/dist/internal/page-layout.d.ts +143 -0
- package/dist/internal/page-layout.js +1 -0
- package/dist/internal/styles.d.ts +11 -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 +473 -0
- package/package.json +8 -7
package/README.md
CHANGED
|
@@ -21,8 +21,8 @@ You install one package, add one line to your CSS, and import components. There
|
|
|
21
21
|
- **Accessible by construction** — real roles, labels, focus management and keyboard support, not `div`s with click handlers.
|
|
22
22
|
- **Dark mode with no work** — follows the system, and can be forced either way per subtree.
|
|
23
23
|
- **A design language, not a theme file** — a translucent acrylic surface with a hairline edge, one deliberate motion signature, and shadows that are opt-in.
|
|
24
|
-
- **ESM only**, TypeScript declarations included, and genuinely tree-shakeable — every component compiles to its own module, and importing one costs about what one costs. A `Button` is ~5 kB gzipped including its Base UI parts, a `Chip` is ~3 kB, and a twelve-component app is ~67 kB; the whole library, all one hundred and
|
|
25
|
-
- **
|
|
24
|
+
- **ESM only**, TypeScript declarations included, and genuinely tree-shakeable — every component compiles to its own module, and importing one costs about what one costs. A `Button` is ~5 kB gzipped including its Base UI parts, a `Chip` is ~3 kB, and a twelve-component app is ~67 kB; the whole library, all one hundred and twenty-six exports at once, is ~215 kB.
|
|
25
|
+
- **Two runtime dependencies** — Base UI, and `highlight.js`, which only [CodeBlock](https://neba.cdget.com/components/display/code-block) reaches and only through a dynamic import, so it never lands in a bundle that did not ask for it. React 18 or 19, Node.js 18 or later.
|
|
26
26
|
|
|
27
27
|
## Documentation
|
|
28
28
|
|
|
@@ -86,6 +86,12 @@ export default function SignIn() {
|
|
|
86
86
|
}
|
|
87
87
|
```
|
|
88
88
|
|
|
89
|
+
### Next.js and React Server Components
|
|
90
|
+
|
|
91
|
+
Every component carries `'use client'`, so it can be imported straight into a Server Component — no wrapper, no `transpilePackages` entry. The directive marks a boundary, not a page: the page stays a Server Component and only the components it renders reach the browser. The ordinary rule about that boundary still applies — an event handler defined in a Server Component cannot be passed across it.
|
|
92
|
+
|
|
93
|
+
The `neba` barrel and `neba/locales` are deliberately left unmarked, so a Server Component importing the barrel reaches the components behind it rather than a boundary of its own, and `registerMessages` stays a plain function. Bundlers that do not implement Server Components ignore the directive entirely.
|
|
94
|
+
|
|
89
95
|
A few components provide context and are mounted once, near the root, only if you use them — `ToastProvider` (paired with the `useToast()` hook) and `TooltipProvider`.
|
|
90
96
|
|
|
91
97
|
Every component is also its own entry point, named after its folder:
|
|
@@ -115,7 +121,7 @@ Call it once, at module scope, before your first render. Then a `locale` prop tr
|
|
|
115
121
|
<Dialog locale="ko" title="설정" showClose />
|
|
116
122
|
```
|
|
117
123
|
|
|
118
|
-
A registered language costs about 1.
|
|
124
|
+
A registered language costs about 1.9 kB gzipped and you pay only for the ones you name. Tags are matched by script, then by region, then by language — registering `ko` answers `ko-KR`, and `zhHans` registered as `zh-hans` answers `zh-CN` and a bare `zh`. Available: `ko`, `ja`, `zhHans`, `zhHant`, `es`, `pt`, `fr`, `de`, `it`, `nl`, `pl`, `ru`, `tr`, `ar`, `hi`, `id`, `vi`, `th`, each also its own entry point (`neba/locales/ko`).
|
|
119
125
|
|
|
120
126
|
Anything the platform already knows — month names, weekday names, AM/PM, number and date formats — comes from `Intl` and needs no registration. And every string a component invents also has a prop that overrides it, so a language Neba does not carry is never a dead end.
|
|
121
127
|
|
|
@@ -142,19 +148,19 @@ Placement props are logical, not physical — `start`/`end` rather than `left`/`
|
|
|
142
148
|
|
|
143
149
|
**Inputs** — Button, IconButton, ButtonGroup, SegmentedButton, FloatingActionButton (with FloatingAction), TextField, NumberField, OtpField, Select, Combobox, Checkbox, RadioGroup, Switch, Slider, Rating, Menu (with submenus, checkbox and radio items), ContextMenu, FilePicker, Pagination, BottomNavigation, FloatingBottomNavigation, ColorPicker, DatePicker, TimePicker, DateTimePicker, DateRangePicker
|
|
144
150
|
|
|
145
|
-
**Surfaces** — Box, Card, Accordion, Collapsible, Tabs, Carousel, Toolbar, Pill, Spoiler, ChatBubble, Drawer, Popover, Mockup, WindowPane
|
|
151
|
+
**Surfaces** — Box, Card, Accordion, Collapsible, Tabs, Carousel, Toolbar, Pill, Spoiler, HowToSteps, ChatBubble, Drawer, Popover, Mockup, WindowPane
|
|
146
152
|
|
|
147
|
-
**Display** — Typography, TextLink, Blockquote, Highlight, Divider, Chip, Badge, Avatar, Icon, Shortcut, List, Table, DataTable, Timeline, Breadcrumb, TreeView
|
|
153
|
+
**Display** — Typography, TextLink, Blockquote, Highlight, Divider, Chip, Badge, Avatar, AppLogo, Icon, Shortcut, List, Table, DataTable, CodeBlock, Timeline, Breadcrumb, TreeView
|
|
148
154
|
|
|
149
155
|
**Charts** — Statistic, Sparkline, LineChart, AreaChart, BarChart, PieChart, ScatterChart, TimelineChart, HeatmapChart
|
|
150
156
|
|
|
151
157
|
**Feedback** — Alert, Dialog, Toast, Tooltip, Overlay, Skeleton, Empty, ProgressLinear, ProgressCircular, ProgressBox
|
|
152
158
|
|
|
153
|
-
**Layout** — Container, Grid (with GridContainer), Panes, AspectRatio, ScrollZone
|
|
159
|
+
**Layout** — PageLayout (with Header, Footer and Sidebar), Container, Grid (with GridContainer), Panes, AspectRatio, ScrollZone
|
|
154
160
|
|
|
155
161
|
**Transitions** — AnimateFade, AnimateGrow, AnimateZoom, AnimateSlide, AnimateRotate, AnimateBlink, AnimateAppear, AnimateTyping, AnimateLighting, AnimateMarquee, AnimateHeadline
|
|
156
162
|
|
|
157
|
-
**Recently added** — ScrollZone, FloatingBottomNavigation, WindowPane, Collapsible, Rating, BottomNavigation, FloatingActionButton, the charts (Sparkline, LineChart, AreaChart, BarChart, PieChart, ScatterChart, TimelineChart, HeatmapChart), DataTable, Empty, Mockup, the eleven `Animate*` wrappers, ColorPicker, Drawer, Popover, Skeleton, AspectRatio
|
|
163
|
+
**Recently added** — CodeBlock, HowToSteps, ScrollZone, FloatingBottomNavigation, WindowPane, Collapsible, Rating, BottomNavigation, FloatingActionButton, the charts (Sparkline, LineChart, AreaChart, BarChart, PieChart, ScatterChart, TimelineChart, HeatmapChart), DataTable, Empty, Mockup, the eleven `Animate*` wrappers, ColorPicker, Drawer, Popover, Skeleton, AspectRatio
|
|
158
164
|
|
|
159
165
|
Each one has its own page — live previews, every prop, and the variations worth seeing — under [**All components**](https://neba.cdget.com/components/).
|
|
160
166
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as a from"react";import{Accordion as t}from"@base-ui/react/accordion";import{boxPaddingXClasses as l,boxPaddingYClasses as
|
|
1
|
+
"use client";import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as a from"react";import{Accordion as t}from"@base-ui/react/accordion";import{boxPaddingXClasses as l,boxPaddingYClasses as i}from"../box/Box.js";import{ChevronIcon as r}from"../../internal/icons.js";import{focusRingClasses as s,gapClasses as o,hasContent as d,iconClasses as c,metaTextClasses as m,radiusClasses as f,sheetBodyClasses as u,sheetHeaderGapClasses as h,sheetTitleClasses as b,surfaceClasses as x,surfaceSlots as p,transitionClasses as v}from"../../internal/styles.js";const g=/*@__PURE__*/a.createContext({size:"md",density:"default",dividers:!0}),j={solid:[x,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[x,"border text-(--neba-fg) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-transparent"},N={xs:f.xs,sm:f.xs,md:f.sm,lg:f.sm,xl:f.md};export const Accordion=/*@__PURE__*/a.forwardRef(function({variant:n="outline",size:l="md",color:i="primary",density:r="default",elevation:s=0,multiple:o=!1,value:d,defaultValue:c,onValueChange:m,dividers:u=!0,disabled:h=!1,hiddenUntilFound:b=!1,keepMounted:x=!1,className:N,style:w,children:y,...k},z){const B=a.useMemo(()=>({size:l,density:r,dividers:u}),[l,r,u]),C=["flex flex-col",f[l],j[n],v,u?"overflow-hidden [&>div+div]:border-t [&>div+div]:[border-color:var(--n-line)]":"p-1",N??""].filter(Boolean).join(" ");return e(g.Provider,{value:B,children:e(t.Root,{ref:z,multiple:o,value:d,defaultValue:c,onValueChange:e=>m?.(e),disabled:h,hiddenUntilFound:b,keepMounted:x,className:C,style:{...p(i,s),...w},...k,children:y})})});export const AccordionItem=/*@__PURE__*/a.forwardRef(function({value:f,title:x,subtitle:p,startIcon:j,action:w,disabled:y=!1,className:k,children:z,...B},C){const{size:V,density:$,dividers:_}=a.useContext(g),A=l[$][V],I=i[$][V];return n(t.Item,{ref:C,value:f,disabled:y,className:["flex flex-col",k??""].filter(Boolean).join(" "),...B,children:[n(t.Header,{className:"m-0 flex w-full items-center [font:inherit]",children:[n(t.Trigger,{className:["flex min-w-0 flex-1 cursor-pointer items-center text-start",A,I,o[V],v,c,s,_?"":N[V],"hover:bg-(--n-soft)","data-[panel-open]:text-(--n-accent)","disabled:cursor-not-allowed disabled:bg-transparent disabled:text-(--neba-disabled-fg)"].filter(Boolean).join(" "),children:[d(j)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:j}):null,n("span",{className:`flex min-w-0 flex-1 flex-col ${h[V]}`,children:[d(x)?e("span",{className:`truncate font-semibold ${b[V]}`,children:x}):null,d(p)?e("span",{className:`truncate text-(--neba-muted-fg) ${m[V]}`,children:p}):null]}),e("span",{className:["flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)","[transition:rotate_var(--neba-duration)_var(--neba-ease)]","data-[panel-open]:rotate-180"].join(" "),children:e(r,{})})]}),d(w)?e("span",{className:`flex shrink-0 items-center ${A}`,children:w}):null]}),e(t.Panel,{className:["h-(--accordion-panel-height) overflow-hidden","[transition:height_var(--neba-duration)_var(--neba-ease)]","data-[starting-style]:h-0 data-[ending-style]:h-0"].join(" "),children:e("div",{className:["text-(--neba-muted-fg)",u[V],A,"compact"===$?"pb-2":"pb-4"].join(" "),children:z})})]})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{boxPaddingClasses as l}from"../box/Box.js";import{actionMessages as i,useMessages as s}from"../../internal/i18n.js";import{CloseIcon as a,severityIcon as o}from"../../internal/icons.js";import{transitionProps as r}from"../../internal/animate.js";import{controlSlots as c,hasContent as d,iconClasses as m,radiusClasses as f,sheetBodyClasses as u,sheetHeaderGapClasses as x,sheetSectionGapClasses as b,sheetTitleClasses as v,surfaceClasses as h,transitionClasses as p}from"../../internal/styles.js";const j={solid:[h,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[h,"border text-(--neba-fg) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-(--n-soft)"},y={solid:"",outline:"text-(--n-accent)",text:"text-(--n-accent)"},g={solid:"",outline:"text-(--neba-muted-fg)",text:"text-(--neba-muted-fg)"},N={primary:"status",secondary:"status",info:"status",success:"status",warning:"alert",danger:"alert"};export const Alert=/*@__PURE__*/n.forwardRef(function({variant:n="outline",size:h="md",color:w="info",density:k="default",elevation:$=0,title:_,icon:z,action:B,onClose:C,locale:A,closeLabel:L,transition:R,className:q,style:D,children:E,...F},G){const H=s(i,A),I=void 0===z?o(w):z,J=y[n],K=d(_),M=r(R);return t("div",{ref:G,role:N[w],className:["flex w-full items-start",l[k][h],f[h],b[h],u[h],p,j[n],m,M.className,q??""].filter(Boolean).join(" "),style:{...c(w,$,n),...M.style,...D},...F,children:[d(I)?e("span",{className:`flex h-[1lh] shrink-0 items-center ${J}`,children:I}):null,t("div",{className:`flex min-w-0 flex-1 flex-col ${x[h]}`,children:[K?e("div",{className:`neba-title font-semibold ${v[h]} ${J}`,children:_}):null,d(E)?e("div",{className:K?g[n]:void 0,children:E}):null]}),d(B)?e("div",{className:"flex h-[1lh] shrink-0 items-center",children:B}):null,C?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:e("button",{type:"button","aria-label":L??H.dismiss,onClick:C,className:["inline-flex size-[1.15em] cursor-pointer items-center justify-center rounded-full","opacity-70 [transition:opacity_var(--neba-duration)_var(--neba-ease)]","hover:opacity-100 focus-visible:opacity-100","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"].join(" "),children:e(a,{})})}):null]})});
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{boxPaddingClasses as l}from"../box/Box.js";import{actionMessages as i,useMessages as s}from"../../internal/i18n.js";import{CloseIcon as a,severityIcon as o}from"../../internal/icons.js";import{transitionProps as r}from"../../internal/animate.js";import{controlSlots as c,hasContent as d,iconClasses as m,radiusClasses as f,sheetBodyClasses as u,sheetHeaderGapClasses as x,sheetSectionGapClasses as b,sheetTitleClasses as v,surfaceClasses as h,transitionClasses as p}from"../../internal/styles.js";const j={solid:[h,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[h,"border text-(--neba-fg) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-(--n-soft)"},y={solid:"",outline:"text-(--n-accent)",text:"text-(--n-accent)"},g={solid:"",outline:"text-(--neba-muted-fg)",text:"text-(--neba-muted-fg)"},N={primary:"status",secondary:"status",info:"status",success:"status",warning:"alert",danger:"alert"};export const Alert=/*@__PURE__*/n.forwardRef(function({variant:n="outline",size:h="md",color:w="info",density:k="default",elevation:$=0,title:_,icon:z,action:B,onClose:C,locale:A,closeLabel:L,transition:R,className:q,style:D,children:E,...F},G){const H=s(i,A),I=void 0===z?o(w):z,J=y[n],K=d(_),M=r(R);return t("div",{ref:G,role:N[w],className:["flex w-full items-start",l[k][h],f[h],b[h],u[h],p,j[n],m,M.className,q??""].filter(Boolean).join(" "),style:{...c(w,$,n),...M.style,...D},...F,children:[d(I)?e("span",{className:`flex h-[1lh] shrink-0 items-center ${J}`,children:I}):null,t("div",{className:`flex min-w-0 flex-1 flex-col ${x[h]}`,children:[K?e("div",{className:`neba-title font-semibold ${v[h]} ${J}`,children:_}):null,d(E)?e("div",{className:K?g[n]:void 0,children:E}):null]}),d(B)?e("div",{className:"flex h-[1lh] shrink-0 items-center",children:B}):null,C?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:e("button",{type:"button","aria-label":L??H.dismiss,onClick:C,className:["inline-flex size-[1.15em] cursor-pointer items-center justify-center rounded-full","opacity-70 [transition:opacity_var(--neba-duration)_var(--neba-ease)]","hover:opacity-100 focus-visible:opacity-100","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2"].join(" "),children:e(a,{})})}):null]})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e}from"react/jsx-runtime";import*as
|
|
1
|
+
"use client";import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{useRender as a}from"@base-ui/react/use-render";import{animBaseClass as r,animationClasses as s,animationSlots as n,isInfinite as i,slideOffsets as l,useAnimationRun as o}from"../../internal/animate.js";import{cx as m}from"../../internal/styles.js";export const AnimateAppear=/*@__PURE__*/t.forwardRef(function({duration:d=420,delay:p=0,easing:c,repeat:f=1,alternate:y,paused:u,trigger:h="mount",play:g,once:x=!0,threshold:N=.2,stagger:j=80,from:b="bottom",distance:A="0.75rem",fade:E=!0,reverse:$=!1,render:v,className:w,style:C,children:R,...V},k){const q=o({trigger:h,play:g,once:x,threshold:N,paused:u,infinite:i(f)}),{x:z,y:B}=l(b,A),D=t.Children.toArray(R),F=`${r} ${s.slide}`,G=D.map((a,r)=>{const s=$?D.length-1-r:r,i=n({duration:d,delay:p+s*j,easing:c,repeat:f,alternate:y,x:z,y:B,opacity:E?0:1});if(!t.isValidElement(a))return e("span",{className:F,style:i,children:a},r);const l=a.props;return t.cloneElement(a,{className:m(F,l.className),style:{...i,...l.style}})});return a({render:v,ref:[k,q.ref],props:{...V,className:w,style:{"--n-anim-state":q.state,...C},...q.handlers,"data-neba-animation":"appear","data-state":q.state,children:G}})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,useAnimateElement as a}from"../../internal/animate.js";import{cx as n}from"../../internal/styles.js";export const AnimateBlink=/*@__PURE__*/e.forwardRef(function({duration:e=900,delay:i=0,easing:s,repeat:o="infinite",alternate:l,paused:p,trigger:
|
|
1
|
+
"use client";import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,useAnimateElement as a}from"../../internal/animate.js";import{cx as n}from"../../internal/styles.js";export const AnimateBlink=/*@__PURE__*/e.forwardRef(function({duration:e=900,delay:i=0,easing:s,repeat:o="infinite",alternate:l,paused:p,trigger:c="mount",play:m,once:d=!0,threshold:f=.2,min:u=0,render:y,className:g,style:h,children:N,...b},j){const k=a({effect:"blink",duration:e,delay:i,easing:s,repeat:o,alternate:l,opacity:u,trigger:c,play:m,once:d,threshold:f,paused:p,infinite:t(o)});return r({render:y,ref:[j,k.ref],props:{...b,className:n(k.className,g),style:{...k.style,...h},...k.props,children:N}})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as
|
|
1
|
+
"use client";import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,useAnimateElement as a}from"../../internal/animate.js";import{cx as n}from"../../internal/styles.js";export const AnimateFade=/*@__PURE__*/e.forwardRef(function({duration:e=320,delay:s=0,easing:o,repeat:i=1,alternate:l,paused:d,trigger:m="mount",play:p,once:c=!0,threshold:f=.2,mode:u="in",from:y=0,render:g,className:h,style:N,children:j,...b},w){const x=a({effect:"fade",duration:e,delay:s,easing:o,repeat:i,alternate:l,mode:u,opacity:y,trigger:m,play:p,once:c,threshold:f,paused:d,infinite:t(i)});return r({render:g,ref:[w,x.ref],props:{...b,className:n(x.className,h),style:{...x.style,...N},...x.props,children:j}})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,useAnimateElement as a}from"../../internal/animate.js";import{cx as n}from"../../internal/styles.js";export const AnimateGrow=/*@__PURE__*/e.forwardRef(function({duration:e=340,delay:o=0,easing:s,repeat:i=1,alternate:l,paused:m,trigger:
|
|
1
|
+
"use client";import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,useAnimateElement as a}from"../../internal/animate.js";import{cx as n}from"../../internal/styles.js";export const AnimateGrow=/*@__PURE__*/e.forwardRef(function({duration:e=340,delay:o=0,easing:s,repeat:i=1,alternate:l,paused:m,trigger:c="mount",play:d,once:p=!0,threshold:f=.2,mode:u="in",from:g=.8,origin:y="center",fade:h=!0,render:w,className:N,style:j,children:b,...x},A){const G=a({effect:"grow",duration:e,delay:o,easing:s,repeat:i,alternate:l,mode:u,scale:g,opacity:h?0:1,trigger:c,play:d,once:p,threshold:f,paused:m,infinite:t(i)});return r({render:w,ref:[A,G.ref],props:{...x,className:n(G.className,N),style:{transformOrigin:y,...G.style,...j},...G.props,children:b}})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{isInfinite as n,lengthValue as a,useAnimationRun as r,usePrefersReducedMotion as i}from"../../internal/animate.js";import{cx as s}from"../../internal/styles.js";export const AnimateHeadline=/*@__PURE__*/t.forwardRef(function({duration:l=480,delay:o=0,easing:u,repeat:c="infinite",paused:m,trigger:d="mount",play:f,once:h=!0,threshold:p=.2,interval:g=2600,index:v,defaultIndex:y=0,onIndexChange:x,loop:b=!0,rise:E="100%",className:N,style:j,children:T,...C},R){const k=r({trigger:d,play:f,once:h,threshold:p,paused:m,infinite:n(c)}),A=i(),I=t.Children.toArray(T),M=I.length,[S,w]=t.useState(y),H=Math.min(v??S,Math.max(M-1,0)),[V,$]=t.useState(null),q=t.useRef(H);t.useEffect(()=>{q.current!==H&&($(q.current),q.current=H)},[H]),t.useEffect(()=>{if(null===V)return;const e=setTimeout(()=>$(null),l);return()=>clearTimeout(e)},[V,l]);const z=t.useCallback(()=>{const e=H+1;if(e>=M){if(!b)return;return void 0===v&&w(0),void x?.(0)}void 0===v&&w(e),x?.(e)},[H,M,b,v,x]),B=t.useRef(!1);return t.useEffect(()=>{if(void 0!==v||M<2||"running"!==k.state)return;if(!b&&H===M-1)return;const e=setTimeout(()=>{B.current=!0,z()},g+(B.current?0:o));return()=>clearTimeout(e)},[v,M,k.state,g,o,z,b,H]),e("div",{ref:e=>{k.ref(e),"function"==typeof R?R(e):R&&(R.current=e)},className:s("neba-headline",N),style:{"--n-anim-duration":`${l}ms`,"--n-anim-rise":a(E),...u?{"--n-anim-ease":u}:{},"--n-anim-state":k.state,...j},"data-neba-animation":"headline","data-state":k.state,...k.handlers,...C,children:I.map((n,a)=>{const r=a===H?"active":a!==V||A?void 0:"leaving";if(!t.isValidElement(n))return e("span",{className:"neba-headline-item","data-state":r,children:n},a);const i=n.props;return t.cloneElement(n,{key:a,className:s("neba-headline-item",i.className),"data-state":r})})})});
|
|
1
|
+
"use client";import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{isInfinite as n,lengthValue as a,useAnimationRun as r,usePrefersReducedMotion as i}from"../../internal/animate.js";import{cx as s}from"../../internal/styles.js";export const AnimateHeadline=/*@__PURE__*/t.forwardRef(function({duration:l=480,delay:o=0,easing:u,repeat:c="infinite",paused:m,trigger:d="mount",play:f,once:h=!0,threshold:p=.2,interval:g=2600,index:v,defaultIndex:y=0,onIndexChange:x,loop:b=!0,rise:E="100%",className:N,style:j,children:T,...C},R){const k=r({trigger:d,play:f,once:h,threshold:p,paused:m,infinite:n(c)}),A=i(),I=t.Children.toArray(T),M=I.length,[S,w]=t.useState(y),H=Math.min(v??S,Math.max(M-1,0)),[V,$]=t.useState(null),q=t.useRef(H);t.useEffect(()=>{q.current!==H&&($(q.current),q.current=H)},[H]),t.useEffect(()=>{if(null===V)return;const e=setTimeout(()=>$(null),l);return()=>clearTimeout(e)},[V,l]);const z=t.useCallback(()=>{const e=H+1;if(e>=M){if(!b)return;return void 0===v&&w(0),void x?.(0)}void 0===v&&w(e),x?.(e)},[H,M,b,v,x]),B=t.useRef(!1);return t.useEffect(()=>{if(void 0!==v||M<2||"running"!==k.state)return;if(!b&&H===M-1)return;const e=setTimeout(()=>{B.current=!0,z()},g+(B.current?0:o));return()=>clearTimeout(e)},[v,M,k.state,g,o,z,b,H]),e("div",{ref:e=>{k.ref(e),"function"==typeof R?R(e):R&&(R.current=e)},className:s("neba-headline",N),style:{"--n-anim-duration":`${l}ms`,"--n-anim-rise":a(E),...u?{"--n-anim-ease":u}:{},"--n-anim-state":k.state,...j},"data-neba-animation":"headline","data-state":k.state,...k.handlers,...C,children:I.map((n,a)=>{const r=a===H?"active":a!==V||A?void 0:"leaving";if(!t.isValidElement(n))return e("span",{className:"neba-headline-item","data-state":r,children:n},a);const i=n.props;return t.cloneElement(n,{key:a,className:s("neba-headline-item",i.className),"data-state":r})})})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as n,useAnimateElement as a}from"../../internal/animate.js";import{cx as t,radiusClasses as i}from"../../internal/styles.js";export const AnimateLighting=/*@__PURE__*/e.forwardRef(function({duration:e=3e3,delay:o=0,easing:l,repeat:s="infinite",alternate:m,paused:d,trigger:p="mount",play:
|
|
1
|
+
"use client";import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as n,useAnimateElement as a}from"../../internal/animate.js";import{cx as t,radiusClasses as i}from"../../internal/styles.js";export const AnimateLighting=/*@__PURE__*/e.forwardRef(function({duration:e=3e3,delay:o=0,easing:l,repeat:s="infinite",alternate:m,paused:d,trigger:p="mount",play:c,once:g=!0,threshold:u=.2,color:f="primary",glow:h,size:y="md",spread:w=3,arc:b=50,blur:$=4,reverse:x=!1,render:j,className:v,style:N,children:z,...A},L){const R=a({effect:null,duration:e,delay:o,easing:l,repeat:s,alternate:m,mode:x?"out":"in",trigger:p,play:c,once:g,threshold:u,paused:d,infinite:n(s)});return r({render:j,ref:[L,R.ref],props:{...A,className:t("neba-anim-lighting",i[y],v),style:{...R.style,"--n-anim-glow":h??`var(--neba-${f}-accent)`,"--n-anim-glow-width":`${w}px`,"--n-anim-glow-arc":`${b}deg`,"--n-anim-glow-blur":`${$}px`,...N},...R.props,"data-neba-animation":"lighting",children:z}})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{isInfinite as r,lengthValue as n,useAnimationRun as a}from"../../internal/animate.js";import{cx as i}from"../../internal/styles.js";export const AnimateMarquee=/*@__PURE__*/t.forwardRef(function({duration:s,delay:o=0,repeat:m="infinite",alternate:u,paused:l,trigger:c="mount",play:d,once:f=!0,threshold:p=.2,easing:h,orientation:v="horizontal",reverse:g=!1,speed:y=60,gap:b="2rem",copies:q=2,pauseOnHover:R=!0,className:j,style:x,children:w,...z},M){const N=a({trigger:c,play:d,once:f,threshold:p,paused:l,infinite:r(m)}),O=t.useRef(null),S=t.useRef(null),[A,G]=t.useState(0),H="vertical"===v;t.useEffect(()=>{const e=O.current,t=S.current;if(!e||!t)return;const r=()=>{const r=getComputedStyle(e),n=parseFloat(H?r.rowGap:r.columnGap)||0,a=H?t.offsetHeight:t.offsetWidth;G(a+n)};if(r(),"undefined"==typeof ResizeObserver)return;const n=new ResizeObserver(r);return n.observe(t),n.observe(e),()=>n.disconnect()},[H,w]);const $=s??(A>0?A/y*1e3:12e3);return e("div",{ref:e=>{O.current=e,N.ref(e),"function"==typeof M?M(e):M&&(M.current=e)},className:i("neba-marquee",H&&"neba-marquee-vertical",j),style:{"--n-anim-gap":n(b),...h?{"--n-anim-ease":h}:{},"--n-anim-duration":`${Math.round($)}ms`,"--n-anim-delay":`${o}ms`,"--n-anim-repeat":"infinite"===m?"infinite":String(m),"--n-anim-direction":g?u?"alternate-reverse":"reverse":u?"alternate":"normal","--n-anim-state":N.state,...x},"data-neba-animation":"marquee","data-state":N.state,"data-pause-on-hover":R?"":void 0,...N.handlers,...z,children:Array.from({length:Math.max(1,q)},(t,r)=>(t=>e("div",{ref:0===t?S:void 0,className:"neba-marquee-track","aria-hidden":0===t?void 0:"true",children:w},t))(r))})});
|
|
1
|
+
"use client";import{jsx as e}from"react/jsx-runtime";import*as t from"react";import{isInfinite as r,lengthValue as n,useAnimationRun as a}from"../../internal/animate.js";import{cx as i}from"../../internal/styles.js";export const AnimateMarquee=/*@__PURE__*/t.forwardRef(function({duration:s,delay:o=0,repeat:m="infinite",alternate:u,paused:l,trigger:c="mount",play:d,once:f=!0,threshold:p=.2,easing:h,orientation:v="horizontal",reverse:g=!1,speed:y=60,gap:b="2rem",copies:q=2,pauseOnHover:R=!0,className:j,style:x,children:w,...z},M){const N=a({trigger:c,play:d,once:f,threshold:p,paused:l,infinite:r(m)}),O=t.useRef(null),S=t.useRef(null),[A,G]=t.useState(0),H="vertical"===v;t.useEffect(()=>{const e=O.current,t=S.current;if(!e||!t)return;const r=()=>{const r=getComputedStyle(e),n=parseFloat(H?r.rowGap:r.columnGap)||0,a=H?t.offsetHeight:t.offsetWidth;G(a+n)};if(r(),"undefined"==typeof ResizeObserver)return;const n=new ResizeObserver(r);return n.observe(t),n.observe(e),()=>n.disconnect()},[H,w]);const $=s??(A>0?A/y*1e3:12e3);return e("div",{ref:e=>{O.current=e,N.ref(e),"function"==typeof M?M(e):M&&(M.current=e)},className:i("neba-marquee",H&&"neba-marquee-vertical",j),style:{"--n-anim-gap":n(b),...h?{"--n-anim-ease":h}:{},"--n-anim-duration":`${Math.round($)}ms`,"--n-anim-delay":`${o}ms`,"--n-anim-repeat":"infinite"===m?"infinite":String(m),"--n-anim-direction":g?u?"alternate-reverse":"reverse":u?"alternate":"normal","--n-anim-state":N.state,...x},"data-neba-animation":"marquee","data-state":N.state,"data-pause-on-hover":R?"":void 0,...N.handlers,...z,children:Array.from({length:Math.max(1,q)},(t,r)=>(t=>e("div",{ref:0===t?S:void 0,className:"neba-marquee-track","aria-hidden":0===t?void 0:"true",children:w},t))(r))})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,useAnimateElement as a}from"../../internal/animate.js";import{cx as n}from"../../internal/styles.js";export const AnimateRotate=/*@__PURE__*/e.forwardRef(function({duration:e=460,delay:o=0,easing:i,repeat:s=1,alternate:l,paused:d,trigger:m="mount",play:
|
|
1
|
+
"use client";import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,useAnimateElement as a}from"../../internal/animate.js";import{cx as n}from"../../internal/styles.js";export const AnimateRotate=/*@__PURE__*/e.forwardRef(function({duration:e=460,delay:o=0,easing:i,repeat:s=1,alternate:l,paused:d,trigger:m="mount",play:c,once:p=!0,threshold:f=.2,mode:g="in",from:u=-180,to:y=0,origin:h="center",fade:N=!0,render:j,className:R,style:$,children:b,...w},x){const A=a({effect:"rotate",duration:e,delay:o,easing:i,repeat:s,alternate:l,mode:g,angle:`${u}deg`,angleTo:`${y}deg`,opacity:N?0:1,trigger:m,play:c,once:p,threshold:f,paused:d,infinite:t(s)});return r({render:j,ref:[x,A.ref],props:{...w,className:n(A.className,R),style:{transformOrigin:h,...A.style,...$},...A.props,children:b}})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,slideOffsets as a,useAnimateElement as n}from"../../internal/animate.js";import{cx as
|
|
1
|
+
"use client";import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,slideOffsets as a,useAnimateElement as n}from"../../internal/animate.js";import{cx as s}from"../../internal/styles.js";export const AnimateSlide=/*@__PURE__*/e.forwardRef(function({duration:e=380,delay:o=0,easing:i,repeat:l=1,alternate:d,paused:m,trigger:c="mount",play:p,once:f=!0,threshold:y=.2,mode:u="in",from:g="bottom",distance:h="100%",fade:x=!0,render:N,className:b,style:j,children:w,...A},R){const{x:S,y:k}=a(g,h),q=n({effect:"slide",duration:e,delay:o,easing:i,repeat:l,alternate:d,mode:u,x:S,y:k,opacity:x?0:1,trigger:c,play:p,once:f,threshold:y,paused:m,infinite:t(l)});return r({render:N,ref:[R,q.ref],props:{...A,className:s(q.className,b),style:{...q.style,...j},...q.props,children:w}})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{isInfinite as n,useAnimationRun as a,usePrefersReducedMotion as i}from"../../internal/animate.js";import{cx as s,srOnlyClasses as
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{isInfinite as n,useAnimationRun as a,usePrefersReducedMotion as i}from"../../internal/animate.js";import{cx as s,srOnlyClasses as u}from"../../internal/styles.js";function o(e){return"string"==typeof e||"number"==typeof e?String(e):Array.isArray(e)?e.map(o).join(""):""}export const AnimateTyping=/*@__PURE__*/r.forwardRef(function({text:c,speed:m=24,hold:f=1400,erase:l=!1,eraseSpeed:d,caret:p=!0,caretChar:h="|",duration:g,delay:y=0,repeat:x=1,paused:T,trigger:j="mount",play:v,once:N=!0,threshold:S=.2,className:w,style:M,children:b,...A},I){const E=a({trigger:j,play:v,once:N,threshold:S,paused:T,infinite:n(x)}),R=i(),C=c??o(b),k=r.useMemo(()=>function(e,t){if("undefined"!=typeof Intl&&"Segmenter"in Intl)return[...new Intl.Segmenter(t,{granularity:"grapheme"}).segment(e)].map(e=>e.segment);return[...e]}(C),[C]),q=k.length,[z,B]=r.useState(0),D=r.useRef(0),F=g&&q>0?g/q:1e3/Math.max(m,1),G=1e3/Math.max(d??2*m,1);return r.useEffect(()=>{D.current=0},[q]),r.useEffect(()=>{if(R||0===q)return void B(q);if(!E.started)return D.current=0,void B(0);if(T)return;let e,t=!1,r=D.current,n=1,a=!1;const i="infinite"===x?1/0:Math.max(1,x);if(r>=q&&1===i)return;const s=()=>{if(!t){if(a)return r-=1,D.current=r,B(r),r<=0&&(a=!1,n+=1),void(e=setTimeout(s,a?G:F));if(r+=1,D.current=r,B(r),r<q)e=setTimeout(s,F);else if(!(n>=i)){if(l)return a=!0,void(e=setTimeout(s,f));n+=1,e=setTimeout(()=>{t||(r=0,D.current=0,B(0),e=setTimeout(s,F))},f)}}};return B(r),e=setTimeout(s,0===r?y:F),()=>{t=!0,clearTimeout(e)}},[E.started,T,R,q,F,G,y,f,l,x]),t("div",{ref:e=>{E.ref(e),"function"==typeof I?I(e):I&&(I.current=e)},className:w,style:M,"data-neba-animation":"typing","data-state":E.state,...E.handlers,...A,children:[e("span",{className:u,children:C}),t("span",{"aria-hidden":"true",className:"whitespace-pre-wrap",children:[k.slice(0,z).join(""),p?e("span",{className:s("neba-typing-caret"),children:h}):null]})]})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,useAnimateElement as a}from"../../internal/animate.js";import{cx as n}from"../../internal/styles.js";export const AnimateZoom=/*@__PURE__*/e.forwardRef(function({duration:e=340,delay:o=0,easing:s,repeat:i=1,alternate:l,paused:m,trigger:
|
|
1
|
+
"use client";import*as e from"react";import{useRender as r}from"@base-ui/react/use-render";import{isInfinite as t,useAnimateElement as a}from"../../internal/animate.js";import{cx as n}from"../../internal/styles.js";export const AnimateZoom=/*@__PURE__*/e.forwardRef(function({duration:e=340,delay:o=0,easing:s,repeat:i=1,alternate:l,paused:m,trigger:c="mount",play:d,once:p=!0,threshold:f=.2,mode:u="in",from:y=.4,fade:g=!0,render:h,className:N,style:j,children:b,...w},x){const z=a({effect:"zoom",duration:e,delay:o,easing:s,repeat:i,alternate:l,mode:u,scale:y,opacity:g?0:1,trigger:c,play:d,once:p,threshold:f,paused:m,infinite:t(i)});return r({render:h,ref:[x,z.ref],props:{...w,className:n(z.className,N),style:{transformOrigin:"center",...z.style,...j},...z.props,children:b}})});
|
|
@@ -0,0 +1,148 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { useRender } from '@base-ui/react/use-render';
|
|
3
|
+
import type { NebaColor, NebaElevation, NebaSize, NebaVariant } from '../../types.js';
|
|
4
|
+
/**
|
|
5
|
+
* How the artwork is *framed*, which is the one question this component exists
|
|
6
|
+
* to answer.
|
|
7
|
+
*
|
|
8
|
+
* - `bare` — drawn as it was given, at the height `size` asks for and whatever
|
|
9
|
+
* width that comes to. No plate, no crop, no padding. This is the default,
|
|
10
|
+
* and it is the only one that is correct for a logo that was drawn with its
|
|
11
|
+
* own background, its own margin, or the product's name set into it.
|
|
12
|
+
* - `app` — an app icon: a filled tile with the artwork inset in it and the
|
|
13
|
+
* corners cut off. What a mark that was drawn as a bare glyph needs before it
|
|
14
|
+
* can sit next to anything else.
|
|
15
|
+
* - `circle` — the same tile, round. For the products whose icon is a disc.
|
|
16
|
+
*
|
|
17
|
+
* There is no `square`. A tile with the corners left on is the one shape the
|
|
18
|
+
* design language does not draw, and an `app` icon at a small size is already
|
|
19
|
+
* so close to a square that a fourth value would be a value nobody could see.
|
|
20
|
+
*/
|
|
21
|
+
export type AppLogoShape = 'bare' | 'app' | 'circle';
|
|
22
|
+
export interface AppLogoProps extends Omit<React.ComponentPropsWithoutRef<'a'>, 'color' | 'href'> {
|
|
23
|
+
/**
|
|
24
|
+
* The artwork, as an image.
|
|
25
|
+
*
|
|
26
|
+
* Beaten by `children`, so a project that inlines its SVG and a project that
|
|
27
|
+
* links a PNG use the same component. A logo file very often has the
|
|
28
|
+
* product's name set into it — that is what `shape="bare"` is the default
|
|
29
|
+
* for, since it keeps the file's own aspect ratio instead of squeezing a
|
|
30
|
+
* wordmark into a square, and why `name` is read out rather than drawn a
|
|
31
|
+
* second time beside it.
|
|
32
|
+
*/
|
|
33
|
+
src?: string;
|
|
34
|
+
/** Candidate images at other resolutions, as on any `<img>`. */
|
|
35
|
+
srcSet?: string;
|
|
36
|
+
/**
|
|
37
|
+
* What the artwork says for a reader who cannot see it. Defaults to `name`,
|
|
38
|
+
* which is almost always the right answer: a logo means the product.
|
|
39
|
+
*/
|
|
40
|
+
alt?: string;
|
|
41
|
+
/**
|
|
42
|
+
* The product's name.
|
|
43
|
+
*
|
|
44
|
+
* One prop doing three jobs, as on Avatar: it names the artwork, it is drawn
|
|
45
|
+
* as the logotype when there is no artwork at all, and its initials are what
|
|
46
|
+
* a tile falls back to. It is what makes `<AppLogo name="Neba" />` — with no
|
|
47
|
+
* file, no icon and no markup — still a logo.
|
|
48
|
+
*/
|
|
49
|
+
name?: string;
|
|
50
|
+
/** The initials on a tile, written out, for when the rule derived the wrong ones. */
|
|
51
|
+
initials?: string;
|
|
52
|
+
/**
|
|
53
|
+
* Draws the name beside the artwork, as the words half of a lockup.
|
|
54
|
+
*
|
|
55
|
+
* Off by default, because the common case is a file that already says the
|
|
56
|
+
* name. Turn it on for a bare mark — the icon in a header with the product
|
|
57
|
+
* next to it — and the name stops being read out twice: what is drawn *is*
|
|
58
|
+
* the accessible name from then on.
|
|
59
|
+
*
|
|
60
|
+
* Ignored when the name is already the whole logo, which is what a `bare`
|
|
61
|
+
* logo with no artwork is.
|
|
62
|
+
* @default false
|
|
63
|
+
*/
|
|
64
|
+
showName?: boolean;
|
|
65
|
+
/** @default 'bare' */
|
|
66
|
+
shape?: AppLogoShape;
|
|
67
|
+
/**
|
|
68
|
+
* Weight of the tile behind the artwork. Nothing at all on `bare`, which
|
|
69
|
+
* draws no tile.
|
|
70
|
+
* @default 'solid'
|
|
71
|
+
*/
|
|
72
|
+
variant?: NebaVariant;
|
|
73
|
+
/**
|
|
74
|
+
* How tall the mark is — the control heights, so a logo and the button beside
|
|
75
|
+
* it in a header are the same height. On `bare` only the height is set and
|
|
76
|
+
* the width is whatever the artwork's own proportions come to; on a tile both
|
|
77
|
+
* are, because a tile is square.
|
|
78
|
+
* @default 'md'
|
|
79
|
+
*/
|
|
80
|
+
size?: NebaSize;
|
|
81
|
+
/** @default 'primary' */
|
|
82
|
+
color?: NebaColor;
|
|
83
|
+
/**
|
|
84
|
+
* Drop shadow depth. `0` (the default) is flat: an app icon is a sticker on
|
|
85
|
+
* the page, not a thing hovering over it.
|
|
86
|
+
* @default 0
|
|
87
|
+
*/
|
|
88
|
+
elevation?: NebaElevation;
|
|
89
|
+
/**
|
|
90
|
+
* Insets the artwork from the tile's edge, the way an app icon's glyph is
|
|
91
|
+
* inset from its own corners. Turn it off for a mark that was drawn to fill
|
|
92
|
+
* the tile — a favicon, a photograph.
|
|
93
|
+
*
|
|
94
|
+
* No effect on `bare`, which has no tile to inset from, and none on a tile
|
|
95
|
+
* showing initials, which are sized by their own type scale.
|
|
96
|
+
* @default true
|
|
97
|
+
*/
|
|
98
|
+
padded?: boolean;
|
|
99
|
+
/**
|
|
100
|
+
* An exact height for the mark, overriding `size`. A number is pixels.
|
|
101
|
+
*
|
|
102
|
+
* The one escape hatch this component needs: a brand's artwork is drawn at a
|
|
103
|
+
* height somebody chose, and rounding it to the nearest step of a ladder is
|
|
104
|
+
* how a logo ends up half a pixel off the type beside it.
|
|
105
|
+
*/
|
|
106
|
+
height?: number | string;
|
|
107
|
+
/**
|
|
108
|
+
* Makes the whole lockup a link. A logo in a header is nearly always the way
|
|
109
|
+
* back to the front page, and a `<span>` inside an `<a>` the caller wrote is
|
|
110
|
+
* the same thing with one more element in it.
|
|
111
|
+
*/
|
|
112
|
+
href?: string;
|
|
113
|
+
/** Anything else the `<img>` needs — `loading`, `decoding`, `crossOrigin`. */
|
|
114
|
+
imageProps?: Omit<React.ComponentPropsWithoutRef<'img'>, 'src' | 'srcSet' | 'alt'>;
|
|
115
|
+
/**
|
|
116
|
+
* Renders something other than a `<span>` — or than the `<a>` an `href` makes
|
|
117
|
+
* it. `render={<Link to="/" />}` for a router's own link, `render={<h1 />}`
|
|
118
|
+
* for the one page where the product's name is the page's heading.
|
|
119
|
+
*/
|
|
120
|
+
render?: useRender.RenderProp;
|
|
121
|
+
/**
|
|
122
|
+
* The artwork, as markup. An inline `<svg>` is the usual one, and it is worth
|
|
123
|
+
* preferring to `src`: a mark that is part of the document takes the page's
|
|
124
|
+
* own colours, needs no second request, and cannot arrive late.
|
|
125
|
+
*/
|
|
126
|
+
children?: React.ReactNode;
|
|
127
|
+
}
|
|
128
|
+
/**
|
|
129
|
+
* A product's mark, at a known size, that is never an empty box.
|
|
130
|
+
*
|
|
131
|
+
* Four things can be the mark and exactly one of them is at a time: markup
|
|
132
|
+
* handed to `children`, an image at `src`, the initials of `name` on a tile, or
|
|
133
|
+
* — with no tile to put them on — the name itself, set as the logotype. That
|
|
134
|
+
* last one is the point of the component: a product that has not drawn a logo
|
|
135
|
+
* yet still has a logo, and swapping it for the real file later is one prop.
|
|
136
|
+
*
|
|
137
|
+
* What it adds over an `<img>` is the framing. A mark drawn as a bare glyph and
|
|
138
|
+
* a mark drawn with its own background need opposite treatment, and which one a
|
|
139
|
+
* given file is cannot be worked out from the file — so `shape` is the decision
|
|
140
|
+
* a caller makes once, and everything else follows from it: `bare` keeps the
|
|
141
|
+
* artwork's own proportions and draws nothing behind it, `app` and `circle`
|
|
142
|
+
* inset it into a tile of the page's own colour.
|
|
143
|
+
*
|
|
144
|
+
* It carries no tagline and no version. A logo with a line of text under it is
|
|
145
|
+
* a logo next to a [Typography], and inventing a second spelling for that would
|
|
146
|
+
* give the library two of them.
|
|
147
|
+
*/
|
|
148
|
+
export declare const AppLogo: React.ForwardRefExoticComponent<AppLogoProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use client";import{jsx as e,Fragment as r,jsxs as n}from"react/jsx-runtime";import*as t from"react";import{useRender as s}from"@base-ui/react/use-render";import{initialsOf as a}from"../../internal/initials.js";import{controlHeightClasses as l,controlSlots as i,controlSquareClasses as o,cx as m,gapClasses as d,hasContent as c,srOnlyClasses as u,surfaceClasses as x,toLength as f,transitionClasses as g}from"../../internal/styles.js";const h={xs:"text-[0.75rem]",sm:"text-[0.875rem]",md:"text-[1.0625rem]",lg:"text-[1.375rem]",xl:"text-[1.625rem]"},p={xs:"text-[0.75rem]",sm:"text-[0.875rem]",md:"text-[1.0625rem]",lg:"text-[1.3125rem]",xl:"text-[1.5625rem]"},v={xs:"rounded-[0.375rem]",sm:"rounded-[0.4375rem]",md:"rounded-[0.5625rem]",lg:"rounded-[0.6875rem]",xl:"rounded-[0.875rem]"},b={solid:[x,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[x,"border text-(--n-accent) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--n-accent) bg-(--n-soft-press) [box-shadow:var(--n-elev)]"};export const AppLogo=/*@__PURE__*/t.forwardRef(function({src:t,srcSet:x,alt:w,name:j,initials:_,showName:N=!1,shape:y="bare",variant:k="solid",size:S="md",color:z="primary",elevation:A=0,padded:F=!0,height:L,href:P,imageProps:R,render:$,className:q,style:B,children:C,...D},E){const G="bare"!==y,H=c(C)?C:t?"image":null,I=G&&F,J=null===H&&!G,K=N&&!J&&c(j),M=w??j,O=_??(j?a(j):""),Q="image"===H&&!K&&c(M),T=J||Q,U=!T&&!K&&c(M),V=f(L),W=V?{height:V,width:G?V:void 0}:null,X=e("span",{"aria-hidden":!T||void 0,className:m("flex shrink-0 items-center justify-center overflow-hidden","font-semibold tracking-tight whitespace-nowrap",V?"":l[S],G?m(V?"":o[S],"circle"===y?"rounded-full":v[S],p[S],b[k]):m("w-auto text-(--neba-fg)",h[S]),"[&_svg]:w-auto [&_svg]:shrink-0",I?"[&_svg]:h-[72%] [&_svg]:max-w-[72%]":"[&_svg]:h-full [&_svg]:max-w-full",g),style:{...G?i(z,A,k):null,...W},children:"image"===H?e("img",{src:t,srcSet:x,alt:Q?M??"":"",className:m("w-auto object-contain",I?"h-[72%] max-w-[72%]":"h-full max-w-full"),...R}):H??(J?j:O)});return s({render:$??e(P?"a":"span",{}),ref:E,props:{href:P,className:m("inline-flex max-w-full min-w-0 items-center align-middle","text-(--neba-fg) no-underline select-none",d[S],P?"cursor-pointer rounded-(--neba-radius-sm)":"",P?"focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-2":"",q),style:{"--n-ring":`var(--neba-${z}-ring)`,...B},children:n(r,{children:[X,K?e("span",{className:m("min-w-0 truncate font-semibold",h[S]),children:j}):null,U?e("span",{className:u,children:M}):null]}),...D}})});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export{AppLogo}from"./AppLogo.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{CartesianChart as a}from"../../internal/chart-frame.js";import{LineSeries as t}from"../../internal/chart-line.js";import{toValues as n}from"../../internal/chart.js";export function AreaChart({curve:o="linear",stacked:l=!1,markers:s="none",valueLabels:i="none",connectNulls:c=!1,series:
|
|
1
|
+
"use client";import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{CartesianChart as a}from"../../internal/chart-frame.js";import{LineSeries as t}from"../../internal/chart-line.js";import{toValues as n}from"../../internal/chart.js";export function AreaChart({curve:o="linear",stacked:l=!1,markers:s="none",valueLabels:i="none",connectNulls:c=!1,series:u,yAxis:m,format:f,...d}){const x=r.useId().replace(/:/g,""),p="full"===l,h=r.useMemo(()=>{if(!p)return u;const e=n(u),r=[];for(const a of e)a.forEach((e,a)=>{r[a]=(r[a]??0)+Math.abs(e.value??0)});return u.map((a,t)=>({...a,data:e[t].map((e,a)=>{if(null===e.value)return null;const t=r[a];return{x:e.x,y:0===t?0:e.value/t*100,color:e.color,label:e.label??String(e.value)}})}))},[u,p]);return e(a,{...d,series:h,format:f,yAxis:p?{min:0,max:100,tickFormat:e=>`${e}%`,...m}:m,stacked:!1!==l,inset:!0,includeZero:!0,headroom:"none"===i?0:10,children:r=>e(t,{context:r,curve:o,filled:!0,stacked:!1!==l,markers:s,valueLabels:i,connectNulls:c,gradient:!1,idPrefix:x})})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as e from"react";import{useRender as i}from"@base-ui/react/use-render";import{radiusClasses as o}from"../../internal/styles.js";const t=["[&>img]:size-full","[&>video]:size-full","[&>canvas]:size-full","[&>svg]:size-full","[&>iframe]:size-full","[&>picture]:size-full","[&>picture>img]:size-full"].join(" "),c={cover:"[&>img]:object-cover [&>video]:object-cover [&>picture>img]:object-cover",contain:"[&>img]:object-contain [&>video]:object-contain [&>picture>img]:object-contain",fill:"[&>img]:object-fill [&>video]:object-fill [&>picture>img]:object-fill",none:"[&>img]:object-none [&>video]:object-none [&>picture>img]:object-none"};export const AspectRatio=/*@__PURE__*/e.forwardRef(function({ratio:e=1,fit:r="cover",rounded:l=!1,size:n="md",render:s,className:a,style:f,children:m,...u},d){const j=["relative block w-full overflow-hidden",t,c[r],l?o[n]:"",a??""].filter(Boolean).join(" ");return i({render:s,ref:d,props:{className:j,style:{aspectRatio:e,...f},children:m,...u}})});
|
|
1
|
+
"use client";import*as e from"react";import{useRender as i}from"@base-ui/react/use-render";import{radiusClasses as o}from"../../internal/styles.js";const t=["[&>img]:size-full","[&>video]:size-full","[&>canvas]:size-full","[&>svg]:size-full","[&>iframe]:size-full","[&>picture]:size-full","[&>picture>img]:size-full"].join(" "),c={cover:"[&>img]:object-cover [&>video]:object-cover [&>picture>img]:object-cover",contain:"[&>img]:object-contain [&>video]:object-contain [&>picture>img]:object-contain",fill:"[&>img]:object-fill [&>video]:object-fill [&>picture>img]:object-fill",none:"[&>img]:object-none [&>video]:object-none [&>picture>img]:object-none"};export const AspectRatio=/*@__PURE__*/e.forwardRef(function({ratio:e=1,fit:r="cover",rounded:l=!1,size:n="md",render:s,className:a,style:f,children:m,...u},d){const j=["relative block w-full overflow-hidden",t,c[r],l?o[n]:"",a??""].filter(Boolean).join(" ");return i({render:s,ref:d,props:{className:j,style:{aspectRatio:e,...f},children:m,...u}})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as n from"react";import{Avatar as r}from"@base-ui/react/avatar";import{transitionProps as a}from"../../internal/animate.js";import{initialsOf as o}from"../../internal/initials.js";import{controlHeightClasses as s,controlSlots as i,controlSquareClasses as l,hasContent as d,srOnlyClasses as c,surfaceClasses as m,transitionClasses as f}from"../../internal/styles.js";const u={xs:"text-[0.5625rem]",sm:"text-[0.6875rem]",md:"text-[0.8125rem]",lg:"text-[1rem]",xl:"text-[1.1875rem]"},x={xs:"rounded-[0.375rem]",sm:"rounded-[0.4375rem]",md:"rounded-[0.5625rem]",lg:"rounded-[0.6875rem]",xl:"rounded-[0.875rem]"},v={solid:[m,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev)]"].join(" "),outline:[m,"border text-(--n-accent) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev)]"].join(" "),text:"text-(--n-accent) bg-(--n-soft-press) [box-shadow:var(--n-elev)]"},h="after:pointer-events-none after:absolute after:inset-0 after:rounded-[inherit]",p={solid:`${h} after:[box-shadow:var(--neba-plate-solid)]`,outline:`${h} after:[box-shadow:var(--neba-plate-glass)]`,text:""},g=["relative inline-flex shrink-0 select-none items-center justify-center overflow-hidden","align-middle font-semibold tracking-wide whitespace-nowrap leading-none","[&_svg]:pointer-events-none [&_svg]:size-[55%]",f].join(" ");function b(){return t("svg",{viewBox:"0 0 24 24",fill:"currentColor","aria-hidden":"true",children:[e("path",{d:"M12 12a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9Z"}),e("path",{d:"M12 14.25c-4.28 0-7.75 2.42-7.75 5.4 0 .75.6 1.35 1.35 1.35h12.8c.75 0 1.35-.6 1.35-1.35 0-2.98-3.47-5.4-7.75-5.4Z"})]})}export const Avatar=/*@__PURE__*/n.forwardRef(function({src:n,srcSet:m,alt:f,name:h,initials:j,shape:w="circle",variant:y="text",size:N="md",color:z="primary",elevation:S=0,delay:k,imageProps:B,onLoadingStatusChange:C,transition:A,className:L,style:M,children:R,...Z},$){const _=h?o(h):"",F=a(A),I=f??h,P=d(R)?R:(j??_)||e(b,{}),q=d(R)||Boolean(j??_),D=[g,s[N],l[N],u[N],"circle"===w?"rounded-full":x[N],v[y],p[y],F.className,L??""].filter(Boolean).join(" ");return t(r.Root,{ref:$,className:D,style:{...i(z,S,y),...F.style,...M},...Z,children:[n?e(r.Image,{src:n,srcSet:m,alt:I??"",className:"size-full object-cover",onLoadingStatusChange:C,...B}):null,t(r.Fallback,{delay:n?k:void 0,className:"flex size-full items-center justify-center",children:[I&&q?e("span",{className:c,children:I}):null,e("span",{"aria-hidden":!(!I||!q)||void 0,className:"contents",children:P})]})]})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,Fragment as t,jsxs as m}from"react/jsx-runtime";import*as n from"react";import{controlSlots as s,hasContent as o,srOnlyClasses as
|
|
1
|
+
"use client";import{jsx as e,Fragment as t,jsxs as m}from"react/jsx-runtime";import*as n from"react";import{controlSlots as s,hasContent as o,srOnlyClasses as l,surfaceClasses as a,transitionClasses as i}from"../../internal/styles.js";const r={xs:"h-3.5 min-w-3.5",sm:"h-4 min-w-4",md:"h-4.5 min-w-4.5",lg:"h-5 min-w-5",xl:"h-6 min-w-6"},d={xs:"size-1.5",sm:"size-2",md:"size-2.5",lg:"size-2.5",xl:"size-3"},b={xs:"text-[0.5625rem]",sm:"text-[0.625rem]",md:"text-[0.6875rem]",lg:"text-[0.75rem]",xl:"text-[0.8125rem]"},x={default:{xs:"px-1",sm:"px-1",md:"px-1.5",lg:"px-1.5",xl:"px-2"},compact:{xs:"px-0.5",sm:"px-0.5",md:"px-1",lg:"px-1",xl:"px-1.5"}},p="rounded-full",c={xs:{badge:"-mt-1.5 -mb-1.5 -ms-1.5 -me-1.5",dot:"-mt-0.5 -mb-0.5 -ms-0.5 -me-0.5"},sm:{badge:"-mt-2 -mb-2 -ms-2 -me-2",dot:"-mt-1 -mb-1 -ms-1 -me-1"},md:{badge:"-mt-2 -mb-2 -ms-2 -me-2",dot:"-mt-1 -mb-1 -ms-1 -me-1"},lg:{badge:"-mt-2.5 -mb-2.5 -ms-2.5 -me-2.5",dot:"-mt-1 -mb-1 -ms-1 -me-1"},xl:{badge:"-mt-3 -mb-3 -ms-3 -me-3",dot:"-mt-1.5 -mb-1.5 -ms-1.5 -me-1.5"}},g={"top-start":"top-0 start-0","top-end":"top-0 end-0","bottom-start":"bottom-0 start-0","bottom-end":"bottom-0 end-0"},u={"top-start":"mt-[7%] ms-[7%]","top-end":"mt-[7%] me-[7%]","bottom-start":"mb-[7%] ms-[7%]","bottom-end":"mb-[7%] me-[7%]"},f={solid:[a,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[a,"border text-(--n-accent) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--n-accent) bg-(--n-soft-press)"};export const Badge=/*@__PURE__*/n.forwardRef(function({variant:n="solid",size:a="md",color:h="primary",density:v="default",elevation:w=0,content:j,max:y=99,dot:z=!1,showZero:N=!1,invisible:k=!1,placement:B="top-end",overlap:$="square",label:q,className:F,style:R,children:Z,...A},C){const D=o(Z),E=!o(j)||0===j&&!N,G=z||E,H=k||E&&!z,I=["pointer-events-none z-10 inline-flex shrink-0 items-center justify-center","font-semibold tabular-nums whitespace-nowrap",p,i,f[n],G?d[a]:[r[a],b[a],x[v][a]].join(" "),D?`absolute ${g[B]}`:"relative align-middle",D?G?c[a].dot:c[a].badge:"",D&&"circle"===$?u[B]:"",H?"invisible":"",F??""].filter(Boolean).join(" "),J=function(e,t){return"number"==typeof e&&e>t?`${t}+`:e}(j,y),K=e("span",{ref:C,className:I,style:{...s(h,w,n),...R},"aria-hidden":!!H||void 0,...A,children:H?null:m(t,{children:[G||q?e("span",{className:l,children:q??J}):null,G?null:e("span",{"aria-hidden":!!q||void 0,children:J})]})});return D?m("span",{className:"relative inline-flex shrink-0 align-middle",children:[Z,K]}):K});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{CartesianChart as n}from"../../internal/chart-frame.js";import{barBandRatio as l,barMaxThickness as r,barPath as o,barRadius as i,chartFontSizes as u,markGap as s,toValues as c}from"../../internal/chart.js";export function BarChart({orientation:t="vertical",stacked:o=!1,rounded:i=!0,barSize:u,valueLabels:s="none",series:h,yAxis:m,size:v="md",density:f="default",...x}){const b="horizontal"===t,p="full"===o,y=a.useMemo(()=>{if(!p)return h;const e=c(h),t=[];for(const a of e)a.forEach((e,a)=>{t[a]=(t[a]??0)+Math.abs(e.value??0)});return h.map((a,n)=>({...a,data:e[n].map((e,a)=>{if(null===e.value)return null;const n=t[a];return{x:e.x,y:0===n?0:e.value/n*100,color:e.color,label:e.label??String(e.value)}})}))},[h,p]);return e(n,{...x,series:y,size:v,density:f,horizontal:b,stacked:!1!==o,yAxis:p?{min:0,max:100,tickFormat:e=>`${e}%`,...m}:m,includeZero:!0,bandRatio:l[f],headroom:"none"===s?0:12,children:t=>e(d,{context:t,stacked:!1!==o,rounded:i,barSize:u??r[v],valueLabels:s,size:v})})}function d({context:a,stacked:n,rounded:l,barSize:r,valueLabels:c,size:d}){const{values:m,visible:v,colors:f,hovered:x,activeIndex:b,plot:p,band:y,horizontal:z,valuePx:g,categoryPx:M,zeroPx:k,format:j}=a,S=m.map((e,t)=>({one:e,index:t})).filter(e=>v[e.index]),A=n?1:Math.max(1,S.length),L=Math.min(r,Math.max(1,(y.band-s*(A-1))/A)),P=L*A+s*(A-1),W=[],w=[],B=u[d];return t("g",{children:[S.map(({one:a,index:r},u)=>{const d=f[r];return e("g",{opacity:null!==x&&x!==r?.28:1,children:a.map((r,m)=>{if(null===r.value)return null;const v=M(m),f=n?0:u*(L+s)-P/2+L/2,x=n?r.value>=0?W[m]??0:w[m]??0:0,y=g(x),k=g(x+r.value);n&&(r.value>=0?W[m]=x+r.value:w[m]=x+r.value);const S=n&&0!==x?s:0,A=Math.abs(k-y)-S;if(A<=0)return null;const C=k<y,E=m===b,F=z?o(Math.min(y,k)+(C?0:S),p.top+v+f-L/2,A,L,l&&!n?i:l?i/2:0,r.value>=0?"right":"left"):o(p.left+v+f-L/2,Math.min(y,k)+(C?0:S),L,A,l&&!n?i:l?i/2:0,r.value>=0?"up":"down");return t("g",{children:[e("path",{d:F,fill:r.color??d,opacity:E?1:.92}),"none"===c||"extremes"===c&&!h(a,m)||"last"===c&&m!==a.length-1?null:e("text",{x:z?k+(r.value>=0?5:-5):p.left+v+f,y:z?p.top+v+f:r.value>=0?k-5:k+B+2,textAnchor:z?r.value>=0?"start":"end":"middle",dominantBaseline:z?"central":void 0,fontSize:B,fontWeight:500,fill:"var(--neba-fg)",className:"tabular-nums",children:r.label??j(r.value)})]},m)})},r)}),e("line",z?{x1:k,x2:k,y1:p.top,y2:p.top+p.height,stroke:"var(--neba-chart-baseline)",strokeWidth:1}:{x1:p.left,x2:p.left+p.width,y1:k,y2:k,stroke:"var(--neba-chart-baseline)",strokeWidth:1})]})}function h(e,t){const a=e[t].value;if(null===a)return!1;let n=1/0,l=-1/0;for(const t of e)null!==t.value&&(n=Math.min(n,t.value),l=Math.max(l,t.value));return a===n||a===l}
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{CartesianChart as n}from"../../internal/chart-frame.js";import{barBandRatio as l,barMaxThickness as r,barPath as o,barRadius as i,chartFontSizes as u,markGap as s,toValues as c}from"../../internal/chart.js";export function BarChart({orientation:t="vertical",stacked:o=!1,rounded:i=!0,barSize:u,valueLabels:s="none",series:h,yAxis:m,size:v="md",density:f="default",...x}){const b="horizontal"===t,p="full"===o,y=a.useMemo(()=>{if(!p)return h;const e=c(h),t=[];for(const a of e)a.forEach((e,a)=>{t[a]=(t[a]??0)+Math.abs(e.value??0)});return h.map((a,n)=>({...a,data:e[n].map((e,a)=>{if(null===e.value)return null;const n=t[a];return{x:e.x,y:0===n?0:e.value/n*100,color:e.color,label:e.label??String(e.value)}})}))},[h,p]);return e(n,{...x,series:y,size:v,density:f,horizontal:b,stacked:!1!==o,yAxis:p?{min:0,max:100,tickFormat:e=>`${e}%`,...m}:m,includeZero:!0,bandRatio:l[f],headroom:"none"===s?0:12,children:t=>e(d,{context:t,stacked:!1!==o,rounded:i,barSize:u??r[v],valueLabels:s,size:v})})}function d({context:a,stacked:n,rounded:l,barSize:r,valueLabels:c,size:d}){const{values:m,visible:v,colors:f,hovered:x,activeIndex:b,plot:p,band:y,horizontal:z,valuePx:g,categoryPx:M,zeroPx:k,format:j}=a,S=m.map((e,t)=>({one:e,index:t})).filter(e=>v[e.index]),A=n?1:Math.max(1,S.length),L=Math.min(r,Math.max(1,(y.band-s*(A-1))/A)),P=L*A+s*(A-1),W=[],w=[],B=u[d];return t("g",{children:[S.map(({one:a,index:r},u)=>{const d=f[r];return e("g",{opacity:null!==x&&x!==r?.28:1,children:a.map((r,m)=>{if(null===r.value)return null;const v=M(m),f=n?0:u*(L+s)-P/2+L/2,x=n?r.value>=0?W[m]??0:w[m]??0:0,y=g(x),k=g(x+r.value);n&&(r.value>=0?W[m]=x+r.value:w[m]=x+r.value);const S=n&&0!==x?s:0,A=Math.abs(k-y)-S;if(A<=0)return null;const C=k<y,E=m===b,F=z?o(Math.min(y,k)+(C?0:S),p.top+v+f-L/2,A,L,l&&!n?i:l?i/2:0,r.value>=0?"right":"left"):o(p.left+v+f-L/2,Math.min(y,k)+(C?0:S),L,A,l&&!n?i:l?i/2:0,r.value>=0?"up":"down");return t("g",{children:[e("path",{d:F,fill:r.color??d,opacity:E?1:.92}),"none"===c||"extremes"===c&&!h(a,m)||"last"===c&&m!==a.length-1?null:e("text",{x:z?k+(r.value>=0?5:-5):p.left+v+f,y:z?p.top+v+f:r.value>=0?k-5:k+B+2,textAnchor:z?r.value>=0?"start":"end":"middle",dominantBaseline:z?"central":void 0,fontSize:B,fontWeight:500,fill:"var(--neba-fg)",className:"tabular-nums",children:r.label??j(r.value)})]},m)})},r)}),e("line",z?{x1:k,x2:k,y1:p.top,y2:p.top+p.height,stroke:"var(--neba-chart-baseline)",strokeWidth:1}:{x1:p.left,x2:p.left+p.width,y1:k,y2:k,stroke:"var(--neba-chart-baseline)",strokeWidth:1})]})}function h(e,t){const a=e[t].value;if(null===a)return!1;let n=1/0,l=-1/0;for(const t of e)null!==t.value&&(n=Math.min(n,t.value),l=Math.max(l,t.value));return a===n||a===l}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as t from"react";import{boxPaddingClasses as n}from"../box/Box.js";import{transitionProps as a}from"../../internal/animate.js";import{hasContent as l,metaTextClasses as
|
|
1
|
+
"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as t from"react";import{boxPaddingClasses as n}from"../box/Box.js";import{transitionProps as a}from"../../internal/animate.js";import{hasContent as l,metaTextClasses as s,radiusClasses as o,surfaceClasses as i,surfaceSlots as c,transitionClasses as m}from"../../internal/styles.js";const d={xs:"text-[0.75rem]/[1.25rem]",sm:"text-[0.8125rem]/[1.375rem]",md:"text-[0.9375rem]/[1.625rem]",lg:"text-[1.0625rem]/[1.875rem]",xl:"text-[1.25rem]/[2.125rem]"},x="border-s-2 [border-inline-start-color:var(--n-accent)]",f={solid:[i,"bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[i,"border border-s-2 bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"bg-transparent"};function u(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:e("path",{d:"M6.4 3.6c-2.3.9-3.7 2.8-3.7 5.1 0 2 1.2 3.3 2.8 3.3 1.4 0 2.5-1 2.5-2.4 0-1.3-.9-2.2-2.1-2.2-.2 0-.4 0-.6.1.3-1 1.1-1.8 2.2-2.3l-1.1-1.6ZM13.3 3.6c-2.3.9-3.7 2.8-3.7 5.1 0 2 1.2 3.3 2.8 3.3 1.4 0 2.5-1 2.5-2.4 0-1.3-.9-2.2-2.1-2.2-.2 0-.4 0-.6.1.3-1 1.1-1.8 2.2-2.3l-1.1-1.6Z",fill:"currentColor"})})}export const Blockquote=/*@__PURE__*/t.forwardRef(function({variant:t="text",size:i="md",color:b="primary",density:p="default",elevation:h=0,author:v,source:g,cite:j,icon:N,transition:y,className:w,style:B,children:k,...z},q){const M=a(y),Z=l(v)||l(g),C=void 0===N?e(u,{}):N,R=["flex flex-col text-(--neba-fg)",x,"text"===t?"":`${o[i]} rounded-s-none`,f[t],n[p][i],m,M.className,w??""].filter(Boolean).join(" "),$=r("blockquote",{cite:j,className:d[i],children:[l(C)?e("span",{"aria-hidden":"true",className:"mb-1 block size-[2em] text-(--n-soft-press) [&>svg]:size-full",children:C}):null,k]}),A={...c(b,h),...M.style,...B};return Z?r("figure",{ref:q,className:R,style:A,...z,children:[$,r("figcaption",{className:["mt-2 flex flex-wrap items-baseline gap-x-1.5 text-(--neba-muted-fg)",s[i]].join(" "),children:[l(v)?r("span",{className:"font-medium text-(--neba-fg)",children:[e("span",{"aria-hidden":"true",children:"— "}),v]}):null,l(g)?e("cite",{className:"not-italic",children:g}):null]})]}):e("div",{ref:q,className:R,style:A,...z,children:$})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,Fragment as t,jsxs as a}from"react/jsx-runtime";import*as n from"react";import{useRender as i}from"@base-ui/react/use-render";import{barMinHeightClasses as
|
|
1
|
+
"use client";import{jsx as e,Fragment as t,jsxs as a}from"react/jsx-runtime";import*as n from"react";import{useRender as i}from"@base-ui/react/use-render";import{barMinHeightClasses as l,BottomNavigationContext as r}from"../../internal/bottom-navigation.js";import{cx as o,hasContent as s,iconSizeClasses as d,metaTextClasses as c,paddingXClasses as u,radiusClasses as m,srOnlyClasses as p,surfaceClasses as f,surfaceSlots as b,transitionClasses as g}from"../../internal/styles.js";const v={solid:[f,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[f,"text-(--neba-fg) bg-(--n-panel)","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-transparent"},x={static:"",sticky:"sticky bottom-0 z-20",fixed:"fixed inset-x-0 bottom-0 z-30"},h={default:{xs:"p-1",sm:"p-1",md:"p-1.5",lg:"p-2",xl:"p-2.5"},compact:{xs:"p-0.5",sm:"p-0.5",md:"p-1",lg:"p-1",xl:"p-1.5"}},y={xs:"gap-0.5",sm:"gap-0.5",md:"gap-1",lg:"gap-1",xl:"gap-1.5"};export const BottomNavigation=/*@__PURE__*/n.forwardRef(function({variant:t="outline",size:a="md",color:s="primary",density:d="default",elevation:c=0,value:u,defaultValue:p=null,onValueChange:f,position:y="fixed",labels:w="all",divider:N=!0,safeArea:z=!0,disabled:j=!1,label:k,render:C,className:B,style:R,children:V,..._},A){const[D,F]=n.useState(p),I=void 0!==u,M=I?u:D,P=n.useCallback(e=>{I||F(e),f?.(e)},[I,f]),S=n.useMemo(()=>({value:M??null,change:P,size:a,density:d,labels:w,disabled:j,floating:!1}),[M,P,a,d,w,j]),q=o("w-full min-w-0","static"===y?m[a]:"",v[t],"outline"===t&&"static"===y?"border [border-color:var(--n-line)]":"",N?"border-t [border-color:var(--n-line)]":"",x[y],z?"pb-[env(safe-area-inset-bottom)]":"",g,B);return i({render:C??e("nav",{}),ref:A,props:{"aria-label":k,className:q,style:{...b(s,c),...R},children:e(r.Provider,{value:S,children:e("div",{className:o("flex w-full items-stretch",l[a],h[d][a]),children:V})}),..._}})});export const BottomNavigationItem=/*@__PURE__*/n.forwardRef(function({value:i,icon:l,href:f,disabled:b=!1,className:v,children:x,onClick:h,...w},N){const z=n.useContext(r),j=b||z.disabled,k=null!==z.value&&z.value===i,C="all"===z.labels||"selected"===z.labels&&k,B=o("flex min-w-0 flex-col items-center justify-center py-1.5",z.floating?o("relative z-10",u[z.density][z.size],"rounded-full"):o("flex-1 px-1",m[z.size]),y[z.size],"[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",g,"focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:[outline-offset:-2px]",j?"cursor-not-allowed text-(--neba-disabled-fg)":k?z.floating?"cursor-pointer font-medium text-(--n-accent)":"cursor-pointer font-medium text-(--n-accent) bg-(--n-soft) hover:bg-(--n-soft-hover)":"cursor-pointer text-(--neba-muted-fg) hover:text-(--neba-fg) hover:bg-(--n-panel-hover)",v),R=a(t,{children:[s(l)?e("span",{className:o("flex shrink-0 items-center justify-center",d[z.size]),children:l}):null,s(x)?z.floating&&"selected"===z.labels?e("span",{"data-drawn":C?"":void 0,className:o("grid justify-items-center [grid-template-rows:1fr]","[transition-property:grid-template-columns,opacity]","[transition-duration:var(--neba-duration)]","[transition-timing-function:var(--neba-ease)]","motion-reduce:[transition-duration:0ms]",C?"[grid-template-columns:1fr] opacity-100":"[grid-template-columns:0fr] opacity-0"),children:e("span",{className:o("min-w-0 truncate leading-tight",c[z.size]),children:x})}):e("span",{"data-drawn":C?"":void 0,className:C?o("max-w-full truncate leading-tight",c[z.size]):p,children:x}):null]}),V=e=>{j?e.preventDefault():(z.change(i),h?.(e))};return f?e("a",{ref:N,"data-nav-item":"",href:j?void 0:f,"aria-current":k?"page":void 0,"aria-disabled":j||void 0,className:B,onClick:V,...w,children:R}):e("button",{ref:N,"data-nav-item":"",type:"button",disabled:j,"aria-current":k?"page":void 0,className:B,onClick:V,...w,children:R})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import*as e from"react";import{useRender as s}from"@base-ui/react/use-render";import{transitionProps as a}from"../../internal/animate.js";import{radiusClasses as o,surfaceClasses as t,surfaceSlots as n,transitionClasses as
|
|
1
|
+
"use client";import*as e from"react";import{useRender as s}from"@base-ui/react/use-render";import{transitionProps as a}from"../../internal/animate.js";import{radiusClasses as o,surfaceClasses as t,surfaceSlots as n,transitionClasses as l}from"../../internal/styles.js";const p=o;export const boxPaddingClasses={default:{xs:"p-2",sm:"p-3",md:"p-4",lg:"p-5",xl:"p-6"},compact:{xs:"p-1.5",sm:"p-2",md:"p-2.5",lg:"p-3",xl:"p-4"}};export const boxPaddingXClasses={default:{xs:"px-2",sm:"px-3",md:"px-4",lg:"px-5",xl:"px-6"},compact:{xs:"px-1.5",sm:"px-2",md:"px-2.5",lg:"px-3",xl:"px-4"}};export const boxPaddingYClasses={default:{xs:"py-2",sm:"py-3",md:"py-4",lg:"py-5",xl:"py-6"},compact:{xs:"py-1.5",sm:"py-2",md:"py-2.5",lg:"py-3",xl:"py-4"}};const r=["block",l].join(" "),x={solid:[t,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[t,"border text-(--neba-fg) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-transparent"};export const Box=/*@__PURE__*/e.forwardRef(function({variant:e="outline",size:o="md",color:t="primary",density:l="default",elevation:d=0,padded:i=!0,transition:m,render:c,className:b,style:g,children:f,...y},u){const v=a(m),j=[r,p[o],i?boxPaddingClasses[l][o]:"",x[e],v.className,b??""].filter(Boolean).join(" ");return s({render:c,ref:u,props:{className:j,style:{...n(t,d),...v.style,...g},children:f,...y}})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as r from"react";import{breadcrumbMessages as a,useMessages as s}from"../../internal/i18n.js";import{ArrowRightIcon as l,ChevronIcon as i,EllipsisIcon as c}from"../../internal/icons.js";import{controlTextClasses as o,cx as m,gapClasses as d,hasContent as u,iconClasses as p,radiusClasses as f,transitionClasses as h}from"../../internal/styles.js";const x=/*@__PURE__*/r.createContext({size:"md",last:!1}),g={default:{xs:"gap-1",sm:"gap-1.5",md:"gap-2",lg:"gap-2.5",xl:"gap-3"},compact:{xs:"gap-0.5",sm:"gap-1",md:"gap-1",lg:"gap-1.5",xl:"gap-2"}},b={xs:f.xs,sm:f.xs,md:f.xs,lg:f.sm,xl:f.sm};const v=["chevron","arrow","slash","dot"];function y(e){return"string"==typeof e||"number"==typeof e?String(e):Array.isArray(e)?e.map(y).join(""):r.isValidElement(e)?y(e.props.children):""}function N(e,t){if(!t)return e;try{return new URL(e,t).href}catch{return e}}function w(e,t){const n=e.map((e,n)=>{const{href:r,children:a}=e.props;return{"@type":"ListItem",position:n+1,name:y(a),...r?{item:N(r,t)}:null}});return JSON.stringify({"@context":"https://schema.org","@type":"BreadcrumbList",itemListElement:n}).replace(/</g,"\\u003c")}export const Breadcrumb=/*@__PURE__*/r.forwardRef(function({size:n="md",color:d="primary",density:u="default",separator:f="chevron",maxItems:b,itemsBeforeCollapse:y=1,itemsAfterCollapse:N=1,expandable:k=!0,locale:C,label:j,expandLabel:I,structuredData:L=!1,baseUrl:_,className:B,style:z,children:A,...M},S){const E=s(a,C),[R,$]=r.useState(!1),F=r.Children.toArray(A).filter(r.isValidElement),U=F.length,V=F.some(e=>!0===e.props.current),D=!R&&void 0!==b&&U>Math.max(b,1)&&U-y-N>1?[...F.slice(0,Math.max(0,y)),null,...F.slice(U-Math.max(0,N))]:F,H="string"==typeof(J=f)&&v.includes(J)?function(t){switch(t){case"chevron":return e("span",{className:"flex -rotate-90 items-center rtl:rotate-90",children:e(i,{})});case"arrow":return e("span",{className:"flex items-center rtl:rotate-180",children:e(l,{})});case"slash":return e("span",{className:"opacity-70",children:"/"});case"dot":return e("span",{className:"opacity-70",children:"·"});default:return null}}(f):f;var J;const O=m("inline-flex items-center rounded-(--neba-radius-xs) px-0.5","text-(--neba-muted-fg)",h,p,k?m("cursor-pointer hover:bg-(--n-soft) hover:text-(--n-accent)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1"):"");return t("nav",{ref:S,"aria-label":j??E.label,className:m("flex",o[n],p,B),style:{"--n-accent":`var(--neba-${d}-accent)`,"--n-soft":`var(--neba-${d}-soft)`,"--n-ring":`var(--neba-${d}-ring)`,...z},...M,children:[L&&U>0?e("script",{type:"application/ld+json",dangerouslySetInnerHTML:{__html:w(F,_)}}):null,e("ol",{role:"list",className:m("flex list-none flex-wrap items-center p-0",g[u][n]),children:D.map((a,s)=>t(r.Fragment,{children:[s>0?e("li",{"aria-hidden":"true",className:"flex shrink-0 items-center text-(--neba-muted-fg) select-none",children:H}):null,a?e(x.Provider,{value:{size:n,last:!V&&s===D.length-1},children:a}):e("li",{className:"flex shrink-0 items-center",children:k?e("button",{type:"button",className:O,"aria-label":I??E.expand,onClick:()=>$(!0),children:e(c,{})}):e("span",{className:O,"aria-hidden":"true",children:e(c,{})})})]},a?a.key??s:"fold"))})]})});export const BreadcrumbItem=/*@__PURE__*/r.forwardRef(function({href:a,onClick:s,startIcon:l,endIcon:i,current:c,disabled:o=!1,className:p,children:f,...g},v){const{size:y,last:N}=r.useContext(x),w=c??N,k=Boolean(a||s)&&!w&&!o,C=m("inline-flex min-w-0 items-center px-1",d[y],b[y],h,o?"cursor-not-allowed text-(--neba-disabled-fg)":w?"font-medium text-(--neba-fg)":k?m("cursor-pointer text-(--neba-muted-fg)","hover:bg-(--n-soft) hover:text-(--n-accent)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1"):"text-(--neba-muted-fg)"),j=t(n,{children:[u(l)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:l}):null,e("span",{className:"truncate",children:f}),u(i)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:i}):null]});return e("li",{ref:v,className:m("flex min-w-0 items-center",p),...g,children:k&&a?e("a",{href:a,className:C,onClick:s,children:j}):k?e("button",{type:"button",className:C,onClick:s,children:j}):e("span",{className:C,"aria-current":w?"page":void 0,"aria-disabled":o||void 0,children:j})})});
|
|
1
|
+
"use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as r from"react";import{breadcrumbMessages as a,useMessages as s}from"../../internal/i18n.js";import{ArrowRightIcon as l,ChevronIcon as i,EllipsisIcon as c}from"../../internal/icons.js";import{controlTextClasses as o,cx as m,gapClasses as d,hasContent as u,iconClasses as p,radiusClasses as f,transitionClasses as h}from"../../internal/styles.js";const x=/*@__PURE__*/r.createContext({size:"md",last:!1}),g={default:{xs:"gap-1",sm:"gap-1.5",md:"gap-2",lg:"gap-2.5",xl:"gap-3"},compact:{xs:"gap-0.5",sm:"gap-1",md:"gap-1",lg:"gap-1.5",xl:"gap-2"}},b={xs:f.xs,sm:f.xs,md:f.xs,lg:f.sm,xl:f.sm};const v=["chevron","arrow","slash","dot"];function y(e){return"string"==typeof e||"number"==typeof e?String(e):Array.isArray(e)?e.map(y).join(""):r.isValidElement(e)?y(e.props.children):""}function N(e,t){if(!t)return e;try{return new URL(e,t).href}catch{return e}}function w(e,t){const n=e.map((e,n)=>{const{href:r,children:a}=e.props;return{"@type":"ListItem",position:n+1,name:y(a),...r?{item:N(r,t)}:null}});return JSON.stringify({"@context":"https://schema.org","@type":"BreadcrumbList",itemListElement:n}).replace(/</g,"\\u003c")}export const Breadcrumb=/*@__PURE__*/r.forwardRef(function({size:n="md",color:d="primary",density:u="default",separator:f="chevron",maxItems:b,itemsBeforeCollapse:y=1,itemsAfterCollapse:N=1,expandable:k=!0,locale:C,label:j,expandLabel:I,structuredData:L=!1,baseUrl:_,className:B,style:z,children:A,...M},S){const E=s(a,C),[R,$]=r.useState(!1),F=r.Children.toArray(A).filter(r.isValidElement),U=F.length,V=F.some(e=>!0===e.props.current),D=!R&&void 0!==b&&U>Math.max(b,1)&&U-y-N>1?[...F.slice(0,Math.max(0,y)),null,...F.slice(U-Math.max(0,N))]:F,H="string"==typeof(J=f)&&v.includes(J)?function(t){switch(t){case"chevron":return e("span",{className:"flex -rotate-90 items-center rtl:rotate-90",children:e(i,{})});case"arrow":return e("span",{className:"flex items-center rtl:rotate-180",children:e(l,{})});case"slash":return e("span",{className:"opacity-70",children:"/"});case"dot":return e("span",{className:"opacity-70",children:"·"});default:return null}}(f):f;var J;const O=m("inline-flex items-center rounded-(--neba-radius-xs) px-0.5","text-(--neba-muted-fg)",h,p,k?m("cursor-pointer hover:bg-(--n-soft) hover:text-(--n-accent)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1"):"");return t("nav",{ref:S,"aria-label":j??E.label,className:m("flex",o[n],p,B),style:{"--n-accent":`var(--neba-${d}-accent)`,"--n-soft":`var(--neba-${d}-soft)`,"--n-ring":`var(--neba-${d}-ring)`,...z},...M,children:[L&&U>0?e("script",{type:"application/ld+json",dangerouslySetInnerHTML:{__html:w(F,_)}}):null,e("ol",{role:"list",className:m("flex list-none flex-wrap items-center p-0",g[u][n]),children:D.map((a,s)=>t(r.Fragment,{children:[s>0?e("li",{"aria-hidden":"true",className:"flex shrink-0 items-center text-(--neba-muted-fg) select-none",children:H}):null,a?e(x.Provider,{value:{size:n,last:!V&&s===D.length-1},children:a}):e("li",{className:"flex shrink-0 items-center",children:k?e("button",{type:"button",className:O,"aria-label":I??E.expand,onClick:()=>$(!0),children:e(c,{})}):e("span",{className:O,"aria-hidden":"true",children:e(c,{})})})]},a?a.key??s:"fold"))})]})});export const BreadcrumbItem=/*@__PURE__*/r.forwardRef(function({href:a,onClick:s,startIcon:l,endIcon:i,current:c,disabled:o=!1,className:p,children:f,...g},v){const{size:y,last:N}=r.useContext(x),w=c??N,k=Boolean(a||s)&&!w&&!o,C=m("inline-flex min-w-0 items-center px-1",d[y],b[y],h,o?"cursor-not-allowed text-(--neba-disabled-fg)":w?"font-medium text-(--neba-fg)":k?m("cursor-pointer text-(--neba-muted-fg)","hover:bg-(--n-soft) hover:text-(--n-accent)","focus-visible:[outline:2px_solid_var(--n-ring)] focus-visible:outline-offset-1"):"text-(--neba-muted-fg)"),j=t(n,{children:[u(l)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:l}):null,e("span",{className:"truncate",children:f}),u(i)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:i}):null]});return e("li",{ref:v,className:m("flex min-w-0 items-center",p),...g,children:k&&a?e("a",{href:a,className:C,onClick:s,children:j}):k?e("button",{type:"button",className:C,onClick:s,children:j}):e("span",{className:C,"aria-current":w?"page":void 0,"aria-disabled":o||void 0,children:j})})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as o,Fragment as r}from"react/jsx-runtime";import*as n from"react";import{Button as t}from"@base-ui/react/button";import{useRender as a}from"@base-ui/react/use-render";import{ButtonGroupContext as l}from"../../internal/button-group.js";import{controlHeightClasses as s,controlSlots as i,controlSquareClasses as d,controlTextClasses as c,disabledClasses as v,focusRingClasses as p,gapClasses as x,iconClasses as b,paddingXClasses as
|
|
1
|
+
"use client";import{jsx as e,jsxs as o,Fragment as r}from"react/jsx-runtime";import*as n from"react";import{Button as t}from"@base-ui/react/button";import{useRender as a}from"@base-ui/react/use-render";import{ButtonGroupContext as l}from"../../internal/button-group.js";import{controlHeightClasses as s,controlSlots as i,controlSquareClasses as d,controlTextClasses as c,disabledClasses as v,focusRingClasses as p,gapClasses as x,iconClasses as b,paddingXClasses as u,pressTransitionClasses as m,radiusClasses as g,readOnlyFilterClasses as h,surfaceClasses as f,transitionClasses as $}from"../../internal/styles.js";const y={xs:`${s.xs} ${x.xs} ${g.xs} ${c.xs}`,sm:`${s.sm} ${x.sm} ${g.sm} ${c.sm}`,md:`${s.md} ${x.md} ${g.md} ${c.md}`,lg:`${s.lg} ${x.lg} ${g.lg} ${c.lg}`,xl:`${s.xl} ${x.xl} ${g.xl} ${c.xl}`},j={xs:`${d.xs} px-0`,sm:`${d.sm} px-0`,md:`${d.md} px-0`,lg:`${d.lg} px-0`,xl:`${d.xl} px-0`},w=["relative inline-flex shrink-0 select-none items-center justify-center","whitespace-nowrap align-middle font-medium leading-none","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",$,m,p,b].join(" "),k={solid:[f,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[f,"border text-(--n-accent) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--n-accent) bg-transparent"},C={solid:["hover:bg-(--n-fill-hover)","hover:[box-shadow:var(--n-elev-hover),var(--neba-plate-solid)]","active:bg-(--n-fill-active)","active:[box-shadow:var(--n-elev-press),var(--neba-plate-solid)]"].join(" "),outline:["hover:bg-(--n-panel-hover) hover:[border-color:var(--n-line-hover)]","hover:[box-shadow:var(--n-elev-hover),var(--neba-plate-glass)]","active:bg-(--n-panel-press)","active:[box-shadow:var(--n-elev-press),var(--neba-plate-glass)]"].join(" "),text:"hover:bg-(--n-soft) active:bg-(--n-soft-hover)"},P={solid:[f,h,"cursor-default text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--neba-plate-solid)]"].join(" "),outline:[f,h,"cursor-default border text-(--n-accent) bg-(--n-panel)","[border-color:var(--n-line)] [box-shadow:var(--neba-plate-glass)]"].join(" "),text:`${h} cursor-default text-(--n-accent) bg-transparent`};function B(){return o("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"animate-spin",children:[e("circle",{cx:"8",cy:"8",r:"6.5",stroke:"currentColor",strokeOpacity:"0.25",strokeWidth:"2"}),e("path",{d:"M14.5 8A6.5 6.5 0 0 0 8 1.5",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})]})}export const Button=/*@__PURE__*/n.forwardRef(function({variant:s,size:d,color:c,density:p,elevation:x,startIcon:b,endIcon:m,loading:g=!1,readOnly:h=!1,fullWidth:f=!1,disabled:$,render:M,className:N,style:W,children:z,onClick:E,onPointerMove:I,...O},A){const D=n.useContext(l),F=s??D?.variant??"solid",L=d??D?.size??"md",R=c??D?.color??"primary",T=p??D?.density??"default",X=x??D?.elevation??0,Y=$??D?.disabled??!1,q=null==z||!1===z,G=g||h,H=[w,y[L],q?j[L]:u[T][L],Y?v[F]:h?P[F]:k[F],Y||G?"":[C[F],"neba-glow","cursor-pointer"].join(" "),g?"cursor-progress":"",f?"w-full":"",N??""].filter(Boolean).join(" ");return a({render:M??e(t,{disabled:Y}),ref:A,props:{className:H,style:{...i(R,X,F),...W},"aria-disabled":G||void 0,"aria-busy":g||void 0,"data-loading":g||void 0,"data-readonly":h||void 0,onClick:e=>{if(G)return e.preventDefault(),void e.stopPropagation();E?.(e)},onPointerMove:e=>{const o=e.currentTarget;o.style.setProperty("--n-mx",`${e.nativeEvent.offsetX}px`),o.style.setProperty("--n-my",`${e.nativeEvent.offsetY}px`),I?.(e)},...O,children:o(r,{children:[g?e(B,{}):b,z,m]})}})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as o}from"react/jsx-runtime";import*as e from"react";import{ButtonGroupContext as i}from"../../internal/button-group.js";const n={horizontal:"[&>*:not(:first-child)]:rounded-s-none [&>*:not(:last-child)]:rounded-e-none",vertical:"[&>*:not(:first-child)]:rounded-t-none [&>*:not(:last-child)]:rounded-b-none"},
|
|
1
|
+
"use client";import{jsx as o}from"react/jsx-runtime";import*as e from"react";import{ButtonGroupContext as i}from"../../internal/button-group.js";const n={horizontal:"[&>*:not(:first-child)]:rounded-s-none [&>*:not(:last-child)]:rounded-e-none",vertical:"[&>*:not(:first-child)]:rounded-t-none [&>*:not(:last-child)]:rounded-b-none"},t={horizontal:"[&>*:not(:first-child)]:-ms-px",vertical:"[&>*:not(:first-child)]:-mt-px"},r=["inline-flex align-middle","[&>*]:relative [&>*:hover]:z-10 [&>*:focus-visible]:z-10","[&>*]:shrink-0"].join(" ");export const ButtonGroup=/*@__PURE__*/e.forwardRef(function({variant:l,size:s,color:a,density:d,elevation:c,orientation:f="horizontal",disabled:u,fullWidth:h=!1,className:m,children:v,...x},p){const z=e.useMemo(()=>({variant:l,size:s,color:a,density:d,elevation:c,disabled:u}),[l,s,a,d,c,u]);return o(i.Provider,{value:z,children:o("div",{ref:p,role:"group",className:[r,"vertical"===f?"flex-col":"flex-row",n[f],"outline"===(l??"solid")?t[f]:"",h?"flex w-full [&>*]:flex-1":"",m??""].filter(Boolean).join(" "),...x,children:v})})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as l,Fragment as t}from"react/jsx-runtime";import*as n from"react";import{Box as
|
|
1
|
+
"use client";import{jsx as e,jsxs as l,Fragment as t}from"react/jsx-runtime";import*as n from"react";import{Box as s,boxPaddingXClasses as a,boxPaddingYClasses as r}from"../box/Box.js";import{hasContent as i,metaTextClasses as o,sheetBodyClasses as c,sheetHeaderGapClasses as d,sheetSectionGapClasses as m,sheetTitleClasses as f}from"../../internal/styles.js";export const Card=/*@__PURE__*/n.forwardRef(function({size:n="md",density:u="default",title:x,subtitle:h,headerAction:N,footer:p,dividers:$=!1,className:b,children:j,...v},y){const k=a[u][n],g=r[u][n],w=$?`${k} ${g}`:k,B=i(x)||i(h)||i(N),z=l(t,{children:[i(x)||i(h)?l("div",{className:`flex min-w-0 flex-1 flex-col ${d[n]}`,children:[i(x)?e("div",{className:`neba-title font-semibold ${f[n]}`,children:x}):null,i(h)?e("div",{className:`text-(--neba-muted-fg) ${o[n]}`,children:h}):null]}):null,i(N)?e("div",{className:"ml-auto shrink-0",children:N}):null]}),A=[B?{key:"header",className:"flex items-start gap-3",content:z}:null,i(j)?{key:"content",className:c[n],content:j}:null,i(p)?{key:"footer",className:`flex flex-wrap items-center gap-2 ${c[n]}`,content:p}:null].filter(e=>null!==e);return e(s,{ref:y,size:n,density:u,padded:!1,className:["flex flex-col",$?"":`${g} ${m[n]}`,b??""].filter(Boolean).join(" "),...v,children:A.map((l,t)=>e("div",{className:[w,l.className,$&&t>0?"border-t [border-color:var(--n-line)]":""].filter(Boolean).join(" "),children:l.content},l.key))})});
|