@imfusion/web-ui 0.11.1-dev.6.gf4b6c627 → 0.11.1-dev.62.gfcd31b6e

package/dist/components/progress/progress.meta.d.ts

@@ -0,0 +1,2 @@
+import { ComponentMeta } from '../../types/meta';
+export declare const progressMeta: ComponentMeta;

package/dist/components/rich-link/rich-link.d.ts

@@ -2,7 +2,7 @@ import { IconComponent } from '../icon';
 type Props = React.ComponentProps<"a"> & {
     /** Leading icon from `@imfusion/web-ui/icons`, shown on a tile in the primary color. */
     glyph?: IconComponent;
-    /** Second line under the label. When set, the label turns bold. */
+    /** Second line under the label. */
     description?: React.ReactNode;
     /** Link target scope. `"external"` (default) opens in a new tab with a diagonal `ArrowUpRight` icon; `"internal"` stays in the current tab with a horizontal `ArrowRight` icon. */
     kind?: "external" | "internal";

package/dist/components/select/select.cva.d.ts

@@ -0,0 +1,7 @@
+/** Popup, list, and item styles, shared with primitives that open the same list (Combobox, Autocomplete). */
+export declare const selectPopup: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+export declare const selectList: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+export declare const selectItem: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+export declare const selectItemIndicator: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+export declare const selectItemText: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+export declare const selectItemDescription: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;

package/dist/components/select/select.d.ts

@@ -2,7 +2,7 @@ import { Select as SelectPrimitive } from '@base-ui/react/select';
 import { VariantProps } from 'class-variance-authority';
 type UpstreamItem = React.ComponentProps<typeof SelectPrimitive.Item>;
 declare const selectRoot: (props?: ({
-    width?: "auto" | "full" | "wide" | null | undefined;
+    width?: "auto" | "wide" | "full" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 interface RootProps<Value = unknown, Multiple extends boolean | undefined = false> extends React.ComponentProps<typeof SelectPrimitive.Root<Value, Multiple>> {
     /** Trigger width: `auto` keeps the compact minimum; `wide` raises it; `full` fills the parent. @default "auto" */

package/dist/components/tab-nav/index.d.ts

@@ -0,0 +1,2 @@
+export * as TabNav from './tab-nav';
+export { tabNavMeta } from './tab-nav.meta';

package/dist/components/tab-nav/tab-nav.d.ts

@@ -0,0 +1,26 @@
+import { useRender } from '@base-ui/react/use-render';
+interface RootProps extends React.ComponentProps<"nav"> {
+    /** Names the navigation for screen readers, such as "Project". */
+    "aria-label": string;
+}
+/**
+ * TabNav.Root — a `<nav>` of links that draws the hairline under its items. Give it an `aria-label` that names the
+ * navigation, such as "Project".
+ * Not based on any upstream component.
+ */
+export declare function Root(props: RootProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Root {
+    var displayName: string;
+}
+type ItemProps = useRender.ComponentProps<"a"> & {
+    /** Marks the item as the page the user is on: sets `aria-current="page"` and `data-current`, and draws the bar. */
+    current?: boolean;
+};
+/**
+ * TabNav.Item — a link in the row. Renders an `<a>`; pass a router link as `render` to navigate without a page load.
+ */
+export declare function Item({ current, render, ...props }: ItemProps): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
+export declare namespace Item {
+    var displayName: string;
+}
+export {};

package/dist/components/tab-nav/tab-nav.meta.d.ts

@@ -0,0 +1,2 @@
+import { ComponentMeta } from '../../types/meta';
+export declare const tabNavMeta: ComponentMeta;

package/dist/components/table/table.d.ts

@@ -46,6 +46,14 @@ export declare function RowLink({ render, ...props }: useRender.ComponentProps<"
 export declare namespace RowLink {
     var displayName: string;
 }
+/**
+ * Table.RowButton — a `<button>` that stands for its whole row, such as one that opens a drawer. Use it when the row acts
+ * instead of navigating; a link that goes to a page is a `Table.RowLink`.
+ */
+export declare function RowButton({ render, type, ...props }: useRender.ComponentProps<"button">): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
+export declare namespace RowButton {
+    var displayName: string;
+}
 /**
  * Table.HeaderButton — inline action button for header cells. Generic by
  * design: sorting toggles, filter toggles, column menus all render through it

package/dist/components/tabs/tabs-underline.cva.d.ts

@@ -0,0 +1,6 @@
+/**
+ * The underline look shared by `Tabs` (appearance `"underline"`) and `TabNav`, which renders it on links. Keeping it here
+ * avoids cross-component imports between the two.
+ */
+export declare const tabsUnderlineRule: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+export declare const tabsUnderlineItem: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;

package/dist/components/tabs/tabs.d.ts

@@ -2,18 +2,27 @@ import { Tabs as TabsPrimitive } from '@base-ui/react/tabs';
 import { VariantProps } from 'class-variance-authority';
 declare const tabsList: (props?: ({
     fill?: boolean | null | undefined;
+    appearance?: "underline" | "boxed" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
+type TabsAppearance = "boxed" | "underline";
+interface RootProps extends React.ComponentProps<typeof TabsPrimitive.Root> {
+    /**
+     * `"boxed"` outlines the active tab in a box that fuses into a framed panel. `"underline"` marks it with a bar under
+     * its label on a hairline rule, with an unframed panel. Underline is horizontal only: a vertical Tabs stays boxed.
+     */
+    appearance?: TabsAppearance;
+}
 /**
  * Tabs.Root — container that manages the active tab value and orientation context.
  *
  * @see https://base-ui.com/react/components/tabs
  * @llm https://base-ui.com/react/components/tabs.md
  */
-export declare function Root(props: React.ComponentProps<typeof TabsPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+export declare function Root({ appearance, ...props }: RootProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace Root {
     var displayName: string;
 }
-interface ListProps extends React.ComponentProps<typeof TabsPrimitive.List>, VariantProps<typeof tabsList> {
+interface ListProps extends React.ComponentProps<typeof TabsPrimitive.List>, Pick<VariantProps<typeof tabsList>, "fill"> {
     /**
      * Give every tab an equal share of the list's length (equal width when
      * horizontal). When vertical, this only takes effect if the list is stretched
@@ -32,7 +41,7 @@ export declare namespace Tab {
     var displayName: string;
 }
 /**
- * Tabs.Indicator — the bordered box marking the active tab, positioned via
+ * Tabs.Indicator — the bordered box (boxed) or bar (underline) marking the active tab, positioned via
  * the `--active-tab-*` CSS custom properties Base UI writes onto it. Render
  * once per Tabs.List, after the Tabs.Tab list.
  */
@@ -43,7 +52,7 @@ export declare namespace Indicator {
 /**
  * Tabs.PanelViewport — the shared frame Tabs.Panel elements render inside.
  * No Base UI equivalent exists; it's surfaced as a named part since its
- * hairline border is what Tabs.Indicator visually fuses into.
+ * hairline border is what the boxed Tabs.Indicator visually fuses into. The underline appearance draws no frame.
  */
 export declare function PanelViewport(props: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
 export declare namespace PanelViewport {

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

@@ -0,0 +1,2 @@
+export { Textarea } from './textarea';
+export { textareaMeta } from './textarea.meta';

package/dist/components/textarea/textarea.d.ts

@@ -0,0 +1,32 @@
+import { Input as InputPrimitive } from '@base-ui/react/input';
+import { VariantProps } from 'class-variance-authority';
+declare const textarea: (props?: ({
+    variant?: "outline" | "ghost" | "filled" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+    resize?: "none" | "both" | "horizontal" | "vertical" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+type UpstreamInput = React.ComponentProps<typeof InputPrimitive>;
+interface Props extends Omit<React.ComponentProps<"textarea">, "className" | "style" | "value" | "defaultValue">, Pick<UpstreamInput, "value" | "defaultValue" | "onValueChange" | "render">, VariantProps<typeof textarea> {
+    /** Number of visible text lines. */
+    rows?: number;
+    /**
+     * Which directions the user can drag to resize. `horizontal` and `both` size the textarea from `cols` and shrink-wrap
+     * the root, so the width follows the drag; `none` hides the resize corner.
+     */
+    resize?: "vertical" | "horizontal" | "both" | "none";
+    /** Class of the root wrapper that lays the field out. */
+    className?: string;
+    /** Style of the root wrapper that lays the field out. */
+    style?: React.CSSProperties;
+}
+/**
+ * Multi-line text input. Also called a text area; use Input for a single line.
+ * Wraps Base UI Input rendered as a textarea for controlled/uncontrolled state, form integration,
+ * and Field context awareness (valid/invalid/dirty/touched/filled/focused). `className` and `style`
+ * go to the root wrapper; every other prop goes to the textarea.
+ *
+ * @see https://base-ui.com/react/components/input
+ * @llm https://base-ui.com/react/components/input.md
+ */
+export declare function Textarea({ variant, size, rows, resize, render, className, style, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/textarea/textarea.meta.d.ts

@@ -0,0 +1,2 @@
+import { ComponentMeta } from '../../types/meta';
+export declare const textareaMeta: ComponentMeta;

package/dist/components/toast/toast.d.ts

@@ -2,10 +2,10 @@ import { Toast as ToastPrimitive } from '@base-ui/react/toast';
 import { VariantProps } from 'class-variance-authority';
 declare const toastViewport: (props?: ({
     position?: "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right" | null | undefined;
-    width?: "default" | "content" | "compact" | "wide" | null | undefined;
+    width?: "default" | "content" | "wide" | "compact" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 declare const toastRoot: (props?: ({
-    variant?: "warning" | "info" | "neutral" | "success" | "error" | null | undefined;
+    variant?: "warning" | "info" | "error" | "neutral" | "success" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 /**
  * Toast.useToastManager — reads the queue and the add/close/update/promise

package/dist/components/typo/typo.d.ts

@@ -9,6 +9,10 @@ type WeightProps = {
     /** Font weight. Omit to keep the member's default; `medium` firms up short body text on cards. */
     weight?: "regular" | "medium" | "strong";
 };
+type MarkerProps = {
+    /** Colour of the dash. Omit to follow the text colour. */
+    markerVariant?: TypoProps["variant"];
+};
 type HeadingProps = useRender.ComponentProps<"h1"> & TypoProps;
 type LongHeadingProps = HeadingProps & {
     /** Whether lines after the first use a translucent text color. */
@@ -99,7 +103,7 @@ export declare namespace OrderedList {
     var displayName: string;
 }
 /** Typo.UnorderedList — bulleted list. */
-export declare function UnorderedList({ variant, weight, render, ...props }: useRender.ComponentProps<"ul"> & TypoProps & WeightProps): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
+export declare function UnorderedList({ variant, markerVariant, weight, render, ...props }: useRender.ComponentProps<"ul"> & TypoProps & WeightProps & MarkerProps): import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>>;
 export declare namespace UnorderedList {
     var displayName: string;
 }

package/dist/docgen/component-sources.d.ts

@@ -4,4 +4,8 @@ export type ComponentSource = {
     componentFile: string;
     metaFile: string;
 };
+/**
+ * A component folder is public when the package index exports it; an unexported folder is internal.
+ * Integrations ship through their own entry points and are always public.
+ */
 export declare function publicComponentSources(srcDir: string): ComponentSource[];

package/dist/icon-button-roSB497o.js

@@ -0,0 +1,171 @@
+import { _M as e } from "./icons-vc1WZCxX.js";
+import { t } from "./meta-V_KyLeGn.js";
+import { a as n, r } from "./toggle-group-eGr6_hgQ.js";
+import { a as i } from "./utils-J6vbjIt1.js";
+import { Button as a } from "@base-ui/react/button";
+import { cva as o } from "class-variance-authority";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+var l = {
+	chamfer: "imf-ui-button-module-chamfer",
+	contextOncolor: "imf-ui-button-module-contextOncolor",
+	endIcon: "imf-ui-button-module-endIcon",
+	justifySpread: "imf-ui-button-module-justifySpread",
+	label: "imf-ui-button-module-label",
+	radiusLg: "imf-ui-button-module-radiusLg",
+	radiusMd: "imf-ui-button-module-radiusMd",
+	radiusRound: "imf-ui-button-module-radiusRound",
+	radiusSm: "imf-ui-button-module-radiusSm",
+	root: "imf-ui-button-module-root",
+	shortcut: "imf-ui-button-module-shortcut",
+	sizeHero: "imf-ui-button-module-sizeHero",
+	sizeLg: "imf-ui-button-module-sizeLg",
+	sizeMd: "imf-ui-button-module-sizeMd",
+	sizeSm: "imf-ui-button-module-sizeSm",
+	startIcon: "imf-ui-button-module-startIcon",
+	variantGhost: "imf-ui-button-module-variantGhost",
+	variantNegative: "imf-ui-button-module-variantNegative",
+	variantOutline: "imf-ui-button-module-variantOutline",
+	variantPositive: "imf-ui-button-module-variantPositive",
+	variantPrimary: "imf-ui-button-module-variantPrimary",
+	variantSecondary: "imf-ui-button-module-variantSecondary"
+}, u = o(l.root, { variants: {
+	variant: {
+		primary: l.variantPrimary,
+		secondary: l.variantSecondary,
+		positive: l.variantPositive,
+		negative: l.variantNegative,
+		outline: l.variantOutline,
+		ghost: l.variantGhost
+	},
+	size: {
+		sm: l.sizeSm,
+		md: l.sizeMd,
+		lg: l.sizeLg,
+		hero: l.sizeHero
+	},
+	chamfer: {
+		false: null,
+		true: l.chamfer
+	},
+	radius: {
+		none: null,
+		sm: l.radiusSm,
+		md: l.radiusMd,
+		lg: l.radiusLg,
+		round: l.radiusRound
+	},
+	context: {
+		default: null,
+		oncolor: l.contextOncolor
+	},
+	justify: {
+		center: null,
+		spread: l.justifySpread
+	}
+} });
+function d({ variant: e = "primary", size: t = "md", context: o = "default", chamfer: d = t === "hero", radius: f = "none", justify: p = "center", startIcon: m, endIcon: h, shortcut: g, children: _, ...v }) {
+	return /* @__PURE__ */ c(a, {
+		"aria-keyshortcuts": g ? r(g) : void 0,
+		...v,
+		"data-imf-ui-component": "Button",
+		className: (n) => u({
+			variant: e,
+			size: t,
+			chamfer: d,
+			radius: f,
+			context: o,
+			justify: p,
+			className: i(v.className, n)
+		}),
+		children: [
+			m != null && /* @__PURE__ */ s("span", {
+				className: l.startIcon,
+				"aria-hidden": !0,
+				children: m
+			}),
+			/* @__PURE__ */ s("span", {
+				className: l.label,
+				children: _
+			}),
+			h != null && /* @__PURE__ */ s("span", {
+				className: l.endIcon,
+				"aria-hidden": !0,
+				children: h
+			}),
+			g && /* @__PURE__ */ s(n, {
+				variant: "flat",
+				className: l.shortcut,
+				"aria-hidden": !0,
+				children: g
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/button/button.meta.ts
+var f = {
+	name: "Button",
+	category: t.buttons,
+	status: "stable",
+	description: "Triggers an action such as submit, confirm, cancel, navigate, or delete. Also called a CTA or action button; variants and sizes communicate its importance.",
+	origin: "adapted",
+	internalDependencies: ["Kbd"],
+	upstream: {
+		name: "Base UI",
+		websiteLink: "https://base-ui.com/",
+		docLink: "https://base-ui.com/react/components/button",
+		llmDocLink: "https://base-ui.com/react/components/button.md"
+	}
+}, p = {
+	root: "imf-ui-icon-button-module-root",
+	sizeHero: "imf-ui-icon-button-module-sizeHero",
+	sizeLg: "imf-ui-icon-button-module-sizeLg",
+	sizeMd: "imf-ui-icon-button-module-sizeMd",
+	sizeSm: "imf-ui-icon-button-module-sizeSm"
+}, m = o(p.root, { variants: { size: {
+	sm: p.sizeSm,
+	md: p.sizeMd,
+	lg: p.sizeLg,
+	hero: p.sizeHero
+} } }), h = {
+	sm: 15,
+	md: 18,
+	lg: 20,
+	hero: 24
+}, g = {
+	sm: "md",
+	md: "lg",
+	lg: "hero",
+	hero: "hero"
+};
+function _({ glyph: t, label: n, iconProps: r, size: a = "md", ...o }) {
+	let c = a ?? "md", l = o.shortcut ? g[c] : c;
+	return /* @__PURE__ */ s(d, {
+		...o,
+		size: c,
+		"aria-label": n,
+		className: (e) => m({
+			size: l,
+			className: i(o.className, e)
+		}),
+		children: /* @__PURE__ */ s(e, {
+			size: h[c],
+			...r,
+			glyph: t,
+			"aria-hidden": !0
+		})
+	});
+}
+_.displayName = "IconButton";
+//#endregion
+//#region src/components/icon-button/icon-button.meta.ts
+var v = {
+	name: "IconButton",
+	category: t.buttons,
+	status: "experimental",
+	description: "Square button that shows a single icon and no visible text, with its accessible name from `label`. Also called an icon-only or toolbar button. Use Button with `startIcon` or `endIcon` when a text label is visible.",
+	origin: "native",
+	internalDependencies: ["Button", "Icon"]
+};
+//#endregion
+export { d as i, _ as n, f as r, v as t };

package/dist/index.d.ts

@@ -3,15 +3,20 @@ export { ChipLink, chipLinkMeta } from './components/chip-link';
 export { CopyButton, copyButtonMeta } from './components/copy-button';
 export { IconButton, iconButtonMeta } from './components/icon-button';
 export { RichLink, richLinkMeta } from './components/rich-link';
+export { Autocomplete, autocompleteMeta } from './components/autocomplete';
 export { Checkbox, checkboxMeta } from './components/checkbox';
 export { ColorSchemeToggle, colorSchemeToggleMeta } from './components/color-scheme-toggle';
+export { Combobox, comboboxMeta } from './components/combobox';
 export { Field, fieldMeta } from './components/field';
 export { Fieldset, fieldsetMeta } from './components/fieldset';
+export { FileDropZone, fileDropZoneMeta } from './components/file-drop-zone';
+export type { FileDropZoneItem, FileDropZoneUploadItem } from './components/file-drop-zone';
 export { Input, inputMeta } from './components/input';
 export { NumberField, numberFieldMeta } from './components/number-field';
 export { Select, selectMeta } from './components/select';
 export { Slider, sliderMeta } from './components/slider';
 export { Switch, switchMeta } from './components/switch';
+export { Textarea, textareaMeta } from './components/textarea';
 export { Toggle, toggleMeta } from './components/toggle';
 export { ToggleGroup, toggleGroupMeta } from './components/toggle-group';
 export { AppShell, appShellMeta } from './components/app-shell';
@@ -31,13 +36,16 @@ export { Chip, chipMeta } from './components/chip';
 export { Code, codeMeta } from './components/code';
 export { Collapsible, collapsibleMeta } from './components/collapsible';
 export { Icon, iconMeta } from './components/icon';
+export { Image, imageMeta } from './components/image';
 export { Kbd, kbdMeta } from './components/kbd';
 export { Logo, logoMeta } from './components/logo';
 export { Meter, meterMeta } from './components/meter';
 export { NavigationMenu, navigationMenuMeta } from './components/navigation-menu';
+export { Progress, progressMeta } from './components/progress';
 export { Skeleton, skeletonMeta } from './components/skeleton';
 export { Spinner, spinnerMeta } from './components/spinner';
 export { Table, tableMeta } from './components/table';
+export { TabNav, tabNavMeta } from './components/tab-nav';
 export { Tabs, tabsMeta } from './components/tabs';
 export { Toast, toastMeta } from './components/toast';
 export { Tooltip, tooltipMeta } from './components/tooltip';
@@ -50,6 +58,7 @@ export { minWidth } from './breakpoints';
 export type { BreakpointName } from './breakpoints';
 export { cva, cx } from 'class-variance-authority';
 export { initialsFromEmail, splitEmail } from './utils/email';
+export { initialsFromName } from './utils/initials';
 export { withBreakHints } from './utils/break-hints';
 export { config } from './config';
 export type { ColorScheme, ColorSchemePreference } from './types/theme';