neba 1.6.0 → 1.8.0

package/dist/components/app-logo/AppLogo.d.ts

@@ -0,0 +1,148 @@
+import * as React from 'react';
+import { useRender } from '@base-ui/react/use-render';
+import type { NebaColor, NebaElevation, NebaSize, NebaVariant } from '../../types.js';
+/**
+ * How the artwork is *framed*, which is the one question this component exists
+ * to answer.
+ *
+ * - `bare` — drawn as it was given, at the height `size` asks for and whatever
+ *   width that comes to. No plate, no crop, no padding. This is the default,
+ *   and it is the only one that is correct for a logo that was drawn with its
+ *   own background, its own margin, or the product's name set into it.
+ * - `app` — an app icon: a filled tile with the artwork inset in it and the
+ *   corners cut off. What a mark that was drawn as a bare glyph needs before it
+ *   can sit next to anything else.
+ * - `circle` — the same tile, round. For the products whose icon is a disc.
+ *
+ * There is no `square`. A tile with the corners left on is the one shape the
+ * design language does not draw, and an `app` icon at a small size is already
+ * so close to a square that a fourth value would be a value nobody could see.
+ */
+export type AppLogoShape = 'bare' | 'app' | 'circle';
+export interface AppLogoProps extends Omit<React.ComponentPropsWithoutRef<'a'>, 'color' | 'href'> {
+    /**
+     * The artwork, as an image.
+     *
+     * Beaten by `children`, so a project that inlines its SVG and a project that
+     * links a PNG use the same component. A logo file very often has the
+     * product's name set into it — that is what `shape="bare"` is the default
+     * for, since it keeps the file's own aspect ratio instead of squeezing a
+     * wordmark into a square, and why `name` is read out rather than drawn a
+     * second time beside it.
+     */
+    src?: string;
+    /** Candidate images at other resolutions, as on any `<img>`. */
+    srcSet?: string;
+    /**
+     * What the artwork says for a reader who cannot see it. Defaults to `name`,
+     * which is almost always the right answer: a logo means the product.
+     */
+    alt?: string;
+    /**
+     * The product's name.
+     *
+     * One prop doing three jobs, as on Avatar: it names the artwork, it is drawn
+     * as the logotype when there is no artwork at all, and its initials are what
+     * a tile falls back to. It is what makes `<AppLogo name="Neba" />` — with no
+     * file, no icon and no markup — still a logo.
+     */
+    name?: string;
+    /** The initials on a tile, written out, for when the rule derived the wrong ones. */
+    initials?: string;
+    /**
+     * Draws the name beside the artwork, as the words half of a lockup.
+     *
+     * Off by default, because the common case is a file that already says the
+     * name. Turn it on for a bare mark — the icon in a header with the product
+     * next to it — and the name stops being read out twice: what is drawn *is*
+     * the accessible name from then on.
+     *
+     * Ignored when the name is already the whole logo, which is what a `bare`
+     * logo with no artwork is.
+     * @default false
+     */
+    showName?: boolean;
+    /** @default 'bare' */
+    shape?: AppLogoShape;
+    /**
+     * Weight of the tile behind the artwork. Nothing at all on `bare`, which
+     * draws no tile.
+     * @default 'solid'
+     */
+    variant?: NebaVariant;
+    /**
+     * How tall the mark is — the control heights, so a logo and the button beside
+     * it in a header are the same height. On `bare` only the height is set and
+     * the width is whatever the artwork's own proportions come to; on a tile both
+     * are, because a tile is square.
+     * @default 'md'
+     */
+    size?: NebaSize;
+    /** @default 'primary' */
+    color?: NebaColor;
+    /**
+     * Drop shadow depth. `0` (the default) is flat: an app icon is a sticker on
+     * the page, not a thing hovering over it.
+     * @default 0
+     */
+    elevation?: NebaElevation;
+    /**
+     * Insets the artwork from the tile's edge, the way an app icon's glyph is
+     * inset from its own corners. Turn it off for a mark that was drawn to fill
+     * the tile — a favicon, a photograph.
+     *
+     * No effect on `bare`, which has no tile to inset from, and none on a tile
+     * showing initials, which are sized by their own type scale.
+     * @default true
+     */
+    padded?: boolean;
+    /**
+     * An exact height for the mark, overriding `size`. A number is pixels.
+     *
+     * The one escape hatch this component needs: a brand's artwork is drawn at a
+     * height somebody chose, and rounding it to the nearest step of a ladder is
+     * how a logo ends up half a pixel off the type beside it.
+     */
+    height?: number | string;
+    /**
+     * Makes the whole lockup a link. A logo in a header is nearly always the way
+     * back to the front page, and a `<span>` inside an `<a>` the caller wrote is
+     * the same thing with one more element in it.
+     */
+    href?: string;
+    /** Anything else the `<img>` needs — `loading`, `decoding`, `crossOrigin`. */
+    imageProps?: Omit<React.ComponentPropsWithoutRef<'img'>, 'src' | 'srcSet' | 'alt'>;
+    /**
+     * Renders something other than a `<span>` — or than the `<a>` an `href` makes
+     * it. `render={<Link to="/" />}` for a router's own link, `render={<h1 />}`
+     * for the one page where the product's name is the page's heading.
+     */
+    render?: useRender.RenderProp;
+    /**
+     * The artwork, as markup. An inline `<svg>` is the usual one, and it is worth
+     * preferring to `src`: a mark that is part of the document takes the page's
+     * own colours, needs no second request, and cannot arrive late.
+     */
+    children?: React.ReactNode;
+}
+/**
+ * A product's mark, at a known size, that is never an empty box.
+ *
+ * Four things can be the mark and exactly one of them is at a time: markup
+ * handed to `children`, an image at `src`, the initials of `name` on a tile, or
+ * — with no tile to put them on — the name itself, set as the logotype. That
+ * last one is the point of the component: a product that has not drawn a logo
+ * yet still has a logo, and swapping it for the real file later is one prop.
+ *
+ * What it adds over an `<img>` is the framing. A mark drawn as a bare glyph and
+ * a mark drawn with its own background need opposite treatment, and which one a
+ * given file is cannot be worked out from the file — so `shape` is the decision
+ * a caller makes once, and everything else follows from it: `bare` keeps the
+ * artwork's own proportions and draws nothing behind it, `app` and `circle`
+ * inset it into a tile of the page's own colour.
+ *
+ * It carries no tagline and no version. A logo with a line of text under it is
+ * a logo next to a [Typography], and inventing a second spelling for that would
+ * give the library two of them.
+ */
+export declare const AppLogo: React.ForwardRefExoticComponent<AppLogoProps & React.RefAttributes<HTMLElement>>;

