neba 1.1.0 → 1.2.0

package/dist/components/spoiler/Spoiler.d.ts

@@ -0,0 +1,95 @@
+import * as React from 'react';
+import type { NebaColor, NebaDensity, NebaElevation, NebaSize, NebaVariant } from '../../types';
+export interface SpoilerProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'color' | 'onChange'> {
+    /** Whether the content is uncovered. Pass it to drive the Spoiler yourself. */
+    revealed?: boolean;
+    /**
+     * Where an uncontrolled Spoiler starts.
+     * @default false
+     */
+    defaultRevealed?: boolean;
+    /** Called when the reveal or hide button is pressed. */
+    onRevealedChange?: (revealed: boolean) => void;
+    /**
+     * Which language the default label and notice are written in — a BCP 47 tag
+     * such as `ko`, `pt-BR` or `zh-Hant`. Unsupported tags fall back to English.
+     *
+     * Both strings can be written out instead, in `label` and `description`; this
+     * is for the far more common case where the page already knows its language
+     * and nobody should have to translate a button that says "Reveal".
+     */
+    locale?: string;
+    /** The reveal button's label. Defaults to the `locale`'s word for it. */
+    label?: React.ReactNode;
+    /** The hide button's label, when `reversible` is on. */
+    hideLabel?: React.ReactNode;
+    /**
+     * The line above the button, saying why the content is covered. Defaults to
+     * the `locale`'s wording; pass `false` for a cover with nothing written on it.
+     */
+    description?: React.ReactNode | false;
+    /**
+     * Replaces the default reveal button entirely.
+     *
+     * The replacement is yours to wire up: pass `revealed` and
+     * `onRevealedChange` and drive it from your own control. `label` is the prop
+     * for the far commoner case of wanting different words on the button that is
+     * already there.
+     */
+    action?: React.ReactNode;
+    /**
+     * Keeps the content coverable: once revealed, a hide button appears under it.
+     * @default false
+     */
+    reversible?: boolean;
+    /**
+     * Clamps the covered box to this height — a CSS length, or a number in
+     * pixels. Revealing releases it and the content takes whatever height it
+     * needs.
+     *
+     * Left out, the box is exactly as tall as what it holds, which is the right
+     * default for a paragraph or a picture. Set it for something long enough that
+     * a page of blurred content would be a page of nothing.
+     */
+    maxHeight?: number | string;
+    /**
+     * How hard the content is blurred, in pixels.
+     * @default 10
+     */
+    blur?: number;
+    /**
+     * Inner padding around the content, on Box's own `size`/`density` scale. Turn
+     * it off for something that should reach the edges — a picture, a video.
+     * @default true
+     */
+    padded?: boolean;
+    /**
+     * Weight of the box's surface. `text` draws no box at all, which is what a
+     * spoiler sitting inside running prose usually wants.
+     * @default 'outline'
+     */
+    variant?: NebaVariant;
+    /** The sheet's radius, and the size of the button on it. @default 'md' */
+    size?: NebaSize;
+    /** @default 'primary' */
+    color?: NebaColor;
+    /** Padding around the cover's own text and button. @default 'default' */
+    density?: NebaDensity;
+    /** Drop shadow depth. `0` (the default) is flat. @default 0 */
+    elevation?: NebaElevation;
+    /** What is being covered. */
+    children?: React.ReactNode;
+}
+/**
+ * Content that is covered until somebody asks for it.
+ *
+ * The cover is a blur rather than a `display: none`, which is the whole point:
+ * a reader can see that there is something there, roughly how much of it there
+ * is, and — with `maxHeight` — that it has been clamped. What they cannot do is
+ * read it by accident, which is the one thing a spoiler is for.
+ *
+ * While it is covered the content is `inert`, so it is not tabbable, not
+ * readable by a screen reader and not selectable by a drag across the page. A
+ * spoiler that could be defeated by Ctrl-A is not a spoiler.
+ */
+export declare const Spoiler: React.ForwardRefExoticComponent<SpoilerProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/spoiler/Spoiler.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as i from"react";import{Button as n}from"../button/Button";import{useMessages as o}from"../../internal/i18n";import{boxPaddingClasses as a,boxPaddingXClasses as l,boxPaddingYClasses as t}from"../box/Box";import{hasContent as s,metaTextClasses as d,radiusClasses as c,surfaceClasses as m,surfaceSlots as v,transitionClasses as f}from"../../internal/styles";const p={solid:[m,"bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[m,"border bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"bg-transparent"},u="[background-color:color-mix(in_oklab,var(--neba-surface)_55%,transparent)]";export const Spoiler=i.forwardRef(function({revealed:m,defaultRevealed:b=!1,onRevealedChange:x,locale:h,label:j,hideLabel:g,description:y,action:w,reversible:N=!1,maxHeight:k,blur:z=10,padded:B=!0,variant:_="outline",size:C="md",color:R="primary",density:H="default",elevation:S=0,className:$,style:I,children:L,...q},A){const D=o(h),E=i.useId(),[F,G]=i.useState(b),J=m??F,K=e=>{void 0===m&&G(e),x?.(e)},M=!1===y?null:y??D.spoiler.notice;return r("div",{ref:A,className:["relative isolate overflow-hidden",c[C],p[_],f,$??""].filter(Boolean).join(" "),style:{...v(R,S),...I},...q,children:[e("div",{id:E,className:["min-w-0",B?a[H][C]:"","[transition:filter_var(--neba-duration-fill)_var(--neba-ease)]","motion-reduce:[transition-duration:0ms]",J?"":"select-none"].filter(Boolean).join(" "),style:{filter:J?void 0:`blur(${z}px)`,maxHeight:J?void 0:k,overflow:J?void 0:"hidden"},inert:!J,children:L}),J?null:r("div",{className:["absolute inset-0 z-10 flex flex-col items-center justify-center gap-2 text-center",a[H][C],u].join(" "),children:[s(M)?e("p",{className:`m-0 text-(--neba-muted-fg) ${d[C]}`,children:M}):null,w??e(n,{size:C,color:R,density:H,onClick:()=>K(!0),"aria-expanded":!1,"aria-controls":E,children:j??D.spoiler.reveal})]}),J&&N?e("div",{className:["flex justify-end",l[H][C],t[H][C],"pt-0"].join(" "),children:e(n,{variant:"text",size:C,color:R,density:H,onClick:()=>K(!1),"aria-expanded":!0,"aria-controls":E,children:g??D.spoiler.hide})}):null]})});

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

@@ -0,0 +1,2 @@
+export { Spoiler } from './Spoiler';
+export type { SpoilerProps } from './Spoiler';

package/dist/components/spoiler/index.js

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

package/dist/components/text-link/TextLink.d.ts

@@ -0,0 +1,82 @@
+import * as React from 'react';
+import { useRender } from '@base-ui/react/use-render';
+import type { NebaColor, NebaSize } from '../../types';
+/**
+ * When the line under a link is drawn.
+ *
+ * `always` is the default, and the reason is `color`: a TextLink takes no
+ * colour family unless one is asked for, so with the line off there would be
+ * nothing at all distinguishing a link from the sentence it sits in. That is
+ * also why this is not a boolean — "no underline" is a real choice for a link
+ * in a nav bar or a footer, where position already says what it is, and it
+ * should have to be spelled out rather than fallen into.
+ */
+export type TextLinkUnderline = 'always' | 'hover' | 'none';
+export interface TextLinkProps extends Omit<React.ComponentPropsWithoutRef<'a'>, 'color'> {
+    /** Where the link goes. */
+    href: string;
+    /**
+     * When the underline is drawn.
+     * @default 'always'
+     */
+    underline?: TextLinkUnderline;
+    /**
+     * Semantic colour role. Like [Typography](../display/typography) and unlike
+     * every control in the library this has **no default** — a link in a
+     * paragraph is usually the paragraph's own colour with a line under it, and a
+     * component that arrived pre-dyed is one a page has to undo.
+     */
+    color?: NebaColor;
+    /**
+     * The type scale. Also no default: a link inside a sentence is the size of
+     * the sentence. Set it for a link that stands on its own.
+     */
+    size?: NebaSize;
+    /**
+     * Opens the link in a new tab, with the `rel` that keeps the new page from
+     * reaching back into this one.
+     *
+     * A window changing under the reader is the one thing about a link that
+     * cannot be seen before it happens, so this also turns `icon` on by default
+     * and adds a line for a screen reader — see `locale`.
+     * @default false
+     */
+    newTab?: boolean;
+    /**
+     * The mark after the label. `true` draws the arrow leaving its box when
+     * `newTab` is on and the chain otherwise, `false` draws nothing, and a node
+     * of your own replaces the glyph.
+     *
+     * Left out, it follows `newTab`.
+     */
+    icon?: React.ReactNode | boolean;
+    /**
+     * Which language the line for a screen reader is written in — a BCP 47 tag
+     * such as `ko`, `pt-BR` or `zh-Hant`. Unsupported tags fall back to English.
+     *
+     * Only `newTab` produces that line; a link without it says nothing of its
+     * own, so this changes nothing.
+     */
+    locale?: string;
+    /**
+     * Renders something other than an `<a>` — the `Link` a router brings, most
+     * of the time. `href` still goes through, so `render={<NextLink href="…" />}`
+     * needs it written once, on the TextLink.
+     */
+    render?: useRender.RenderProp;
+    /** The label. */
+    children?: React.ReactNode;
+}
+/**
+ * A link, in a sentence or on its own.
+ *
+ * Everything about it is deliberately smaller than a Button. It has no surface,
+ * no height of its own and no colour unless asked — what it has is a line under
+ * it, which is the one mark a reader already knows means "this goes somewhere".
+ *
+ * The three things it does that a bare `<a>` does not: it draws that line on a
+ * schedule (`always`, or only under the pointer), it marks a link that opens a
+ * new tab both visibly and for a screen reader, and it takes `render`, so the
+ * `Link` a router brings can wear all of it.
+ */
+export declare const TextLink: React.ForwardRefExoticComponent<TextLinkProps & React.RefAttributes<HTMLAnchorElement>>;

package/dist/components/text-link/TextLink.js

@@ -0,0 +1 @@
+import{jsx as n,Fragment as e,jsxs as r}from"react/jsx-runtime";import*as i from"react";import{useRender as o}from"@base-ui/react/use-render";import{useMessages as a}from"../../internal/i18n";import{ExternalLinkIcon as t,LinkIcon as l}from"../../internal/icons";import{controlTextLeadingClasses as s,focusRingClasses as c,srOnlyClasses as m}from"../../internal/styles";const d={always:"[&.neba-link]:underline",hover:"[&.neba-link]:no-underline [&.neba-link]:hover:underline",none:"[&.neba-link]:no-underline"},u=["neba-link","cursor-pointer","[&_svg]:pointer-events-none [&_svg]:inline [&_svg]:size-[0.95em] [&_svg]:shrink-0",["[transition-property:color,text-decoration-color]","[transition-duration:var(--neba-duration)]","[transition-timing-function:var(--neba-ease)]"].join(" "),c,"focus-visible:rounded-[0.25rem]"].join(" ");export const TextLink=i.forwardRef(function({href:i,underline:c="always",color:p,size:b,newTab:f=!1,icon:v,locale:h,render:k,className:g,style:x,children:y,...j},w){const _=a(h),N=v??f,T=!0===N?n(f?t:l,{}):N,z=[u,b?s[b]:"",d[c],p?"[&.neba-link]:text-(--n-accent)":"[&.neba-link]:text-inherit",g??""].filter(Boolean).join(" "),C={"--n-underline":"color-mix(in oklab, currentColor 45%, transparent)","--n-underline-hover":"currentColor","--n-ring":`var(--neba-${p??"primary"}-ring)`,...p?{"--n-accent":`var(--neba-${p}-accent)`}:null};return o({render:k??n("a",{}),ref:w,props:{href:i,target:f?"_blank":void 0,rel:f?"noopener noreferrer":void 0,className:z,style:{...C,...x},children:r(e,{children:[y,T?n("span",{className:"ms-[0.25em]",children:T}):null,f?r(e,{children:[" ",n("span",{className:m,children:_.link.newTab})]}):null]}),...j}})});

package/dist/components/text-link/index.d.ts

@@ -0,0 +1,2 @@
+export { TextLink } from './TextLink';
+export type { TextLinkProps, TextLinkUnderline } from './TextLink';

package/dist/components/text-link/index.js

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

package/dist/components/tree-view/TreeView.d.ts

@@ -0,0 +1,115 @@
+import * as React from 'react';
+import type { NebaElevation, NebaStyleProps } from '../../types';
+/**
+ * How the hierarchy is drawn.
+ *
+ * - `none` — indentation only. The quietest, and usually right for a navigation
+ *   sidebar, where the tree is two levels deep and the labels say what the
+ *   structure is.
+ * - `simple` — one hairline rail per level, running the full height of the
+ *   group. Enough to follow a column of rows back to the branch it belongs to.
+ * - `folder` — the rail plus an elbow into every row, and the rail under a last
+ *   child stops at that row. The file-manager drawing, and the one to reach for
+ *   when the tree is deep.
+ */
+export type TreeViewLines = 'none' | 'simple' | 'folder';
+/** A row's identity, and what `expanded` and `selected` are lists of. */
+export type TreeViewValue = string | number;
+export interface TreeViewProps extends NebaStyleProps, Omit<React.ComponentPropsWithoutRef<'ul'>, 'color' | 'defaultValue' | 'onSelect'> {
+    /**
+     * Drop shadow depth. `0` (the default) is flat.
+     * @default 0
+     */
+    elevation?: NebaElevation;
+    /**
+     * How the hierarchy is drawn between the rows.
+     * @default 'simple'
+     */
+    lines?: TreeViewLines;
+    /** Which branches are open. Use with `onExpandedChange` for a controlled tree. */
+    expanded?: TreeViewValue[];
+    /** Which start open, for an uncontrolled one. */
+    defaultExpanded?: TreeViewValue[];
+    onExpandedChange?: (expanded: TreeViewValue[]) => void;
+    /**
+     * Which rows are chosen. An array even when only one row may be chosen at a
+     * time — the same shape Accordion's `value` takes, so turning `multiple` on
+     * does not also change the type of the value.
+     */
+    selected?: TreeViewValue[];
+    /** Which start chosen, for an uncontrolled one. */
+    defaultSelected?: TreeViewValue[];
+    onSelectedChange?: (selected: TreeViewValue[]) => void;
+    /**
+     * Whether more than one row may be chosen at a time.
+     * @default false
+     */
+    multiple?: boolean;
+    /** Unavailable. Every row stops answering. */
+    disabled?: boolean;
+    /** The name the tree is announced by. */
+    label?: string;
+    /** The top-level TreeItems. */
+    children?: React.ReactNode;
+}
+export interface TreeItemProps extends Omit<React.ComponentPropsWithoutRef<'li'>, 'color' | 'onClick'> {
+    /**
+     * Identifies the row to `expanded` and `selected`. One is generated when it is
+     * left out, which is fine for a tree nobody drives from code.
+     */
+    value?: TreeViewValue;
+    /**
+     * The row's text. Its own prop rather than `children`, because in a tree the
+     * children are the rows underneath it.
+     */
+    label?: React.ReactNode;
+    /** Content before the label — a folder glyph, a file type, a status dot. */
+    startIcon?: React.ReactNode;
+    /** Content after the label, inside the pressable area — a count, a badge. */
+    endIcon?: React.ReactNode;
+    /**
+     * A control pinned to the end of the row.
+     *
+     * Deliberately outside the pressable area, the same shape ListItem uses: a
+     * row that both opens and holds a menu button has two things to press.
+     */
+    action?: React.ReactNode;
+    /** Renders the row as a link, for a tree that is navigation. */
+    href?: string;
+    /** Fires when the row is pressed, before it opens or is chosen. */
+    onClick?: React.MouseEventHandler<HTMLElement>;
+    /**
+     * Forces the disclosure arrow onto a row with no children yet — the branch
+     * that is fetched the first time it is opened.
+     */
+    expandable?: boolean;
+    /** Unavailable. Its branch, if it is open, keeps working. */
+    disabled?: boolean;
+    /** The rows underneath this one. */
+    children?: React.ReactNode;
+}
+/**
+ * A tree of rows that open and shut.
+ *
+ * There is no Base UI primitive under this: the library has no tree, and the
+ * three things a tree owes — the `tree`/`treeitem`/`group` roles, one tab stop
+ * for the whole widget, and the arrow keys that walk it — are most of the
+ * component.
+ *
+ * The keyboard is handled once, here, rather than on every row. A tree's arrow
+ * keys are questions about the *tree* ("what is the next visible row", "where is
+ * my parent"), and the only element that can answer them is the one holding all
+ * of them. The rows the query returns are in document order, which is reading
+ * order, because a shut branch is unmounted rather than hidden.
+ */
+export declare const TreeView: React.ForwardRefExoticComponent<TreeViewProps & React.RefAttributes<HTMLUListElement>>;
+/**
+ * One row, and everything under it.
+ *
+ * The `<li>` is the `treeitem` and it is what takes focus — not the row drawn
+ * inside it. That is the ARIA pattern, and it is also why the disclosure arrow
+ * is a plain span with a click handler rather than a button: a button inside the
+ * focusable row would be a second tab stop in a widget that is supposed to have
+ * exactly one, and the keyboard already opens a branch with ArrowRight.
+ */
+export declare const TreeItem: React.ForwardRefExoticComponent<TreeItemProps & React.RefAttributes<HTMLLIElement>>;

package/dist/components/tree-view/TreeView.js

@@ -0,0 +1 @@
+import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import*as n from"react";import{ChevronIcon as a}from"../../internal/icons";import{controlTextClasses as l,cx as s,gapClasses as o,hasContent as i,iconClasses as c,radiusClasses as d,surfaceClasses as u,surfaceSlots as m,transitionClasses as f}from"../../internal/styles";const p=n.createContext({size:"md",density:"default",disabled:!1,expandedKeys:new Set,selectedKeys:new Set,activeKey:null,toggle:()=>{},select:()=>{},activate:()=>{},register:()=>()=>{}}),x={solid:[u,"text-(--neba-fg) bg-(--n-panel-hover)","[box-shadow:var(--n-elev),var(--neba-plate-solid)]"].join(" "),outline:[u,"border text-(--neba-fg) bg-(--n-panel)","[border-color:var(--n-line)]","[box-shadow:var(--n-elev),var(--neba-plate-glass)]"].join(" "),text:"text-(--neba-fg) bg-transparent"},g={xs:"0.875rem",sm:"1rem",md:"1.25rem",lg:"1.5rem",xl:"1.75rem"},b={xs:"1.375rem",sm:"1.625rem",md:"2rem",lg:"2.5rem",xl:"3rem"},h={default:{xs:"px-1.5",sm:"px-2",md:"px-2.5",lg:"px-3",xl:"px-3.5"},compact:{xs:"px-1",sm:"px-1",md:"px-1.5",lg:"px-2",xl:"px-2.5"}},v={xs:"rounded-[0.3125rem]",sm:"rounded-[0.375rem]",md:"rounded-[0.5rem]",lg:"rounded-[0.625rem]",xl:"rounded-[0.75rem]"},y={none:"",simple:"neba-tree-simple",folder:"neba-tree-folder"};function w(e){return Array.from(e.querySelectorAll('[role="treeitem"]'))}const k=e=>String(e);export const TreeView=n.forwardRef(function({variant:t="outline",size:r="md",color:a="primary",density:l="default",elevation:o=0,lines:i="simple",expanded:c,defaultExpanded:u,onExpandedChange:h,selected:v,defaultSelected:C,onSelectedChange:N,multiple:S=!1,disabled:K=!1,label:A,className:D,style:R,children:E,onKeyDown:j,...I},P){const[V,z]=n.useState(u??[]),[_,O]=n.useState(C??[]),[J,L]=n.useState(null),M=c??V,T=v??_,q=n.useRef(null),F=n.useCallback(e=>{q.current=e,"function"==typeof P?P(e):P&&(P.current=e)},[P]),H=n.useCallback(e=>{const t=k(e),r=c??V,n=r.some(e=>k(e)===t)?r.filter(e=>k(e)!==t):[...r,e];void 0===c&&z(n),h?.(n)},[c,V,h]),U=n.useCallback(e=>{const t=k(e),r=v??_,n=r.some(e=>k(e)===t),a=S?n?r.filter(e=>k(e)!==t):[...r,e]:[e];void 0===v&&O(a),N?.(a)},[S,v,_,N]),B=n.useRef(new Map),G=n.useCallback((e,t)=>(B.current.set(e,t),()=>{B.current.delete(e)}),[]),Q=JSON.stringify(M.map(k)),W=JSON.stringify(T.map(k)),X=n.useMemo(()=>({size:r,density:l,disabled:K,expandedKeys:new Set(M.map(k)),selectedKeys:new Set(T.map(k)),activeKey:J,toggle:H,select:U,activate:L,register:G}),[r,l,K,Q,W,J,H,U,G]);n.useEffect(()=>{const e=q.current;if(!e)return;const t=w(e);0!==t.length&&(null!==J&&t.some(e=>e.dataset.nebaValue===J)||L(t[0].dataset.nebaValue??null))});const Y=s("flex list-none flex-col p-1",d[r],x[t],f,y[i],D);return e(p.Provider,{value:X,children:e("ul",{ref:F,role:"tree","aria-label":A,"aria-multiselectable":S||void 0,className:Y,style:{...m(a,o),"--n-tree-indent":g[r],"--n-tree-row":b[r],...R},onKeyDown:function(e){if(j?.(e),e.defaultPrevented)return;const t=q.current,r=e.target?.closest?.('[role="treeitem"]');if(!t||!r||!t.contains(r))return;const n=w(t),a=n.indexOf(r);if(-1===a)return;const l=t=>{t&&(e.preventDefault(),L(t.dataset.nebaValue??null),t.focus())},s=e=>{const t=e.dataset.nebaValue;t&&B.current.get(t)?.toggle()},o="rtl"===getComputedStyle(t).direction,i=o?"ArrowLeft":"ArrowRight",c=o?"ArrowRight":"ArrowLeft",d=r.getAttribute("aria-expanded");switch(e.key){case"ArrowDown":l(n[a+1]);break;case"ArrowUp":l(n[a-1]);break;case"Home":l(n[0]);break;case"End":l(n[n.length-1]);break;case i:"false"===d?(e.preventDefault(),s(r)):"true"===d&&l(n[a+1]);break;case c:"true"===d?(e.preventDefault(),s(r)):l(r.parentElement?.closest('[role="treeitem"]'));break;case"Enter":case" ":e.preventDefault(),r.click()}},...I,children:E})})});export const TreeItem=n.forwardRef(function({value:d,label:u,startIcon:m,endIcon:x,action:g,href:b,expandable:y,disabled:w=!1,className:C,children:N,onClick:S,...K},A){const{size:D,density:R,disabled:E,expandedKeys:j,selectedKeys:I,activeKey:P,toggle:V,select:z,activate:_,register:O}=n.useContext(p),J=n.useId(),L=d??J,M=k(L),T=n.useRef(null),q=n.useCallback(e=>{T.current=e,"function"==typeof A?A(e):A&&(A.current=e)},[A]),F=n.Children.toArray(N),H=y??F.length>0,U=H&&j.has(M),B=I.has(M),G=w||E,Q=n.useRef({toggle:()=>{}});Q.current.toggle=()=>{!G&&H&&V(L)},n.useEffect(()=>O(M,Q.current),[M,O]);const W=s("flex min-w-0 flex-1 cursor-pointer items-center text-start","h-(--n-tree-row)",h[R][D],v[D],o[D],l[D],f,c,"group-focus-visible/tree-item:[outline:2px_solid_var(--n-ring)]","group-focus-visible/tree-item:outline-offset-[-2px]",G?"cursor-not-allowed text-(--neba-disabled-fg)":B?"bg-(--n-soft-press) font-medium text-(--n-accent) hover:bg-(--n-soft-press)":"hover:bg-(--n-soft)"),X=r(t,{children:[e("span",{"aria-hidden":"true",onClick:e=>{!G&&H&&(e.stopPropagation(),e.preventDefault(),T.current?.focus(),_(M),V(L))},className:s("flex h-[1lh] w-[1.15em] shrink-0 items-center justify-center","[transition:rotate_var(--neba-duration)_var(--neba-ease)]",H?"text-(--neba-muted-fg)":"",U?"rotate-0":"-rotate-90 rtl:rotate-90"),children:H?e(a,{}):null}),i(m)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:m}):null,e("span",{className:"min-w-0 flex-1 truncate",children:u}),i(x)?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg)",children:x}):null]});return r("li",{ref:q,role:"treeitem","aria-expanded":H?U:void 0,"aria-selected":!!B||void 0,"aria-disabled":G||void 0,"data-neba-value":M,tabIndex:P===M?0:-1,className:s("group/tree-item relative block [outline:none]",C),onClick:function(e){e.stopPropagation(),G?e.preventDefault():(T.current?.focus(),_(M),S?.(e),e.defaultPrevented||(H&&V(L),z(L)))},...K,children:[r("div",{className:"flex w-full items-center",children:[b&&!G?e("a",{href:b,tabIndex:-1,className:W,"aria-current":B?"page":void 0,children:X}):e("div",{className:W,children:X}),i(g)?e("span",{className:s("flex shrink-0 items-center",h[R][D]),onClick:e=>e.stopPropagation(),children:g}):null]}),H&&U&&F.length>0?e("ul",{role:"group",className:"list-none ps-(--n-tree-indent)",children:N}):null]})});

package/dist/components/tree-view/index.d.ts

@@ -0,0 +1,2 @@
+export { TreeItem, TreeView } from './TreeView';
+export type { TreeItemProps, TreeViewLines, TreeViewProps, TreeViewValue } from './TreeView';

package/dist/components/tree-view/index.js

@@ -0,0 +1 @@
+export{TreeItem,TreeView}from"./TreeView";

package/dist/index.d.ts

@@ -1,13 +1,16 @@
 export * from './types';
 export * from './components/accordion';
 export * from './components/alert';
+export * from './components/avatar';
 export * from './components/badge';
 export * from './components/blockquote';
 export * from './components/box';
+export * from './components/breadcrumb';
 export * from './components/button';
 export * from './components/button-group';
 export * from './components/card';
 export * from './components/carousel';
+export * from './components/chat-bubble';
 export * from './components/checkbox';
 export * from './components/chip';
 export * from './components/combobox';
@@ -26,8 +29,10 @@ export * from './components/icon-button';
 export * from './components/list';
 export * from './components/menu';
 export * from './components/number-field';
+export * from './components/otp-field';
 export * from './components/overlay';
 export * from './components/pagination';
+export * from './components/panes';
 export * from './components/pill';
 export * from './components/progress-box';
 export * from './components/progress-circular';
@@ -37,14 +42,17 @@ export * from './components/segmented-button';
 export * from './components/select';
 export * from './components/shortcut';
 export * from './components/slider';
+export * from './components/spoiler';
 export * from './components/statistic';
 export * from './components/switch';
 export * from './components/table';
 export * from './components/tabs';
 export * from './components/text-field';
+export * from './components/text-link';
 export * from './components/time-picker';
 export * from './components/timeline';
 export * from './components/toast';
 export * from './components/toolbar';
 export * from './components/tooltip';
+export * from './components/tree-view';
 export * from './components/typography';

package/dist/index.js

@@ -1 +1 @@
-export*from"./types";export*from"./components/accordion";export*from"./components/alert";export*from"./components/badge";export*from"./components/blockquote";export*from"./components/box";export*from"./components/button";export*from"./components/button-group";export*from"./components/card";export*from"./components/carousel";export*from"./components/checkbox";export*from"./components/chip";export*from"./components/combobox";export*from"./components/container";export*from"./components/date-picker";export*from"./components/date-range-picker";export*from"./components/date-time-picker";export*from"./components/dialog";export*from"./components/divider";export*from"./components/file-picker";export*from"./components/grid";export*from"./components/grid-container";export*from"./components/highlight";export*from"./components/icon";export*from"./components/icon-button";export*from"./components/list";export*from"./components/menu";export*from"./components/number-field";export*from"./components/overlay";export*from"./components/pagination";export*from"./components/pill";export*from"./components/progress-box";export*from"./components/progress-circular";export*from"./components/progress-linear";export*from"./components/radio-group";export*from"./components/segmented-button";export*from"./components/select";export*from"./components/shortcut";export*from"./components/slider";export*from"./components/statistic";export*from"./components/switch";export*from"./components/table";export*from"./components/tabs";export*from"./components/text-field";export*from"./components/time-picker";export*from"./components/timeline";export*from"./components/toast";export*from"./components/toolbar";export*from"./components/tooltip";export*from"./components/typography";
+export*from"./types";export*from"./components/accordion";export*from"./components/alert";export*from"./components/avatar";export*from"./components/badge";export*from"./components/blockquote";export*from"./components/box";export*from"./components/breadcrumb";export*from"./components/button";export*from"./components/button-group";export*from"./components/card";export*from"./components/carousel";export*from"./components/chat-bubble";export*from"./components/checkbox";export*from"./components/chip";export*from"./components/combobox";export*from"./components/container";export*from"./components/date-picker";export*from"./components/date-range-picker";export*from"./components/date-time-picker";export*from"./components/dialog";export*from"./components/divider";export*from"./components/file-picker";export*from"./components/grid";export*from"./components/grid-container";export*from"./components/highlight";export*from"./components/icon";export*from"./components/icon-button";export*from"./components/list";export*from"./components/menu";export*from"./components/number-field";export*from"./components/otp-field";export*from"./components/overlay";export*from"./components/pagination";export*from"./components/panes";export*from"./components/pill";export*from"./components/progress-box";export*from"./components/progress-circular";export*from"./components/progress-linear";export*from"./components/radio-group";export*from"./components/segmented-button";export*from"./components/select";export*from"./components/shortcut";export*from"./components/slider";export*from"./components/spoiler";export*from"./components/statistic";export*from"./components/switch";export*from"./components/table";export*from"./components/tabs";export*from"./components/text-field";export*from"./components/text-link";export*from"./components/time-picker";export*from"./components/timeline";export*from"./components/toast";export*from"./components/toolbar";export*from"./components/tooltip";export*from"./components/tree-view";export*from"./components/typography";

package/dist/internal/i18n.d.ts

@@ -0,0 +1,78 @@
+/**
+ * The words the library says on its own behalf.
+ *
+ * Almost nothing in Neba writes text a reader sees — a Button says whatever it
+ * was handed, a Card's title is the caller's. The exceptions are the strings a
+ * component has to invent because there is nowhere else for them to come from:
+ * the sentence behind a link that opens a new tab, the label on the button that
+ * uncovers a Spoiler, the word under a chat message that says it was read.
+ *
+ * Those are collected here rather than defaulted inside each component, for the
+ * reason every other table in `internal/` exists: they are a set. A product in
+ * Korean does not want eight components each defaulting to English and each
+ * needing its own override prop, and the next component that needs a word —
+ * a picker's "Today", a Pagination's "Next page" — should get it from the same
+ * place rather than starting a second table beside this one.
+ *
+ * What is *not* in here is anything `Intl` already knows. Month names, weekday
+ * names, AM/PM and number formats come from the platform, which speaks more
+ * languages than this file ever will. This is only for the words the platform
+ * has no opinion about.
+ *
+ * Every component that reads this takes a `locale` and an override prop for the
+ * string itself, so an unsupported language is never a dead end: `locale` gets
+ * you a translation for free, and the prop gets you one for anything else.
+ */
+/**
+ * One namespace per component, rather than one flat list of keys.
+ *
+ * A namespace is what makes a partial translation possible: a locale supplies
+ * whatever it has and the rest falls back to English one namespace at a time,
+ * so adding a namespace here does not silently blank the strings in every
+ * language that has not caught up with it yet.
+ */
+export interface NebaMessages {
+    /** TextLink. */
+    link: {
+        /**
+         * What is read out after a link that opens a new tab, and never drawn. A
+         * window changing under the reader is the one thing about a link that is
+         * invisible until it has already happened.
+         */
+        newTab: string;
+    };
+    /** Spoiler. */
+    spoiler: {
+        /** The button that uncovers the content. */
+        reveal: string;
+        /** And the one that covers it again, when the Spoiler is reversible. */
+        hide: string;
+        /** The line above the button, saying why the content is covered. */
+        notice: string;
+    };
+    /** ChatBubble. */
+    chat: {
+        /** The four steps a message goes through, as the mark under it. */
+        sending: string;
+        sent: string;
+        delivered: string;
+        read: string;
+        /** And the fifth, which is not a step: it did not go. */
+        failed: string;
+        /** What the three dots mean. */
+        typing: string;
+    };
+}
+/**
+ * The strings for a locale, merged over English.
+ *
+ * `undefined` is English rather than the runtime's own locale, and that is
+ * deliberate: `navigator.language` differs between the server that renders the
+ * markup and the browser that hydrates it, and text that changes between those
+ * two is a hydration mismatch in the one part of the page a reader is looking
+ * at. A component that should follow the reader is told which language to
+ * follow.
+ */
+export declare function resolveMessages(locale?: string): NebaMessages;
+/** The same, as a hook, for the components that read it during a render. */
+export declare function useMessages(locale?: string): NebaMessages;

package/dist/internal/i18n.js

@@ -0,0 +1 @@
+import*as e from"react";const n={link:{newTab:"(opens in a new tab)"},spoiler:{reveal:"Reveal",hide:"Hide",notice:"This may contain spoilers"},chat:{sending:"Sending",sent:"Sent",delivered:"Delivered",read:"Read",failed:"Not sent",typing:"Typing…"}},i={ko:{link:{newTab:"(새 창에서 열림)"},spoiler:{reveal:"내용 보기",hide:"숨기기",notice:"스포일러가 포함되어 있을 수 있습니다"},chat:{sending:"보내는 중",sent:"보냄",delivered:"전달됨",read:"읽음",failed:"전송 실패",typing:"입력 중…"}},ja:{link:{newTab:"(新しいタブで開きます)"},spoiler:{reveal:"表示する",hide:"隠す",notice:"ネタバレを含む可能性があります"},chat:{sending:"送信中",sent:"送信済み",delivered:"配信済み",read:"既読",failed:"送信できませんでした",typing:"入力中…"}},"zh-hans":{link:{newTab:"(在新标签页中打开)"},spoiler:{reveal:"显示内容",hide:"隐藏",notice:"此内容可能包含剧透"},chat:{sending:"发送中",sent:"已发送",delivered:"已送达",read:"已读",failed:"发送失败",typing:"正在输入…"}},"zh-hant":{link:{newTab:"(在新分頁中開啟)"},spoiler:{reveal:"顯示內容",hide:"隱藏",notice:"此內容可能包含劇透"},chat:{sending:"傳送中",sent:"已傳送",delivered:"已送達",read:"已讀",failed:"傳送失敗",typing:"正在輸入…"}},es:{link:{newTab:"(se abre en una pestaña nueva)"},spoiler:{reveal:"Mostrar",hide:"Ocultar",notice:"Puede contener spoilers"},chat:{sending:"Enviando",sent:"Enviado",delivered:"Entregado",read:"Leído",failed:"No enviado",typing:"Escribiendo…"}},pt:{link:{newTab:"(abre em uma nova aba)"},spoiler:{reveal:"Mostrar",hide:"Ocultar",notice:"Pode conter spoilers"},chat:{sending:"Enviando",sent:"Enviado",delivered:"Entregue",read:"Lido",failed:"Não enviado",typing:"Digitando…"}},fr:{link:{newTab:"(s’ouvre dans un nouvel onglet)"},spoiler:{reveal:"Afficher",hide:"Masquer",notice:"Peut contenir des spoilers"},chat:{sending:"Envoi en cours",sent:"Envoyé",delivered:"Distribué",read:"Lu",failed:"Non envoyé",typing:"En train d’écrire…"}},de:{link:{newTab:"(wird in einem neuen Tab geöffnet)"},spoiler:{reveal:"Anzeigen",hide:"Ausblenden",notice:"Kann Spoiler enthalten"},chat:{sending:"Wird gesendet",sent:"Gesendet",delivered:"Zugestellt",read:"Gelesen",failed:"Nicht gesendet",typing:"Schreibt…"}},it:{link:{newTab:"(si apre in una nuova scheda)"},spoiler:{reveal:"Mostra",hide:"Nascondi",notice:"Può contenere spoiler"},chat:{sending:"Invio in corso",sent:"Inviato",delivered:"Consegnato",read:"Letto",failed:"Non inviato",typing:"Sta scrivendo…"}},nl:{link:{newTab:"(opent in een nieuw tabblad)"},spoiler:{reveal:"Tonen",hide:"Verbergen",notice:"Kan spoilers bevatten"},chat:{sending:"Wordt verzonden",sent:"Verzonden",delivered:"Afgeleverd",read:"Gelezen",failed:"Niet verzonden",typing:"Aan het typen…"}},pl:{link:{newTab:"(otwiera się w nowej karcie)"},spoiler:{reveal:"Pokaż",hide:"Ukryj",notice:"Może zawierać spoilery"},chat:{sending:"Wysyłanie",sent:"Wysłano",delivered:"Dostarczono",read:"Przeczytano",failed:"Nie wysłano",typing:"Pisze…"}},ru:{link:{newTab:"(откроется в новой вкладке)"},spoiler:{reveal:"Показать",hide:"Скрыть",notice:"Может содержать спойлеры"},chat:{sending:"Отправляется",sent:"Отправлено",delivered:"Доставлено",read:"Прочитано",failed:"Не отправлено",typing:"Печатает…"}},tr:{link:{newTab:"(yeni sekmede açılır)"},spoiler:{reveal:"Göster",hide:"Gizle",notice:"Spoiler içerebilir"},chat:{sending:"Gönderiliyor",sent:"Gönderildi",delivered:"İletildi",read:"Okundu",failed:"Gönderilemedi",typing:"Yazıyor…"}},ar:{link:{newTab:"(يفتح في علامة تبويب جديدة)"},spoiler:{reveal:"إظهار",hide:"إخفاء",notice:"قد يحتوي على حرق للأحداث"},chat:{sending:"جارٍ الإرسال",sent:"تم الإرسال",delivered:"تم التسليم",read:"تمت القراءة",failed:"لم يتم الإرسال",typing:"يكتب الآن…"}},hi:{link:{newTab:"(नए टैब में खुलता है)"},spoiler:{reveal:"दिखाएँ",hide:"छिपाएँ",notice:"इसमें स्पॉइलर हो सकते हैं"},chat:{sending:"भेजा जा रहा है",sent:"भेजा गया",delivered:"डिलीवर हुआ",read:"पढ़ा गया",failed:"नहीं भेजा गया",typing:"टाइप कर रहे हैं…"}},id:{link:{newTab:"(terbuka di tab baru)"},spoiler:{reveal:"Tampilkan",hide:"Sembunyikan",notice:"Mungkin mengandung spoiler"},chat:{sending:"Mengirim",sent:"Terkirim",delivered:"Diterima",read:"Dibaca",failed:"Gagal terkirim",typing:"Sedang mengetik…"}},vi:{link:{newTab:"(mở trong tab mới)"},spoiler:{reveal:"Hiện nội dung",hide:"Ẩn",notice:"Có thể chứa nội dung tiết lộ"},chat:{sending:"Đang gửi",sent:"Đã gửi",delivered:"Đã nhận",read:"Đã xem",failed:"Chưa gửi được",typing:"Đang nhập…"}},th:{link:{newTab:"(เปิดในแท็บใหม่)"},spoiler:{reveal:"แสดงเนื้อหา",hide:"ซ่อน",notice:"อาจมีการเปิดเผยเนื้อหา"},chat:{sending:"กำลังส่ง",sent:"ส่งแล้ว",delivered:"ส่งถึงแล้ว",read:"อ่านแล้ว",failed:"ส่งไม่สำเร็จ",typing:"กำลังพิมพ์…"}}},a={zh:"zh-hans","zh-cn":"zh-hans","zh-my":"zh-hans","zh-sg":"zh-hans","zh-hk":"zh-hant","zh-mo":"zh-hant","zh-tw":"zh-hant"};const t=new Map([["",n]]);export function resolveMessages(e){const r=e?.trim()??"",d=t.get(r);if(d)return d;const l=function(e){const n=e.toLowerCase().split(/[-_]/).filter(Boolean),i=n[0];if(!i)return[];const a=n.slice(1),t=a.find(e=>/^[a-z]{4}$/.test(e)),r=a.find(e=>/^([a-z]{2}|\d{3})$/.test(e));return[t?`${i}-${t}`:"",r?`${i}-${r}`:"",i].filter(Boolean)}(r).map(e=>i[e]??i[a[e]??""]).find(Boolean),o=l?{link:{...n.link,...l.link},spoiler:{...n.spoiler,...l.spoiler},chat:{...n.chat,...l.chat}}:n;return t.set(r,o),o}export function useMessages(n){return e.useMemo(()=>resolveMessages(n),[n])}

package/dist/internal/icons.d.ts

@@ -67,6 +67,29 @@ export declare function ClockIcon(): React.JSX.Element;
  * reason the chevron is: it is a glyph, and there is no text in it to resample.
  */
 export declare function ArrowRightIcon(): React.JSX.Element;
+/**
+ * The two marks a link wears.
+ *
+ * A pair for the same reason the steppers are: they answer the same question —
+ * "where does this go" — and a chain drawn at one weight beside an arrow drawn
+ * at another reads as two icon sets in one paragraph. The chain says "this is a
+ * link", the arrow leaving its box says "and it leaves this page", which is the
+ * one thing about a link that is invisible until it has already happened.
+ *
+ * TextLink draws whichever one matches its `newTab`; a ChatBubble's link
+ * preview draws the chain beside the site it points at.
+ */
+export declare function LinkIcon(): React.JSX.Element;
+export declare function ExternalLinkIcon(): React.JSX.Element;
+/**
+ * The three dots that stand for what has been left out.
+ *
+ * Drawn rather than typed: `…` is a single glyph whose dots are spaced by
+ * whatever font the page happens to load, and it sits on the baseline rather
+ * than in the middle of the row it is standing in for. Breadcrumb draws it on
+ * the button that opens the collapsed middle of a trail.
+ */
+export declare function EllipsisIcon(): React.JSX.Element;
 /** The filled dot: the chosen one of a set, where a tick would say "and". */
 export declare function DotIcon(): React.JSX.Element;
 /**

package/dist/internal/icons.js

@@ -1 +1 @@
-import{jsx as r,jsxs as e}from"react/jsx-runtime";export function CloseIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 4.5 7 7m0-7-7 7",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function ChevronIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 6.5 3.5 3.5 3.5-3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function CheckIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m3.5 8.5 3 3 6-6",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})})}export function MinusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function PlusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M8 3.5v9M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function TrendUpIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 11 6.5 7.5 9 10l4-4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 6h3.5v3.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function TrendDownIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 5 6.5 8.5 9 6l4 4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 10h3.5V6.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CalendarIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"2",y:"3.25",width:"12",height:"10.75",rx:"2",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M2 6.75h12",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M5.25 1.75v2.5M10.75 1.75v2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ClockIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 4.5V8l2.4 1.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function ArrowRightIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3 8h10m-3.5-3.5L13 8l-3.5 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function DotIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("circle",{cx:"8",cy:"8",r:"3.25",fill:"currentColor"})})}function o(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 7.25v4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"4.9",r:"0.85",fill:"currentColor"})]})}export const severityIcons={primary:r(o,{}),secondary:r(o,{}),info:r(o,{}),success:e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.25 8.25 1.9 1.9 3.6-3.9",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]}),warning:e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M7.13 2.6 1.9 11.7a1 1 0 0 0 .87 1.5h10.46a1 1 0 0 0 .87-1.5L8.87 2.6a1 1 0 0 0-1.74 0Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),r("path",{d:"M8 6.1v3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"11.2",r:"0.85",fill:"currentColor"})]}),danger:e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.9 5.9 4.2 4.2m0-4.2-4.2 4.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})};
+import{jsx as r,jsxs as e}from"react/jsx-runtime";export function CloseIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 4.5 7 7m0-7-7 7",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function ChevronIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 6.5 3.5 3.5 3.5-3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function CheckIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m3.5 8.5 3 3 6-6",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})})}export function MinusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function PlusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M8 3.5v9M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function TrendUpIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 11 6.5 7.5 9 10l4-4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 6h3.5v3.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function TrendDownIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 5 6.5 8.5 9 6l4 4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 10h3.5V6.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CalendarIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"2",y:"3.25",width:"12",height:"10.75",rx:"2",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M2 6.75h12",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M5.25 1.75v2.5M10.75 1.75v2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ClockIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 4.5V8l2.4 1.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function ArrowRightIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3 8h10m-3.5-3.5L13 8l-3.5 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function LinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M6.5 9.5a2.75 2.75 0 0 0 4 .25l1.75-1.75a2.75 2.75 0 0 0-3.9-3.9L7.75 5.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 6.5a2.75 2.75 0 0 0-4-.25L3.75 8a2.75 2.75 0 0 0 3.9 3.9l.6-.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ExternalLinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M12.75 9.25v2.5a1.5 1.5 0 0 1-1.5 1.5h-7a1.5 1.5 0 0 1-1.5-1.5v-7a1.5 1.5 0 0 1 1.5-1.5h2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 2.75h3.75V6.5M7.25 8.75l5.75-5.75",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function EllipsisIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"3.5",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"8",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"12.5",cy:"8",r:"1.15",fill:"currentColor"})]})}export function DotIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("circle",{cx:"8",cy:"8",r:"3.25",fill:"currentColor"})})}function o(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 7.25v4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"4.9",r:"0.85",fill:"currentColor"})]})}export const severityIcons={primary:r(o,{}),secondary:r(o,{}),info:r(o,{}),success:e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.25 8.25 1.9 1.9 3.6-3.9",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]}),warning:e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M7.13 2.6 1.9 11.7a1 1 0 0 0 .87 1.5h10.46a1 1 0 0 0 .87-1.5L8.87 2.6a1 1 0 0 0-1.74 0Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),r("path",{d:"M8 6.1v3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"11.2",r:"0.85",fill:"currentColor"})]}),danger:e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.9 5.9 4.2 4.2m0-4.2-4.2 4.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})};