package/dist/components/app-logo/AppLogo.js

@@ -0,0 +1 @@
+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}})});

package/dist/components/app-logo/index.d.ts

@@ -0,0 +1,2 @@
+export { AppLogo } from './AppLogo.js';
+export type { AppLogoProps, AppLogoShape } from './AppLogo.js';

package/dist/components/app-logo/index.js

@@ -0,0 +1 @@
+export{AppLogo}from"./AppLogo.js";

package/dist/components/area-chart/AreaChart.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { type CartesianChartProps } from '../../internal/chart-frame';
-import { type ChartMarkers } from '../../internal/chart-line';
-import type { NebaChartCurve, NebaChartValueLabels } from '../../types';
+import { type CartesianChartProps } from '../../internal/chart-frame.js';
+import { type ChartMarkers } from '../../internal/chart-line.js';
+import type { NebaChartCurve, NebaChartValueLabels } from '../../types.js';
 export interface AreaChartProps extends CartesianChartProps {
     /**
      * How the edge of the band gets from one point to the next. The same three

package/dist/components/area-chart/AreaChart.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import*as r from"react";import{CartesianChart as a}from"../../internal/chart-frame";import{LineSeries as t}from"../../internal/chart-line";import{toValues as n}from"../../internal/chart";export function AreaChart({curve:o="linear",stacked:l=!1,markers:i="none",valueLabels:c="none",connectNulls:s=!1,series:m,yAxis:u,format:f,...d}){const x=r.useId().replace(/:/g,""),p="full"===l,h=r.useMemo(()=>{if(!p)return m;const e=n(m),r=[];for(const a of e)a.forEach((e,a)=>{r[a]=(r[a]??0)+Math.abs(e.value??0)});return m.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)}})}))},[m,p]);return e(a,{...d,series:h,format:f,yAxis:p?{min:0,max:100,tickFormat:e=>`${e}%`,...u}:u,stacked:!1!==l,inset:!0,includeZero:!0,headroom:"none"===c?0:10,children:r=>e(t,{context:r,curve:o,filled:!0,stacked:!1!==l,markers:i,valueLabels:c,connectNulls:s,gradient:!1,idPrefix:x})})}
+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:m,yAxis:u,format:f,...d}){const x=r.useId().replace(/:/g,""),p="full"===l,h=r.useMemo(()=>{if(!p)return m;const e=n(m),r=[];for(const a of e)a.forEach((e,a)=>{r[a]=(r[a]??0)+Math.abs(e.value??0)});return m.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)}})}))},[m,p]);return e(a,{...d,series:h,format:f,yAxis:p?{min:0,max:100,tickFormat:e=>`${e}%`,...u}:u,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})})}

package/dist/components/area-chart/index.d.ts

@@ -1,2 +1,2 @@
-export { AreaChart } from './AreaChart';
-export type { AreaChartProps } from './AreaChart';
+export { AreaChart } from './AreaChart.js';
+export type { AreaChartProps } from './AreaChart.js';

package/dist/components/area-chart/index.js

@@ -1 +1 @@
-export{AreaChart}from"./AreaChart";
+export{AreaChart}from"./AreaChart.js";

package/dist/components/aspect-ratio/AspectRatio.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useRender } from '@base-ui/react/use-render';
-import type { NebaSize } from '../../types';
+import type { NebaSize } from '../../types.js';
 /**
  * How the media inside is fitted to the box, spelled the way CSS spells it.
  *

package/dist/components/aspect-ratio/AspectRatio.js

@@ -1 +1 @@
-import*as e from"react";import{useRender as i}from"@base-ui/react/use-render";import{radiusClasses as o}from"../../internal/styles";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=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 b=["relative block w-full overflow-hidden",t,c[r],l?o[n]:"",a??""].filter(Boolean).join(" ");return i({render:s,ref:d,props:{className:b,style:{aspectRatio:e,...f},children:m,...u}})});
+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}})});

package/dist/components/aspect-ratio/index.d.ts

@@ -1,2 +1,2 @@
-export { AspectRatio } from './AspectRatio';
-export type { AspectRatioProps, NebaAspectFit } from './AspectRatio';
+export { AspectRatio } from './AspectRatio.js';
+export type { AspectRatioProps, NebaAspectFit } from './AspectRatio.js';

package/dist/components/aspect-ratio/index.js

@@ -1 +1 @@
-export{AspectRatio}from"./AspectRatio";
+export{AspectRatio}from"./AspectRatio.js";

package/dist/components/avatar/Avatar.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { NebaColor, NebaElevation, NebaSize, NebaTransition, NebaVariant } from '../../types';
+import type { NebaColor, NebaElevation, NebaSize, NebaTransition, NebaVariant } from '../../types.js';
 /** What Base UI reports about the picture as it loads. */
 export type AvatarLoadingStatus = 'idle' | 'loading' | 'loaded' | 'error';
 /**

package/dist/components/avatar/Avatar.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{Avatar as n}from"@base-ui/react/avatar";import{transitionProps as a}from"../../internal/animate";import{controlHeightClasses as o,controlSlots as l,controlSquareClasses as s,hasContent as i,srOnlyClasses as d,surfaceClasses as c,transitionClasses as m}from"../../internal/styles";const f={xs:"text-[0.5625rem]",sm:"text-[0.6875rem]",md:"text-[0.8125rem]",lg:"text-[1rem]",xl:"text-[1.1875rem]"},u={xs:"rounded-[0.375rem]",sm:"rounded-[0.4375rem]",md:"rounded-[0.5625rem]",lg:"rounded-[0.6875rem]",xl:"rounded-[0.875rem]"},x={solid:[c,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev)]"].join(" "),outline:[c,"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]",v={solid:`${h} after:[box-shadow:var(--neba-plate-solid)]`,outline:`${h} after:[box-shadow:var(--neba-plate-glass)]`,text:""},p=["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%]",m].join(" ");function g(){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=r.forwardRef(function({src:r,srcSet:c,alt:m,name:h,initials:b,shape:w="circle",variant:y="text",size:j="md",color:N="primary",elevation:z=0,delay:C,imageProps:A,onLoadingStatusChange:B,transition:S,className:k,style:L,children:F,...M},R){const Z=h?function(e){const t=e.normalize("NFC").trim().split(/\s+/).filter(Boolean);return 0===t.length?"":((Array.from(t[0])[0]??"")+(t.length>1?Array.from(t[t.length-1])[0]??"":"")).toLocaleUpperCase()}(h):"",$=a(S),_=m??h,I=i(F)?F:(b??Z)||e(g,{}),P=i(F)||Boolean(b??Z),U=[p,o[j],s[j],f[j],"circle"===w?"rounded-full":u[j],x[y],v[y],$.className,k??""].filter(Boolean).join(" ");return t(n.Root,{ref:R,className:U,style:{...l(N,z,y),...$.style,...L},...M,children:[r?e(n.Image,{src:r,srcSet:c,alt:_??"",className:"size-full object-cover",onLoadingStatusChange:B,...A}):null,t(n.Fallback,{delay:r?C:void 0,className:"flex size-full items-center justify-center",children:[_&&P?e("span",{className:d,children:_}):null,e("span",{"aria-hidden":!(!_||!P)||void 0,className:"contents",children:I})]})]})});
+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})]})]})});

package/dist/components/avatar/index.d.ts

@@ -1,2 +1,2 @@
-export { Avatar } from './Avatar';
-export type { AvatarLoadingStatus, AvatarProps, AvatarShape } from './Avatar';
+export { Avatar } from './Avatar.js';
+export type { AvatarLoadingStatus, AvatarProps, AvatarShape } from './Avatar.js';

package/dist/components/avatar/index.js

@@ -1 +1 @@
-export{Avatar}from"./Avatar";
+export{Avatar}from"./Avatar.js";

package/dist/components/badge/Badge.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { NebaCorner, NebaElevation, NebaStyleProps } from '../../types';
+import type { NebaCorner, NebaElevation, NebaStyleProps } from '../../types.js';
 export interface BadgeProps extends NebaStyleProps, Omit<React.ComponentPropsWithoutRef<'span'>, 'color' | 'content'> {
     /**
      * What the badge says — usually a count, sometimes a word.

package/dist/components/badge/Badge.js

@@ -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 a,surfaceClasses as l,transitionClasses as i}from"../../internal/styles";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"},f={"top-start":"mt-[7%] ms-[7%]","top-end":"mt-[7%] me-[7%]","bottom-start":"mb-[7%] ms-[7%]","bottom-end":"mb-[7%] me-[7%]"},h={solid:[l,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[l,"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=n.forwardRef(function({variant:n="solid",size:l="md",color:u="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,h[n],G?d[l]:[r[l],b[l],x[v][l]].join(" "),D?`absolute ${g[B]}`:"relative align-middle",D?G?c[l].dot:c[l].badge:"",D&&"circle"===$?f[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(u,w,n),...R},"aria-hidden":!!H||void 0,...A,children:H?null:m(t,{children:[G||q?e("span",{className:a,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});
+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 a,surfaceClasses as l,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"},f={"top-start":"mt-[7%] ms-[7%]","top-end":"mt-[7%] me-[7%]","bottom-start":"mb-[7%] ms-[7%]","bottom-end":"mb-[7%] me-[7%]"},h={solid:[l,"text-(--n-on-solid) bg-(--n-fill)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[l,"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:l="md",color:u="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,h[n],G?d[l]:[r[l],b[l],x[v][l]].join(" "),D?`absolute ${g[B]}`:"relative align-middle",D?G?c[l].dot:c[l].badge:"",D&&"circle"===$?f[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(u,w,n),...R},"aria-hidden":!!H||void 0,...A,children:H?null:m(t,{children:[G||q?e("span",{className:a,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});

package/dist/components/badge/index.d.ts

@@ -1,2 +1,2 @@
-export { Badge } from './Badge';
-export type { BadgeProps } from './Badge';
+export { Badge } from './Badge.js';
+export type { BadgeProps } from './Badge.js';

package/dist/components/badge/index.js

@@ -1 +1 @@
-export{Badge}from"./Badge";
+export{Badge}from"./Badge.js";

package/dist/components/bar-chart/BarChart.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { type CartesianChartProps } from '../../internal/chart-frame';
-import type { NebaChartValueLabels, NebaOrientation } from '../../types';
+import { type CartesianChartProps } from '../../internal/chart-frame.js';
+import type { NebaChartValueLabels, NebaOrientation } from '../../types.js';
 export interface BarChartProps extends CartesianChartProps {
     /**
      * Which way the bars run.

package/dist/components/bar-chart/BarChart.js

@@ -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";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";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:S}=a,j=m.map((e,t)=>({one:e,index:t})).filter(e=>v[e.index]),A=n?1:Math.max(1,j.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:[j.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 j=n&&0!==x?s:0,A=Math.abs(k-y)-j;if(A<=0)return null;const C=k<y,E=m===b,F=z?o(Math.min(y,k)+(C?0:j),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:j),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??S(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}
+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}

package/dist/components/bar-chart/index.d.ts

@@ -1,2 +1,2 @@
-export { BarChart } from './BarChart';
-export type { BarChartProps } from './BarChart';
+export { BarChart } from './BarChart.js';
+export type { BarChartProps } from './BarChart.js';

package/dist/components/bar-chart/index.js

@@ -1 +1 @@
-export{BarChart}from"./BarChart";
+export{BarChart}from"./BarChart.js";

package/dist/components/blockquote/Blockquote.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { NebaElevation, NebaStyleProps, NebaTransition } from '../../types';
+import type { NebaElevation, NebaStyleProps, NebaTransition } from '../../types.js';
 /**
  * The props are a `<figure>`'s rather than a `<blockquote>`'s, which is a
  * consequence of where the drawing happens: everything a caller passes lands on

package/dist/components/blockquote/Blockquote.js

@@ -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";import{transitionProps as a}from"../../internal/animate";import{hasContent as l,metaTextClasses as o,radiusClasses as i,surfaceClasses as s,surfaceSlots as c,transitionClasses as m}from"../../internal/styles";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:[s,"bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[s,"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=t.forwardRef(function({variant:t="text",size:s="md",color:b="primary",density:p="default",elevation:h=0,author:v,source:g,cite:N,icon:j,transition:y,className:w,style:B,children:k,...z},q){const M=a(y),Z=l(v)||l(g),C=void 0===j?e(u,{}):j,R=["flex flex-col text-(--neba-fg)",x,"text"===t?"":`${i[s]} rounded-s-none`,f[t],n[p][s],m,M.className,w??""].filter(Boolean).join(" "),$=r("blockquote",{cite:N,className:d[s],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)",o[s]].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:$})});
+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 o,radiusClasses as s,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?"":`${s[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)",o[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:$})});

package/dist/components/blockquote/index.d.ts

@@ -1,2 +1,2 @@
-export { Blockquote } from './Blockquote';
-export type { BlockquoteProps } from './Blockquote';
+export { Blockquote } from './Blockquote.js';
+export type { BlockquoteProps } from './Blockquote.js';

package/dist/components/blockquote/index.js

@@ -1 +1 @@
-export{Blockquote}from"./Blockquote";
+export{Blockquote}from"./Blockquote.js";

package/dist/components/bottom-navigation/BottomNavigation.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { useRender } from '@base-ui/react/use-render';
-import type { BottomNavigationLabels, BottomNavigationValue } from '../../internal/bottom-navigation';
-import type { NebaElevation, NebaPosition, NebaStyleProps } from '../../types';
-export type { BottomNavigationLabels, BottomNavigationValue } from '../../internal/bottom-navigation';
+import type { BottomNavigationLabels, BottomNavigationValue } from '../../internal/bottom-navigation.js';
+import type { NebaElevation, NebaPosition, NebaStyleProps } from '../../types.js';
+export type { BottomNavigationLabels, BottomNavigationValue } from '../../internal/bottom-navigation.js';
 export interface BottomNavigationProps extends NebaStyleProps, Omit<React.ComponentPropsWithoutRef<'nav'>, 'color' | 'defaultValue' | 'onChange'> {
     /** The destination the reader is on. Use with `onValueChange` for a controlled bar. */
     value?: BottomNavigationValue | null;

package/dist/components/bottom-navigation/BottomNavigation.js

@@ -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 r,BottomNavigationContext as l}from"../../internal/bottom-navigation";import{cx as o,hasContent as s,iconSizeClasses as d,metaTextClasses as c,paddingXClasses as m,radiusClasses as u,srOnlyClasses as p,surfaceClasses as f,surfaceSlots as g,transitionClasses as b}from"../../internal/styles";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=n.forwardRef(function({variant:t="outline",size:a="md",color:s="primary",density:d="default",elevation:c=0,value:m,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!==m,M=I?m: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?u[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)]":"",b,B);return i({render:C??e("nav",{}),ref:A,props:{"aria-label":k,className:q,style:{...g(s,c),...R},children:e(l.Provider,{value:S,children:e("div",{className:o("flex w-full items-stretch",r[a],h[d][a]),children:V})}),..._}})});export const BottomNavigationItem=n.forwardRef(function({value:i,icon:r,href:f,disabled:g=!1,className:v,children:x,onClick:h,...w},N){const z=n.useContext(l),j=g||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",m[z.density][z.size],"rounded-full"):o("flex-1 px-1",u[z.size]),y[z.size],"[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",b,"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(r)?e("span",{className:o("flex shrink-0 items-center justify-center",d[z.size]),children:r}):null,s(x)?z.floating?e("span",{"data-drawn":C?"":void 0,className:o("grid justify-items-center","[transition-property:grid-template-rows,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] [grid-template-rows:1fr] opacity-100":"[grid-template-columns:0fr] [grid-template-rows:0fr] opacity-0"),children:e("span",{className:o("min-h-0 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})});
+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})});

package/dist/components/bottom-navigation/index.d.ts

@@ -1 +1 @@
-export * from './BottomNavigation';
+export * from './BottomNavigation.js';

package/dist/components/bottom-navigation/index.js

@@ -1 +1 @@
-export*from"./BottomNavigation";
+export*from"./BottomNavigation.js";

package/dist/components/box/Box.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useRender } from '@base-ui/react/use-render';
-import type { NebaDensity, NebaElevation, NebaSize, NebaStyleProps, NebaTransition } from '../../types';
+import type { NebaDensity, NebaElevation, NebaSize, NebaStyleProps, NebaTransition } from '../../types.js';
 export interface BoxProps extends NebaStyleProps, Omit<React.ComponentPropsWithoutRef<'div'>, 'color'> {
     /**
      * Drop shadow depth. `0` (the default) is flat — the acrylic edge is what

package/dist/components/box/Box.js

@@ -1 +1 @@
-import*as e from"react";import{useRender as a}from"@base-ui/react/use-render";import{transitionProps as s}from"../../internal/animate";import{radiusClasses as o,surfaceClasses as t,surfaceSlots as n,transitionClasses as p}from"../../internal/styles";const l=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",p].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=e.forwardRef(function({variant:e="outline",size:o="md",color:t="primary",density:p="default",elevation:d=0,padded:i=!0,transition:m,render:c,className:b,style:g,children:f,...y},u){const v=s(m),h=[r,l[o],i?boxPaddingClasses[p][o]:"",x[e],v.className,b??""].filter(Boolean).join(" ");return a({render:c,ref:u,props:{className:h,style:{...n(t,d),...v.style,...g},children:f,...y}})});
+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 p}from"../../internal/styles.js";const l=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",p].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:p="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,l[o],i?boxPaddingClasses[p][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}})});

package/dist/components/box/index.d.ts

@@ -1,2 +1,2 @@
-export { Box } from './Box';
-export type { BoxProps } from './Box';
+export { Box } from './Box.js';
+export type { BoxProps } from './Box.js';

package/dist/components/box/index.js

@@ -1 +1 @@
-export{Box}from"./Box";
+export{Box}from"./Box.js";

package/dist/components/breadcrumb/Breadcrumb.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { NebaColor, NebaDensity, NebaSize } from '../../types';
+import type { NebaColor, NebaDensity, NebaSize } from '../../types.js';
 /**
  * What is drawn between two steps of the trail.
  *

package/dist/components/breadcrumb/Breadcrumb.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import*as r from"react";import{useMessages as a}from"../../internal/i18n";import{ArrowRightIcon as s,ChevronIcon as l,EllipsisIcon as i}from"../../internal/icons";import{controlTextClasses as c,cx as o,gapClasses as m,hasContent as d,iconClasses as u,radiusClasses as p,transitionClasses as f}from"../../internal/styles";const h=r.createContext({size:"md",last:!1}),x={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:p.xs,sm:p.xs,md:p.xs,lg:p.sm,xl:p.sm};const g=["chevron","arrow","slash","dot"];function v(e){return"string"==typeof e||"number"==typeof e?String(e):Array.isArray(e)?e.map(v).join(""):r.isValidElement(e)?v(e.props.children):""}function y(e,t){if(!t)return e;try{return new URL(e,t).href}catch{return e}}function N(e,t){const n=e.map((e,n)=>{const{href:r,children:a}=e.props;return{"@type":"ListItem",position:n+1,name:v(a),...r?{item:y(r,t)}:null}});return JSON.stringify({"@context":"https://schema.org","@type":"BreadcrumbList",itemListElement:n}).replace(/</g,"\\u003c")}export const Breadcrumb=r.forwardRef(function({size:n="md",color:m="primary",density:d="default",separator:p="chevron",maxItems:b,itemsBeforeCollapse:v=1,itemsAfterCollapse:y=1,expandable:w=!0,locale:k,label:C,expandLabel:I,structuredData:L=!1,baseUrl:_,className:j,style:B,children:z,...A},M){const S=a(k),[E,R]=r.useState(!1),$=r.Children.toArray(z).filter(r.isValidElement),F=$.length,U=$.some(e=>!0===e.props.current),V=!E&&void 0!==b&&F>Math.max(b,1)&&F-v-y>1?[...$.slice(0,Math.max(0,v)),null,...$.slice(F-Math.max(0,y))]:$,D="string"==typeof(H=p)&&g.includes(H)?function(t){switch(t){case"chevron":return e("span",{className:"flex -rotate-90 items-center rtl:rotate-90",children:e(l,{})});case"arrow":return e("span",{className:"flex items-center rtl:rotate-180",children:e(s,{})});case"slash":return e("span",{className:"opacity-70",children:"/"});case"dot":return e("span",{className:"opacity-70",children:"·"});default:return null}}(p):p;var H;const J=o("inline-flex items-center rounded-(--neba-radius-xs) px-0.5","text-(--neba-muted-fg)",f,u,w?o("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:M,"aria-label":C??S.breadcrumb.label,className:o("flex",c[n],u,j),style:{"--n-accent":`var(--neba-${m}-accent)`,"--n-soft":`var(--neba-${m}-soft)`,"--n-ring":`var(--neba-${m}-ring)`,...B},...A,children:[L&&F>0?e("script",{type:"application/ld+json",dangerouslySetInnerHTML:{__html:N($,_)}}):null,e("ol",{role:"list",className:o("flex list-none flex-wrap items-center p-0",x[d][n]),children:V.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:D}):null,a?e(h.Provider,{value:{size:n,last:!U&&s===V.length-1},children:a}):e("li",{className:"flex shrink-0 items-center",children:w?e("button",{type:"button",className:J,"aria-label":I??S.breadcrumb.expand,onClick:()=>R(!0),children:e(i,{})}):e("span",{className:J,"aria-hidden":"true",children:e(i,{})})})]},a?a.key??s:"fold"))})]})});export const BreadcrumbItem=r.forwardRef(function({href:a,onClick:s,startIcon:l,endIcon:i,current:c,disabled:u=!1,className:p,children:x,...g},v){const{size:y,last:N}=r.useContext(h),w=c??N,k=Boolean(a||s)&&!w&&!u,C=o("inline-flex min-w-0 items-center px-1",m[y],b[y],f,u?"cursor-not-allowed text-(--neba-disabled-fg)":w?"font-medium text-(--neba-fg)":k?o("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)"),I=t(n,{children:[d(l)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:l}):null,e("span",{className:"truncate",children:x}),d(i)?e("span",{className:"flex h-[1lh] shrink-0 items-center",children:i}):null]});return e("li",{ref:v,className:o("flex min-w-0 items-center",p),...g,children:k&&a?e("a",{href:a,className:C,onClick:s,children:I}):k?e("button",{type:"button",className:C,onClick:s,children:I}):e("span",{className:C,"aria-current":w?"page":void 0,"aria-disabled":u||void 0,children:I})})});
+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})})});

package/dist/components/breadcrumb/index.d.ts

@@ -1,2 +1,2 @@
-export { Breadcrumb, BreadcrumbItem } from './Breadcrumb';
-export type { BreadcrumbItemProps, BreadcrumbProps, BreadcrumbSeparator } from './Breadcrumb';
+export { Breadcrumb, BreadcrumbItem } from './Breadcrumb.js';
+export type { BreadcrumbItemProps, BreadcrumbProps, BreadcrumbSeparator } from './Breadcrumb.js';

package/dist/components/breadcrumb/index.js

@@ -1 +1 @@
-export{Breadcrumb,BreadcrumbItem}from"./Breadcrumb";
+export{Breadcrumb,BreadcrumbItem}from"./Breadcrumb.js";

package/dist/components/button/Button.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useRender } from '@base-ui/react/use-render';
-import type { NebaElevation, NebaStyleProps } from '../../types';
+import type { NebaElevation, NebaStyleProps } from '../../types.js';
 export interface ButtonProps extends NebaStyleProps, Omit<React.ComponentPropsWithoutRef<'button'>, 'color'> {
     /**
      * Drop shadow depth. `0` (the default) is flat — the acrylic edge is what

package/dist/components/button/Button.js

@@ -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";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 m,pressTransitionClasses as u,radiusClasses as g,readOnlyFilterClasses as h,surfaceClasses as f,transitionClasses as $}from"../../internal/styles";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}`},w={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`},j=["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]",$,u,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=n.forwardRef(function({variant:s,size:d,color:c,density:p,elevation:x,startIcon:b,endIcon:u,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=[j,y[L],q?w[L]:m[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,u]})}})});
+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 m,pressTransitionClasses as u,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]",$,u,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:u,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]:m[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,u]})}})});

package/dist/components/button/index.d.ts

@@ -1,2 +1,2 @@
-export { Button } from './Button';
-export type { ButtonProps } from './Button';
+export { Button } from './Button.js';
+export type { ButtonProps } from './Button.js';

package/dist/components/button/index.js

@@ -1 +1 @@
-export{Button}from"./Button";
+export{Button}from"./Button.js";

package/dist/components/button-group/ButtonGroup.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { NebaElevation, NebaOrientation, NebaStyleProps } from '../../types';
+import type { NebaElevation, NebaOrientation, NebaStyleProps } from '../../types.js';
 export interface ButtonGroupProps extends NebaStyleProps, Omit<React.ComponentPropsWithoutRef<'div'>, 'color'> {
     /**
      * Which way the buttons run. A vertical group is for a stacked menu of equal

package/dist/components/button-group/ButtonGroup.js

@@ -1 +1 @@
-import{jsx as o}from"react/jsx-runtime";import*as e from"react";import{ButtonGroupContext as i}from"../../internal/button-group";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"},r={horizontal:"[&>*:not(:first-child)]:-ms-px",vertical:"[&>*:not(:first-child)]:-mt-px"},t=["inline-flex align-middle","[&>*]:relative [&>*:hover]:z-10 [&>*:focus-visible]:z-10","[&>*]:shrink-0"].join(" ");export const ButtonGroup=e.forwardRef(function({variant:l,size:a,color:d,density:s,elevation:c,orientation:f="horizontal",disabled:u,fullWidth:h=!1,className:m,children:v,...x},p){const z=e.useMemo(()=>({variant:l,size:a,color:d,density:s,elevation:c,disabled:u}),[l,a,d,s,c,u]);return o(i.Provider,{value:z,children:o("div",{ref:p,role:"group",className:[t,"vertical"===f?"flex-col":"flex-row",n[f],"outline"===(l??"solid")?r[f]:"",h?"flex w-full [&>*]:flex-1":"",m??""].filter(Boolean).join(" "),...x,children:v})})});
+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"},r={horizontal:"[&>*:not(:first-child)]:-ms-px",vertical:"[&>*:not(:first-child)]:-mt-px"},t=["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:a,color:s,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:a,color:s,density:d,elevation:c,disabled:u}),[l,a,s,d,c,u]);return o(i.Provider,{value:z,children:o("div",{ref:p,role:"group",className:[t,"vertical"===f?"flex-col":"flex-row",n[f],"outline"===(l??"solid")?r[f]:"",h?"flex w-full [&>*]:flex-1":"",m??""].filter(Boolean).join(" "),...x,children:v})})});

package/dist/components/button-group/index.d.ts

@@ -1,2 +1,2 @@
-export { ButtonGroup } from './ButtonGroup';
-export type { ButtonGroupProps } from './ButtonGroup';
+export { ButtonGroup } from './ButtonGroup.js';
+export type { ButtonGroupProps } from './ButtonGroup.js';

package/dist/components/button-group/index.js

@@ -1 +1 @@
-export{ButtonGroup}from"./ButtonGroup";
+export{ButtonGroup}from"./ButtonGroup.js";