@bergetai/ui 0.14.2 → 0.16.0

package/dist/components/model-card/ModelCard.cjs

@@ -0,0 +1,108 @@
+"use client";
+const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
+const require_utils = require("../../lib/utils.cjs");
+const require_Typography = require("../typography/Typography.cjs");
+const require_Card = require("../card/Card.cjs");
+const require_ModelLogo = require("../model-logo/ModelLogo.cjs");
+let react = require("react");
+react = require_runtime.__toESM(react, 1);
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/components/model-card/ModelCard.tsx
+const lifecycleLabels = {
+	preview: "Preview",
+	active: "Active",
+	deprecated: "Deprecated"
+};
+/** Per-status styling for the lifecycle tab (tint classes come from
+* index.css; deprecated uses the granite neutral). Brightens when the
+* card (`group`) is hovered. */
+const lifecycleStyles = {
+	preview: "berget-tint berget-tint-warning",
+	active: "berget-tint berget-tint-success",
+	deprecated: "bg-berget-brand-granite-700 text-berget-muted-foreground"
+};
+const ModelCard = react.forwardRef(({ icon, provider, category, eyebrow, title, lifecycle, description, columns, meta, href, external, className, children, ...props }, ref) => {
+	const titleId = react.useId();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
+		ref,
+		href,
+		"aria-labelledby": titleId,
+		...external ? {
+			target: "_blank",
+			rel: "noopener noreferrer"
+		} : {},
+		className: require_utils.cn("group block", className),
+		...props,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Card.Card, {
+			variant: "filled",
+			className: "relative flex h-full flex-col bg-berget-card-filled-bg p-5 transition-all hover:bg-[color-mix(in_oklab,var(--berget-brand-granite-100)_5%,var(--berget-card-filled-bg))] sm:p-6",
+			children: [
+				lifecycle && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "absolute top-0 right-0 z-10 overflow-hidden rounded-bl-berget-sm",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: require_utils.cn("inline-flex h-6 items-center whitespace-nowrap border-0! px-8 text-sm", lifecycleStyles[lifecycle]),
+						children: lifecycleLabels[lifecycle]
+					})
+				}),
+				(icon || provider || category) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "flex h-12 w-12 shrink-0 items-center justify-center rounded-berget-xs border border-berget-border bg-white/5 text-berget-foreground",
+					children: icon ?? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ModelLogo.ModelLogo, {
+						provider,
+						category
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", { children: [
+					eyebrow && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+						variant: "xs",
+						color: "muted",
+						className: "font-medium uppercase leading-none tracking-[0.25em]",
+						children: eyebrow
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: require_utils.cn("flex items-baseline gap-3", lifecycle && "pr-24"),
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+							as: "h3",
+							id: titleId,
+							variant: "h5",
+							className: "min-w-0 truncate whitespace-nowrap leading-tight",
+							style: { fontFeatureSettings: "normal" },
+							children: title
+						})
+					}),
+					description && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+						variant: "xs",
+						color: "muted",
+						className: "leading-none",
+						children: description
+					})
+				] }),
+				columns && columns.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "grid grid-cols-2",
+					children: columns.map((col, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+						variant: "xs",
+						color: "muted",
+						className: "leading-none",
+						children: col.label
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+						variant: "body",
+						className: "tabular-nums leading-none",
+						style: { fontFeatureSettings: "normal" },
+						children: col.value
+					})] }, i))
+				}),
+				meta && meta.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+					variant: "xs",
+					color: "muted",
+					className: "text-[0.65rem] uppercase tracking-[0.15em]",
+					children: meta.map((item, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [i > 0 && " ▪ ", item] }, i))
+				}),
+				children
+			]
+		})
+	});
+});
+ModelCard.displayName = "ModelCard";
+//#endregion
+exports.ModelCard = ModelCard;
+
+//# sourceMappingURL=ModelCard.cjs.map

package/dist/components/model-card/ModelCard.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModelCard.cjs","names":["React","cn","Card","ModelLogo","Typography"],"sources":["../../../src/components/model-card/ModelCard.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { cn } from '../../lib/utils';\nimport { Card } from '../card';\nimport { type ModelCategory, type ModelLogoProvider, ModelLogo } from '../model-logo';\nimport { Typography } from '../typography';\n\n/**\n * ModelCard — a whole-card link tile for presenting AI models in a grid:\n * provider mark, category eyebrow, model name, optional lifecycle tab,\n * per-unit price columns, and fine-print capability facts.\n *\n * Presentational only: all copy is passed in as props; the card itself\n * owns no strings and no domain types.\n */\n/** Lifecycle status shown as a corner tab on the card. */\nexport type ModelLifecycle = 'preview' | 'active' | 'deprecated';\n\nconst lifecycleLabels: Record<ModelLifecycle, string> = {\n  preview: 'Preview',\n  active: 'Active',\n  deprecated: 'Deprecated',\n};\n\n/** Per-status styling for the lifecycle tab (tint classes come from\n * index.css; deprecated uses the granite neutral). Brightens when the\n * card (`group`) is hovered. */\nconst lifecycleStyles: Record<ModelLifecycle, string> = {\n  preview: 'berget-tint berget-tint-warning',\n  active: 'berget-tint berget-tint-success',\n  deprecated: 'bg-berget-brand-granite-700 text-berget-muted-foreground',\n};\n\nexport type { ModelCategory, ModelLogoProvider };\n\nexport interface ModelCardProps extends Omit<React.ComponentProps<'a'>, 'title' | 'children'> {\n  /** Provider mark, rendered in a bordered square at the top of the card. */\n  icon?: React.ReactNode;\n  /**\n   * Model family for the icon square — resolved to a bundled brand mark\n   * (e.g. `'mistralai'`, `'moonshotai'`, `'berget'`). Ignored when `icon`\n   * is set.\n   */\n  provider?: string;\n  /** Fallback category for the icon square when no brand mark exists\n   * (maps to the `model_type` values from `GET /v1/models`). */\n  category?: ModelCategory;\n  /** Small category label above the title (rendered uppercase). */\n  eyebrow?: string;\n  /** The model name — rendered as an `h3` and truncated when too long. */\n  title: React.ReactNode;\n  /**\n   * Lifecycle status rendered as a corner tab: `preview` (yellow),\n   * `active` (green), `deprecated` (gray).\n   */\n  lifecycle?: ModelLifecycle;\n  /** Secondary line under the title, e.g. the provider name. */\n  description?: React.ReactNode;\n  /** Label-above-value columns, e.g. per-million-token input/output prices. */\n  columns?: { label: React.ReactNode; value: React.ReactNode }[];\n  /**\n   * Fine-print capability facts rendered in one uppercase row with\n   * square separators drawn by the card, e.g. ['Vision', '262K context'].\n   */\n  meta?: React.ReactNode[];\n  /** Link target for the whole card. */\n  href: string;\n  /** Opens the link in a new tab (adds `target`/`rel`). */\n  external?: boolean;\n  /** Extra content rendered at the bottom of the card. */\n  children?: React.ReactNode;\n}\n\nconst ModelCard = React.forwardRef<HTMLAnchorElement, ModelCardProps>(\n  (\n    {\n      icon,\n      provider,\n      category,\n      eyebrow,\n      title,\n      lifecycle,\n      description,\n      columns,\n      meta,\n      href,\n      external,\n      className,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const titleId = React.useId();\n\n    return (\n      <a\n        ref={ref}\n        href={href}\n        aria-labelledby={titleId}\n        {...(external ? { target: '_blank', rel: 'noopener noreferrer' } : {})}\n        className={cn('group block', className)}\n        {...props}\n      >\n        <Card\n          variant=\"filled\"\n          className=\"relative flex h-full flex-col bg-berget-card-filled-bg p-5 transition-all hover:bg-[color-mix(in_oklab,var(--berget-brand-granite-100)_5%,var(--berget-card-filled-bg))] sm:p-6\"\n        >\n          {lifecycle && (\n            <div className=\"absolute top-0 right-0 z-10 overflow-hidden rounded-bl-berget-sm\">\n              <div\n                className={cn(\n                  'inline-flex h-6 items-center whitespace-nowrap border-0! px-8 text-sm',\n                  lifecycleStyles[lifecycle],\n                )}\n              >\n                {lifecycleLabels[lifecycle]}\n              </div>\n            </div>\n          )}\n          {(icon || provider || category) && (\n            <div className=\"flex h-12 w-12 shrink-0 items-center justify-center rounded-berget-xs border border-berget-border bg-white/5 text-berget-foreground\">\n              {icon ?? <ModelLogo provider={provider} category={category} />}\n            </div>\n          )}\n\n          {/* Identity cluster: eyebrow, title, description — cb tightly\n              grouped; the card's flex gap separates it from other groups. */}\n          <header>\n            {eyebrow && (\n              <Typography\n                variant=\"xs\"\n                color=\"muted\"\n                className=\"font-medium uppercase leading-none tracking-[0.25em]\"\n              >\n                {eyebrow}\n              </Typography>\n            )}\n            <div className={cn('flex items-baseline gap-3', lifecycle && 'pr-24')}>\n              <Typography\n                as=\"h3\"\n                id={titleId}\n                variant=\"h5\"\n                className=\"min-w-0 truncate whitespace-nowrap leading-tight\"\n                style={{ fontFeatureSettings: 'normal' }}\n              >\n                {title}\n              </Typography>\n            </div>\n            {description && (\n              <Typography variant=\"xs\" color=\"muted\" className=\"leading-none\">\n                {description}\n              </Typography>\n            )}\n          </header>\n\n          {columns && columns.length > 0 && (\n            <div className=\"grid grid-cols-2\">\n              {columns.map((col, i) => (\n                <div key={i}>\n                  <Typography variant=\"xs\" color=\"muted\" className=\"leading-none\">\n                    {col.label}\n                  </Typography>\n                  <Typography\n                    variant=\"body\"\n                    className=\"tabular-nums leading-none\"\n                    style={{ fontFeatureSettings: 'normal' }}\n                  >\n                    {col.value}\n                  </Typography>\n                </div>\n              ))}\n            </div>\n          )}\n\n          {meta && meta.length > 0 && (\n            <Typography\n              variant=\"xs\"\n              color=\"muted\"\n              className=\"text-[0.65rem] uppercase tracking-[0.15em]\"\n            >\n              {meta.map((item, i) => (\n                <React.Fragment key={i}>\n                  {i > 0 && ' ▪ '}\n                  {item}\n                </React.Fragment>\n              ))}\n            </Typography>\n          )}\n\n          {children}\n        </Card>\n      </a>\n    );\n  },\n);\nModelCard.displayName = 'ModelCard';\n\nexport { ModelCard };\n"],"mappings":";;;;;;;;;;AAmBA,MAAM,kBAAkD;CACtD,SAAS;CACT,QAAQ;CACR,YAAY;AACd;;;;AAKA,MAAM,kBAAkD;CACtD,SAAS;CACT,QAAQ;CACR,YAAY;AACd;AA0CA,MAAM,YAAYA,MAAM,YAEpB,EACE,MACA,UACA,UACA,SACA,OACA,WACA,aACA,SACA,MACA,MACA,UACA,WACA,UACA,GAAG,SAEL,QACG;CACH,MAAM,UAAUA,MAAM,MAAM;CAE5B,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;EACO;EACC;EACN,mBAAiB;EACjB,GAAK,WAAW;GAAE,QAAQ;GAAU,KAAK;EAAsB,IAAI,CAAC;EACpE,WAAWC,cAAAA,GAAG,eAAe,SAAS;EACtC,GAAI;EAEJ,UAAA,iBAAA,GAAA,kBAAA,KAAA,CAACC,aAAAA,MAAD;GACE,SAAQ;GACR,WAAU;GAFZ,UAAA;IAIG,aACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;KAAK,WAAU;KACb,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;MACE,WAAWD,cAAAA,GACT,yEACA,gBAAgB,UAClB;MAEC,UAAA,gBAAgB;KACd,CAAA;IACF,CAAA;KAEL,QAAQ,YAAY,aACpB,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;KAAK,WAAU;KACZ,UAAA,QAAQ,iBAAA,GAAA,kBAAA,IAAA,CAACE,kBAAAA,WAAD;MAAqB;MAAoB;KAAW,CAAA;IAC1D,CAAA;IAKP,iBAAA,GAAA,kBAAA,KAAA,CAAC,UAAD,EAAA,UAAA;KACG,WACC,iBAAA,GAAA,kBAAA,IAAA,CAACC,mBAAAA,YAAD;MACE,SAAQ;MACR,OAAM;MACN,WAAU;MAET,UAAA;KACS,CAAA;KAEd,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;MAAK,WAAWH,cAAAA,GAAG,6BAA6B,aAAa,OAAO;MAClE,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACG,mBAAAA,YAAD;OACE,IAAG;OACH,IAAI;OACJ,SAAQ;OACR,WAAU;OACV,OAAO,EAAE,qBAAqB,SAAS;OAEtC,UAAA;MACS,CAAA;KACT,CAAA;KACJ,eACC,iBAAA,GAAA,kBAAA,IAAA,CAACA,mBAAAA,YAAD;MAAY,SAAQ;MAAK,OAAM;MAAQ,WAAU;MAC9C,UAAA;KACS,CAAA;IAER,EAAA,CAAA;IAEP,WAAW,QAAQ,SAAS,KAC3B,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;KAAK,WAAU;KACZ,UAAA,QAAQ,KAAK,KAAK,MACjB,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,mBAAAA,YAAD;MAAY,SAAQ;MAAK,OAAM;MAAQ,WAAU;MAC9C,UAAA,IAAI;KACK,CAAA,GACZ,iBAAA,GAAA,kBAAA,IAAA,CAACA,mBAAAA,YAAD;MACE,SAAQ;MACR,WAAU;MACV,OAAO,EAAE,qBAAqB,SAAS;MAEtC,UAAA,IAAI;KACK,CAAA,CACT,EAAA,GAXK,CAWL,CACN;IACE,CAAA;IAGN,QAAQ,KAAK,SAAS,KACrB,iBAAA,GAAA,kBAAA,IAAA,CAACA,mBAAAA,YAAD;KACE,SAAQ;KACR,OAAM;KACN,WAAU;KAET,UAAA,KAAK,KAAK,MAAM,MACf,iBAAA,GAAA,kBAAA,KAAA,CAACJ,MAAM,UAAP,EAAA,UAAA,CACG,IAAI,KAAK,OACT,IACa,EAAA,GAHK,CAGL,CACjB;IACS,CAAA;IAGb;GACG;;CACL,CAAA;AAEP,CACF;AACA,UAAU,cAAc"}

package/dist/components/model-card/ModelCard.d.cts

@@ -0,0 +1,58 @@
+import { ModelCategory, ModelLogoProvider } from "../model-logo/ModelLogo.cjs";
+import "../model-logo/index.cjs";
+import * as React from "react";
+//#region src/components/model-card/ModelCard.d.ts
+/**
+ * ModelCard — a whole-card link tile for presenting AI models in a grid:
+ * provider mark, category eyebrow, model name, optional lifecycle tab,
+ * per-unit price columns, and fine-print capability facts.
+ *
+ * Presentational only: all copy is passed in as props; the card itself
+ * owns no strings and no domain types.
+ */
+/** Lifecycle status shown as a corner tab on the card. */
+export type ModelLifecycle = 'preview' | 'active' | 'deprecated';
+export interface ModelCardProps extends Omit<React.ComponentProps<'a'>, 'title' | 'children'> {
+  /** Provider mark, rendered in a bordered square at the top of the card. */
+  icon?: React.ReactNode;
+  /**
+   * Model family for the icon square — resolved to a bundled brand mark
+   * (e.g. `'mistralai'`, `'moonshotai'`, `'berget'`). Ignored when `icon`
+   * is set.
+   */
+  provider?: string;
+  /** Fallback category for the icon square when no brand mark exists
+   * (maps to the `model_type` values from `GET /v1/models`). */
+  category?: ModelCategory;
+  /** Small category label above the title (rendered uppercase). */
+  eyebrow?: string;
+  /** The model name — rendered as an `h3` and truncated when too long. */
+  title: React.ReactNode;
+  /**
+   * Lifecycle status rendered as a corner tab: `preview` (yellow),
+   * `active` (green), `deprecated` (gray).
+   */
+  lifecycle?: ModelLifecycle;
+  /** Secondary line under the title, e.g. the provider name. */
+  description?: React.ReactNode;
+  /** Label-above-value columns, e.g. per-million-token input/output prices. */
+  columns?: {
+    label: React.ReactNode;
+    value: React.ReactNode;
+  }[];
+  /**
+   * Fine-print capability facts rendered in one uppercase row with
+   * square separators drawn by the card, e.g. ['Vision', '262K context'].
+   */
+  meta?: React.ReactNode[];
+  /** Link target for the whole card. */
+  href: string;
+  /** Opens the link in a new tab (adds `target`/`rel`). */
+  external?: boolean;
+  /** Extra content rendered at the bottom of the card. */
+  children?: React.ReactNode;
+}
+declare const ModelCard: React.ForwardRefExoticComponent<Omit<ModelCardProps, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
+//#endregion
+export { ModelCard, type ModelCategory, type ModelLogoProvider };
+//# sourceMappingURL=ModelCard.d.cts.map

package/dist/components/model-card/ModelCard.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModelCard.d.cts","names":[],"sources":["../../../src/components/model-card/ModelCard.tsx"],"mappings":";;;;;;;;;;;;;YAiBY;iBAmBK,uBAAuB,KAAK,MAAM;;EAEjD,OAAO,MAAM;;;;;;EAMb;;;EAGA,WAAW;;EAEX;;EAEA,OAAO,MAAM;;;;;EAKb,YAAY;;EAEZ,cAAc,MAAM;;EAEpB;IAAY,OAAO,MAAM;IAAW,OAAO,MAAM;;;;;;EAKjD,OAAO,MAAM;;EAEb;;EAEA;;EAEA,WAAW,MAAM;;cAGb,WAAS,MAAA,0BAAA,KAAA,yBAAA,MAAA,cAAA"}

package/dist/components/model-card/ModelCard.d.mts

@@ -0,0 +1,58 @@
+import { ModelCategory, ModelLogoProvider } from "../model-logo/ModelLogo.mjs";
+import "../model-logo/index.mjs";
+import * as React from "react";
+//#region src/components/model-card/ModelCard.d.ts
+/**
+ * ModelCard — a whole-card link tile for presenting AI models in a grid:
+ * provider mark, category eyebrow, model name, optional lifecycle tab,
+ * per-unit price columns, and fine-print capability facts.
+ *
+ * Presentational only: all copy is passed in as props; the card itself
+ * owns no strings and no domain types.
+ */
+/** Lifecycle status shown as a corner tab on the card. */
+export type ModelLifecycle = 'preview' | 'active' | 'deprecated';
+export interface ModelCardProps extends Omit<React.ComponentProps<'a'>, 'title' | 'children'> {
+  /** Provider mark, rendered in a bordered square at the top of the card. */
+  icon?: React.ReactNode;
+  /**
+   * Model family for the icon square — resolved to a bundled brand mark
+   * (e.g. `'mistralai'`, `'moonshotai'`, `'berget'`). Ignored when `icon`
+   * is set.
+   */
+  provider?: string;
+  /** Fallback category for the icon square when no brand mark exists
+   * (maps to the `model_type` values from `GET /v1/models`). */
+  category?: ModelCategory;
+  /** Small category label above the title (rendered uppercase). */
+  eyebrow?: string;
+  /** The model name — rendered as an `h3` and truncated when too long. */
+  title: React.ReactNode;
+  /**
+   * Lifecycle status rendered as a corner tab: `preview` (yellow),
+   * `active` (green), `deprecated` (gray).
+   */
+  lifecycle?: ModelLifecycle;
+  /** Secondary line under the title, e.g. the provider name. */
+  description?: React.ReactNode;
+  /** Label-above-value columns, e.g. per-million-token input/output prices. */
+  columns?: {
+    label: React.ReactNode;
+    value: React.ReactNode;
+  }[];
+  /**
+   * Fine-print capability facts rendered in one uppercase row with
+   * square separators drawn by the card, e.g. ['Vision', '262K context'].
+   */
+  meta?: React.ReactNode[];
+  /** Link target for the whole card. */
+  href: string;
+  /** Opens the link in a new tab (adds `target`/`rel`). */
+  external?: boolean;
+  /** Extra content rendered at the bottom of the card. */
+  children?: React.ReactNode;
+}
+declare const ModelCard: React.ForwardRefExoticComponent<Omit<ModelCardProps, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
+//#endregion
+export { ModelCard, type ModelCategory, type ModelLogoProvider };
+//# sourceMappingURL=ModelCard.d.mts.map

package/dist/components/model-card/ModelCard.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModelCard.d.mts","names":[],"sources":["../../../src/components/model-card/ModelCard.tsx"],"mappings":";;;;;;;;;;;;;YAiBY;iBAmBK,uBAAuB,KAAK,MAAM;;EAEjD,OAAO,MAAM;;;;;;EAMb;;;EAGA,WAAW;;EAEX;;EAEA,OAAO,MAAM;;;;;EAKb,YAAY;;EAEZ,cAAc,MAAM;;EAEpB;IAAY,OAAO,MAAM;IAAW,OAAO,MAAM;;;;;;EAKjD,OAAO,MAAM;;EAEb;;EAEA;;EAEA,WAAW,MAAM;;cAGb,WAAS,MAAA,0BAAA,KAAA,yBAAA,MAAA,cAAA"}

package/dist/components/model-card/ModelCard.mjs

@@ -0,0 +1,106 @@
+"use client";
+import { cn } from "../../lib/utils.mjs";
+import { Typography } from "../typography/Typography.mjs";
+import { Card } from "../card/Card.mjs";
+import { ModelLogo } from "../model-logo/ModelLogo.mjs";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/model-card/ModelCard.tsx
+const lifecycleLabels = {
+	preview: "Preview",
+	active: "Active",
+	deprecated: "Deprecated"
+};
+/** Per-status styling for the lifecycle tab (tint classes come from
+* index.css; deprecated uses the granite neutral). Brightens when the
+* card (`group`) is hovered. */
+const lifecycleStyles = {
+	preview: "berget-tint berget-tint-warning",
+	active: "berget-tint berget-tint-success",
+	deprecated: "bg-berget-brand-granite-700 text-berget-muted-foreground"
+};
+const ModelCard = React.forwardRef(({ icon, provider, category, eyebrow, title, lifecycle, description, columns, meta, href, external, className, children, ...props }, ref) => {
+	const titleId = React.useId();
+	return /* @__PURE__ */ jsx("a", {
+		ref,
+		href,
+		"aria-labelledby": titleId,
+		...external ? {
+			target: "_blank",
+			rel: "noopener noreferrer"
+		} : {},
+		className: cn("group block", className),
+		...props,
+		children: /* @__PURE__ */ jsxs(Card, {
+			variant: "filled",
+			className: "relative flex h-full flex-col bg-berget-card-filled-bg p-5 transition-all hover:bg-[color-mix(in_oklab,var(--berget-brand-granite-100)_5%,var(--berget-card-filled-bg))] sm:p-6",
+			children: [
+				lifecycle && /* @__PURE__ */ jsx("div", {
+					className: "absolute top-0 right-0 z-10 overflow-hidden rounded-bl-berget-sm",
+					children: /* @__PURE__ */ jsx("div", {
+						className: cn("inline-flex h-6 items-center whitespace-nowrap border-0! px-8 text-sm", lifecycleStyles[lifecycle]),
+						children: lifecycleLabels[lifecycle]
+					})
+				}),
+				(icon || provider || category) && /* @__PURE__ */ jsx("div", {
+					className: "flex h-12 w-12 shrink-0 items-center justify-center rounded-berget-xs border border-berget-border bg-white/5 text-berget-foreground",
+					children: icon ?? /* @__PURE__ */ jsx(ModelLogo, {
+						provider,
+						category
+					})
+				}),
+				/* @__PURE__ */ jsxs("header", { children: [
+					eyebrow && /* @__PURE__ */ jsx(Typography, {
+						variant: "xs",
+						color: "muted",
+						className: "font-medium uppercase leading-none tracking-[0.25em]",
+						children: eyebrow
+					}),
+					/* @__PURE__ */ jsx("div", {
+						className: cn("flex items-baseline gap-3", lifecycle && "pr-24"),
+						children: /* @__PURE__ */ jsx(Typography, {
+							as: "h3",
+							id: titleId,
+							variant: "h5",
+							className: "min-w-0 truncate whitespace-nowrap leading-tight",
+							style: { fontFeatureSettings: "normal" },
+							children: title
+						})
+					}),
+					description && /* @__PURE__ */ jsx(Typography, {
+						variant: "xs",
+						color: "muted",
+						className: "leading-none",
+						children: description
+					})
+				] }),
+				columns && columns.length > 0 && /* @__PURE__ */ jsx("div", {
+					className: "grid grid-cols-2",
+					children: columns.map((col, i) => /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx(Typography, {
+						variant: "xs",
+						color: "muted",
+						className: "leading-none",
+						children: col.label
+					}), /* @__PURE__ */ jsx(Typography, {
+						variant: "body",
+						className: "tabular-nums leading-none",
+						style: { fontFeatureSettings: "normal" },
+						children: col.value
+					})] }, i))
+				}),
+				meta && meta.length > 0 && /* @__PURE__ */ jsx(Typography, {
+					variant: "xs",
+					color: "muted",
+					className: "text-[0.65rem] uppercase tracking-[0.15em]",
+					children: meta.map((item, i) => /* @__PURE__ */ jsxs(React.Fragment, { children: [i > 0 && " ▪ ", item] }, i))
+				}),
+				children
+			]
+		})
+	});
+});
+ModelCard.displayName = "ModelCard";
+//#endregion
+export { ModelCard };
+
+//# sourceMappingURL=ModelCard.mjs.map

package/dist/components/model-card/ModelCard.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModelCard.mjs","names":[],"sources":["../../../src/components/model-card/ModelCard.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { cn } from '../../lib/utils';\nimport { Card } from '../card';\nimport { type ModelCategory, type ModelLogoProvider, ModelLogo } from '../model-logo';\nimport { Typography } from '../typography';\n\n/**\n * ModelCard — a whole-card link tile for presenting AI models in a grid:\n * provider mark, category eyebrow, model name, optional lifecycle tab,\n * per-unit price columns, and fine-print capability facts.\n *\n * Presentational only: all copy is passed in as props; the card itself\n * owns no strings and no domain types.\n */\n/** Lifecycle status shown as a corner tab on the card. */\nexport type ModelLifecycle = 'preview' | 'active' | 'deprecated';\n\nconst lifecycleLabels: Record<ModelLifecycle, string> = {\n  preview: 'Preview',\n  active: 'Active',\n  deprecated: 'Deprecated',\n};\n\n/** Per-status styling for the lifecycle tab (tint classes come from\n * index.css; deprecated uses the granite neutral). Brightens when the\n * card (`group`) is hovered. */\nconst lifecycleStyles: Record<ModelLifecycle, string> = {\n  preview: 'berget-tint berget-tint-warning',\n  active: 'berget-tint berget-tint-success',\n  deprecated: 'bg-berget-brand-granite-700 text-berget-muted-foreground',\n};\n\nexport type { ModelCategory, ModelLogoProvider };\n\nexport interface ModelCardProps extends Omit<React.ComponentProps<'a'>, 'title' | 'children'> {\n  /** Provider mark, rendered in a bordered square at the top of the card. */\n  icon?: React.ReactNode;\n  /**\n   * Model family for the icon square — resolved to a bundled brand mark\n   * (e.g. `'mistralai'`, `'moonshotai'`, `'berget'`). Ignored when `icon`\n   * is set.\n   */\n  provider?: string;\n  /** Fallback category for the icon square when no brand mark exists\n   * (maps to the `model_type` values from `GET /v1/models`). */\n  category?: ModelCategory;\n  /** Small category label above the title (rendered uppercase). */\n  eyebrow?: string;\n  /** The model name — rendered as an `h3` and truncated when too long. */\n  title: React.ReactNode;\n  /**\n   * Lifecycle status rendered as a corner tab: `preview` (yellow),\n   * `active` (green), `deprecated` (gray).\n   */\n  lifecycle?: ModelLifecycle;\n  /** Secondary line under the title, e.g. the provider name. */\n  description?: React.ReactNode;\n  /** Label-above-value columns, e.g. per-million-token input/output prices. */\n  columns?: { label: React.ReactNode; value: React.ReactNode }[];\n  /**\n   * Fine-print capability facts rendered in one uppercase row with\n   * square separators drawn by the card, e.g. ['Vision', '262K context'].\n   */\n  meta?: React.ReactNode[];\n  /** Link target for the whole card. */\n  href: string;\n  /** Opens the link in a new tab (adds `target`/`rel`). */\n  external?: boolean;\n  /** Extra content rendered at the bottom of the card. */\n  children?: React.ReactNode;\n}\n\nconst ModelCard = React.forwardRef<HTMLAnchorElement, ModelCardProps>(\n  (\n    {\n      icon,\n      provider,\n      category,\n      eyebrow,\n      title,\n      lifecycle,\n      description,\n      columns,\n      meta,\n      href,\n      external,\n      className,\n      children,\n      ...props\n    },\n    ref,\n  ) => {\n    const titleId = React.useId();\n\n    return (\n      <a\n        ref={ref}\n        href={href}\n        aria-labelledby={titleId}\n        {...(external ? { target: '_blank', rel: 'noopener noreferrer' } : {})}\n        className={cn('group block', className)}\n        {...props}\n      >\n        <Card\n          variant=\"filled\"\n          className=\"relative flex h-full flex-col bg-berget-card-filled-bg p-5 transition-all hover:bg-[color-mix(in_oklab,var(--berget-brand-granite-100)_5%,var(--berget-card-filled-bg))] sm:p-6\"\n        >\n          {lifecycle && (\n            <div className=\"absolute top-0 right-0 z-10 overflow-hidden rounded-bl-berget-sm\">\n              <div\n                className={cn(\n                  'inline-flex h-6 items-center whitespace-nowrap border-0! px-8 text-sm',\n                  lifecycleStyles[lifecycle],\n                )}\n              >\n                {lifecycleLabels[lifecycle]}\n              </div>\n            </div>\n          )}\n          {(icon || provider || category) && (\n            <div className=\"flex h-12 w-12 shrink-0 items-center justify-center rounded-berget-xs border border-berget-border bg-white/5 text-berget-foreground\">\n              {icon ?? <ModelLogo provider={provider} category={category} />}\n            </div>\n          )}\n\n          {/* Identity cluster: eyebrow, title, description — cb tightly\n              grouped; the card's flex gap separates it from other groups. */}\n          <header>\n            {eyebrow && (\n              <Typography\n                variant=\"xs\"\n                color=\"muted\"\n                className=\"font-medium uppercase leading-none tracking-[0.25em]\"\n              >\n                {eyebrow}\n              </Typography>\n            )}\n            <div className={cn('flex items-baseline gap-3', lifecycle && 'pr-24')}>\n              <Typography\n                as=\"h3\"\n                id={titleId}\n                variant=\"h5\"\n                className=\"min-w-0 truncate whitespace-nowrap leading-tight\"\n                style={{ fontFeatureSettings: 'normal' }}\n              >\n                {title}\n              </Typography>\n            </div>\n            {description && (\n              <Typography variant=\"xs\" color=\"muted\" className=\"leading-none\">\n                {description}\n              </Typography>\n            )}\n          </header>\n\n          {columns && columns.length > 0 && (\n            <div className=\"grid grid-cols-2\">\n              {columns.map((col, i) => (\n                <div key={i}>\n                  <Typography variant=\"xs\" color=\"muted\" className=\"leading-none\">\n                    {col.label}\n                  </Typography>\n                  <Typography\n                    variant=\"body\"\n                    className=\"tabular-nums leading-none\"\n                    style={{ fontFeatureSettings: 'normal' }}\n                  >\n                    {col.value}\n                  </Typography>\n                </div>\n              ))}\n            </div>\n          )}\n\n          {meta && meta.length > 0 && (\n            <Typography\n              variant=\"xs\"\n              color=\"muted\"\n              className=\"text-[0.65rem] uppercase tracking-[0.15em]\"\n            >\n              {meta.map((item, i) => (\n                <React.Fragment key={i}>\n                  {i > 0 && ' ▪ '}\n                  {item}\n                </React.Fragment>\n              ))}\n            </Typography>\n          )}\n\n          {children}\n        </Card>\n      </a>\n    );\n  },\n);\nModelCard.displayName = 'ModelCard';\n\nexport { ModelCard };\n"],"mappings":";;;;;;;;AAmBA,MAAM,kBAAkD;CACtD,SAAS;CACT,QAAQ;CACR,YAAY;AACd;;;;AAKA,MAAM,kBAAkD;CACtD,SAAS;CACT,QAAQ;CACR,YAAY;AACd;AA0CA,MAAM,YAAY,MAAM,YAEpB,EACE,MACA,UACA,UACA,SACA,OACA,WACA,aACA,SACA,MACA,MACA,UACA,WACA,UACA,GAAG,SAEL,QACG;CACH,MAAM,UAAU,MAAM,MAAM;CAE5B,OACE,oBAAC,KAAD;EACO;EACC;EACN,mBAAiB;EACjB,GAAK,WAAW;GAAE,QAAQ;GAAU,KAAK;EAAsB,IAAI,CAAC;EACpE,WAAW,GAAG,eAAe,SAAS;EACtC,GAAI;EAEJ,UAAA,qBAAC,MAAD;GACE,SAAQ;GACR,WAAU;GAFZ,UAAA;IAIG,aACC,oBAAC,OAAD;KAAK,WAAU;KACb,UAAA,oBAAC,OAAD;MACE,WAAW,GACT,yEACA,gBAAgB,UAClB;MAEC,UAAA,gBAAgB;KACd,CAAA;IACF,CAAA;KAEL,QAAQ,YAAY,aACpB,oBAAC,OAAD;KAAK,WAAU;KACZ,UAAA,QAAQ,oBAAC,WAAD;MAAqB;MAAoB;KAAW,CAAA;IAC1D,CAAA;IAKP,qBAAC,UAAD,EAAA,UAAA;KACG,WACC,oBAAC,YAAD;MACE,SAAQ;MACR,OAAM;MACN,WAAU;MAET,UAAA;KACS,CAAA;KAEd,oBAAC,OAAD;MAAK,WAAW,GAAG,6BAA6B,aAAa,OAAO;MAClE,UAAA,oBAAC,YAAD;OACE,IAAG;OACH,IAAI;OACJ,SAAQ;OACR,WAAU;OACV,OAAO,EAAE,qBAAqB,SAAS;OAEtC,UAAA;MACS,CAAA;KACT,CAAA;KACJ,eACC,oBAAC,YAAD;MAAY,SAAQ;MAAK,OAAM;MAAQ,WAAU;MAC9C,UAAA;KACS,CAAA;IAER,EAAA,CAAA;IAEP,WAAW,QAAQ,SAAS,KAC3B,oBAAC,OAAD;KAAK,WAAU;KACZ,UAAA,QAAQ,KAAK,KAAK,MACjB,qBAAC,OAAD,EAAA,UAAA,CACE,oBAAC,YAAD;MAAY,SAAQ;MAAK,OAAM;MAAQ,WAAU;MAC9C,UAAA,IAAI;KACK,CAAA,GACZ,oBAAC,YAAD;MACE,SAAQ;MACR,WAAU;MACV,OAAO,EAAE,qBAAqB,SAAS;MAEtC,UAAA,IAAI;KACK,CAAA,CACT,EAAA,GAXK,CAWL,CACN;IACE,CAAA;IAGN,QAAQ,KAAK,SAAS,KACrB,oBAAC,YAAD;KACE,SAAQ;KACR,OAAM;KACN,WAAU;KAET,UAAA,KAAK,KAAK,MAAM,MACf,qBAAC,MAAM,UAAP,EAAA,UAAA,CACG,IAAI,KAAK,OACT,IACa,EAAA,GAHK,CAGL,CACjB;IACS,CAAA;IAGb;GACG;;CACL,CAAA;AAEP,CACF;AACA,UAAU,cAAc"}

package/dist/components/model-card/index.d.cts

@@ -0,0 +1,3 @@
+import { ModelCategory, ModelLogoProvider } from "../model-logo/ModelLogo.cjs";
+import { ModelCard, ModelCardProps, ModelLifecycle } from "./ModelCard.cjs";
+export { ModelCard, type ModelCardProps, type ModelCategory, type ModelLifecycle, type ModelLogoProvider };

package/dist/components/model-card/index.d.mts

@@ -0,0 +1,3 @@
+import { ModelCategory, ModelLogoProvider } from "../model-logo/ModelLogo.mjs";
+import { ModelCard, ModelCardProps, ModelLifecycle } from "./ModelCard.mjs";
+export { ModelCard, type ModelCardProps, type ModelCategory, type ModelLifecycle, type ModelLogoProvider };

package/dist/components/model-logo/ModelLogo.cjs

@@ -0,0 +1,98 @@
+"use client";
+const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
+const require_utils = require("../../lib/utils.cjs");
+const require_BergetLogo = require("../berget-logo/BergetLogo.cjs");
+let react = require("react");
+react = require_runtime.__toESM(react, 1);
+let react_jsx_runtime = require("react/jsx-runtime");
+let lucide_react = require("lucide-react");
+//#region src/components/model-logo/ModelLogo.tsx
+/** Accepted aliases, e.g. the raw `owned_by` strings from the models API. */
+const providerAliases = {
+	qwen: "qwen",
+	mistralai: "mistral",
+	mistral: "mistral",
+	moonshotai: "kimi",
+	kimi: "kimi",
+	google: "google",
+	"zai-org": "zai",
+	zai: "zai",
+	berget: "berget",
+	bergetai: "berget"
+};
+/** Monochrome, `currentColor`, 24×24 brand marks (via @lobehub/icons, MIT). */
+const providerPaths = {
+	qwen: ["M12.604 1.34c.393.69.784 1.382 1.174 2.075a.18.18 0 00.157.091h5.552c.174 0 .322.11.446.327l1.454 2.57c.19.337.24.478.024.837-.26.43-.513.864-.76 1.3l-.367.658c-.106.196-.223.28-.04.512l2.652 4.637c.172.301.111.494-.043.77-.437.785-.882 1.564-1.335 2.34-.159.272-.352.375-.68.37-.777-.016-1.552-.01-2.327.016a.099.099 0 00-.081.05 575.097 575.097 0 01-2.705 4.74c-.169.293-.38.363-.725.364-.997.003-2.002.004-3.017.002a.537.537 0 01-.465-.271l-1.335-2.323a.09.09 0 00-.083-.049H4.982c-.285.03-.553-.001-.805-.092l-1.603-2.77a.543.543 0 01-.002-.54l1.207-2.12a.198.198 0 000-.197 550.951 550.951 0 01-1.875-3.272l-.79-1.395c-.16-.31-.173-.496.095-.965.465-.813.927-1.625 1.387-2.436.132-.234.304-.334.584-.335a338.3 338.3 0 012.589-.001.124.124 0 00.107-.063l2.806-4.895a.488.488 0 01.422-.246c.524-.001 1.053 0 1.583-.006L11.704 1c.341-.003.724.032.9.34zm-3.432.403a.06.06 0 00-.052.03L6.254 6.788a.157.157 0 01-.135.078H3.253c-.056 0-.07.025-.041.074l5.81 10.156c.025.042.013.062-.034.063l-2.795.015a.218.218 0 00-.2.116l-1.32 2.31c-.044.078-.021.118.068.118l5.716.008c.046 0 .08.02.104.061l1.403 2.454c.046.081.092.082.139 0l5.006-8.76.783-1.382a.055.055 0 01.096 0l1.424 2.53a.122.122 0 00.107.062l2.763-.02a.04.04 0 00.035-.02.041.041 0 000-.04l-2.9-5.086a.108.108 0 010-.113l.293-.507 1.12-1.977c.024-.041.012-.062-.035-.062H9.2c-.059 0-.073-.026-.043-.077l1.434-2.505a.107.107 0 000-.114L9.225 1.774a.06.06 0 00-.053-.031zm6.29 8.02c.046 0 .058.02.034.06l-.832 1.465-2.613 4.585a.056.056 0 01-.05.029.058.058 0 01-.05-.029L8.498 9.841c-.02-.034-.01-.052.028-.054l.216-.012 6.722-.012z"],
+	mistral: ["M3.428 3.4h3.429v3.428h3.429v3.429h-.002 3.431V6.828h3.427V3.4h3.43v13.714H24v3.429H13.714v-3.428h-3.428v-3.429h-3.43v3.428h3.43v3.429H0v-3.429h3.428V3.4zm10.286 13.715h3.428v-3.429h-3.427v3.429z"],
+	kimi: ["M21.846 0a1.923 1.923 0 110 3.846H20.15a.226.226 0 01-.227-.226V1.923C19.923.861 20.784 0 21.846 0z", "M11.065 11.199l7.257-7.2c.137-.136.06-.41-.116-.41H14.3a.164.164 0 00-.117.051l-7.82 7.756c-.122.12-.302.013-.302-.179V3.82c0-.127-.083-.23-.185-.23H3.186c-.103 0-.186.103-.186.23V19.77c0 .128.083.23.186.23h2.69c.103 0 .186-.102.186-.23v-3.25c0-.069.025-.135.069-.178l2.424-2.406a.158.158 0 01.205-.023l6.484 4.772a7.677 7.677 0 003.453 1.283c.108.012.2-.095.2-.23v-3.06c0-.117-.07-.212-.164-.227a5.028 5.028 0 01-2.027-.807l-5.613-4.064c-.117-.078-.132-.279-.028-.381z"],
+	google: [
+		"M23 12.245c0-.905-.075-1.565-.236-2.25h-10.54v4.083h6.186c-.124 1.014-.797 2.542-2.294 3.569l-.021.136 3.332 2.53.23.022C21.779 18.417 23 15.593 23 12.245z",
+		"M12.225 23c3.03 0 5.574-.978 7.433-2.665l-3.542-2.688c-.948.648-2.22 1.1-3.891 1.1a6.745 6.745 0 01-6.386-4.572l-.132.011-3.465 2.628-.045.124C4.043 20.531 7.835 23 12.225 23z",
+		"M5.84 14.175A6.65 6.65 0 015.463 12c0-.758.138-1.491.361-2.175l-.006-.147-3.508-2.67-.115.054A10.831 10.831 0 001 12c0 1.772.436 3.447 1.197 4.938l3.642-2.763z",
+		"M12.225 5.253c2.108 0 3.529.892 4.34 1.638l3.167-3.031C17.787 2.088 15.255 1 12.225 1 7.834 1 4.043 3.469 2.197 7.062l3.63 2.763a6.77 6.77 0 016.398-4.572z"
+	],
+	zai: ["M12.105 2L9.927 4.953H.653L2.83 2h9.276zM23.254 19.048L21.078 22h-9.242l2.174-2.952h9.244zM24 2L9.264 22H0L14.736 2H24z"]
+};
+const providerLabels = {
+	qwen: "Qwen",
+	mistral: "Mistral",
+	kimi: "Kimi",
+	google: "Google",
+	zai: "Z.ai",
+	berget: "Berget AI"
+};
+const categoryIcons = {
+	text: lucide_react.Bot,
+	"speech-to-text": lucide_react.AudioLines,
+	embedding: lucide_react.Braces,
+	rerank: lucide_react.ArrowDownWideNarrow,
+	"system-one": lucide_react.ScanEye,
+	vision: lucide_react.Eye
+};
+const categoryLabels = {
+	text: "Model",
+	"speech-to-text": "Speech-to-text",
+	embedding: "Embedding",
+	rerank: "Reranker",
+	"system-one": "System One",
+	vision: "Vision"
+};
+/**
+* ModelLogo — brand mark for a supported model family, falling back to a
+* category icon for everything else. Renders nothing if no `provider` and
+* no `category` match.
+*/
+const ModelLogo = react.forwardRef(({ provider, category, size = 24, className, ...props }, ref) => {
+	const resolved = provider ? providerAliases[provider.trim().toLowerCase()] : void 0;
+	if (resolved === "berget") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_BergetLogo.BergetLogo, {
+		variant: "symbol",
+		size,
+		className: require_utils.cn("shrink-0", className)
+	});
+	if (resolved) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		ref,
+		viewBox: "0 0 24 24",
+		fill: "currentColor",
+		width: size,
+		height: size,
+		role: "img",
+		"aria-label": providerLabels[resolved],
+		className: require_utils.cn("shrink-0", className),
+		...props,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("title", { children: providerLabels[resolved] }), providerPaths[resolved].map((d, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d }, i))]
+	});
+	if (category) {
+		const Icon = categoryIcons[category];
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+			className: require_utils.cn("shrink-0", className),
+			...props
+		});
+	}
+	return null;
+});
+ModelLogo.displayName = "ModelLogo";
+//#endregion
+exports.ModelLogo = ModelLogo;
+exports.categoryLabels = categoryLabels;
+
+//# sourceMappingURL=ModelLogo.cjs.map

package/dist/components/model-logo/ModelLogo.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModelLogo.cjs","names":["Bot","AudioLines","Braces","ArrowDownWideNarrow","ScanEye","Eye","React","BergetLogo","cn"],"sources":["../../../src/components/model-logo/ModelLogo.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ArrowDownWideNarrow, AudioLines, Bot, Braces, Eye, ScanEye } from 'lucide-react';\nimport { cn } from '../../lib/utils';\nimport { BergetLogo } from '../berget-logo';\n\n/**\n * Model families with a bundled brand mark, keyed by the `owned_by` values\n * returned by `GET /v1/models` (normalized: lowercase, aliases below).\n */\nexport type ModelLogoProvider = 'qwen' | 'mistral' | 'kimi' | 'google' | 'zai' | 'berget';\n\n/** Fallback model categories for models without a brand mark, matching\n * the `model_type` values in `GET /v1/models` (plus `vision`, which lives\n * in per-model capabilities). */\nexport type ModelCategory =\n  | 'text'\n  | 'speech-to-text'\n  | 'embedding'\n  | 'rerank'\n  | 'system-one'\n  | 'vision';\n\n/** Accepted aliases, e.g. the raw `owned_by` strings from the models API. */\nconst providerAliases: Record<string, ModelLogoProvider> = {\n  qwen: 'qwen',\n  mistralai: 'mistral',\n  mistral: 'mistral',\n  moonshotai: 'kimi',\n  kimi: 'kimi',\n  google: 'google',\n  'zai-org': 'zai',\n  zai: 'zai',\n  berget: 'berget',\n  bergetai: 'berget',\n};\n\n/** Monochrome, `currentColor`, 24×24 brand marks (via @lobehub/icons, MIT). */\nconst providerPaths: Record<Exclude<ModelLogoProvider, 'berget'>, string[]> = {\n  qwen: [\n    'M12.604 1.34c.393.69.784 1.382 1.174 2.075a.18.18 0 00.157.091h5.552c.174 0 .322.11.446.327l1.454 2.57c.19.337.24.478.024.837-.26.43-.513.864-.76 1.3l-.367.658c-.106.196-.223.28-.04.512l2.652 4.637c.172.301.111.494-.043.77-.437.785-.882 1.564-1.335 2.34-.159.272-.352.375-.68.37-.777-.016-1.552-.01-2.327.016a.099.099 0 00-.081.05 575.097 575.097 0 01-2.705 4.74c-.169.293-.38.363-.725.364-.997.003-2.002.004-3.017.002a.537.537 0 01-.465-.271l-1.335-2.323a.09.09 0 00-.083-.049H4.982c-.285.03-.553-.001-.805-.092l-1.603-2.77a.543.543 0 01-.002-.54l1.207-2.12a.198.198 0 000-.197 550.951 550.951 0 01-1.875-3.272l-.79-1.395c-.16-.31-.173-.496.095-.965.465-.813.927-1.625 1.387-2.436.132-.234.304-.334.584-.335a338.3 338.3 0 012.589-.001.124.124 0 00.107-.063l2.806-4.895a.488.488 0 01.422-.246c.524-.001 1.053 0 1.583-.006L11.704 1c.341-.003.724.032.9.34zm-3.432.403a.06.06 0 00-.052.03L6.254 6.788a.157.157 0 01-.135.078H3.253c-.056 0-.07.025-.041.074l5.81 10.156c.025.042.013.062-.034.063l-2.795.015a.218.218 0 00-.2.116l-1.32 2.31c-.044.078-.021.118.068.118l5.716.008c.046 0 .08.02.104.061l1.403 2.454c.046.081.092.082.139 0l5.006-8.76.783-1.382a.055.055 0 01.096 0l1.424 2.53a.122.122 0 00.107.062l2.763-.02a.04.04 0 00.035-.02.041.041 0 000-.04l-2.9-5.086a.108.108 0 010-.113l.293-.507 1.12-1.977c.024-.041.012-.062-.035-.062H9.2c-.059 0-.073-.026-.043-.077l1.434-2.505a.107.107 0 000-.114L9.225 1.774a.06.06 0 00-.053-.031zm6.29 8.02c.046 0 .058.02.034.06l-.832 1.465-2.613 4.585a.056.056 0 01-.05.029.058.058 0 01-.05-.029L8.498 9.841c-.02-.034-.01-.052.028-.054l.216-.012 6.722-.012z',\n  ],\n  mistral: [\n    'M3.428 3.4h3.429v3.428h3.429v3.429h-.002 3.431V6.828h3.427V3.4h3.43v13.714H24v3.429H13.714v-3.428h-3.428v-3.429h-3.43v3.428h3.43v3.429H0v-3.429h3.428V3.4zm10.286 13.715h3.428v-3.429h-3.427v3.429z',\n  ],\n  kimi: [\n    'M21.846 0a1.923 1.923 0 110 3.846H20.15a.226.226 0 01-.227-.226V1.923C19.923.861 20.784 0 21.846 0z',\n    'M11.065 11.199l7.257-7.2c.137-.136.06-.41-.116-.41H14.3a.164.164 0 00-.117.051l-7.82 7.756c-.122.12-.302.013-.302-.179V3.82c0-.127-.083-.23-.185-.23H3.186c-.103 0-.186.103-.186.23V19.77c0 .128.083.23.186.23h2.69c.103 0 .186-.102.186-.23v-3.25c0-.069.025-.135.069-.178l2.424-2.406a.158.158 0 01.205-.023l6.484 4.772a7.677 7.677 0 003.453 1.283c.108.012.2-.095.2-.23v-3.06c0-.117-.07-.212-.164-.227a5.028 5.028 0 01-2.027-.807l-5.613-4.064c-.117-.078-.132-.279-.028-.381z',\n  ],\n  google: [\n    'M23 12.245c0-.905-.075-1.565-.236-2.25h-10.54v4.083h6.186c-.124 1.014-.797 2.542-2.294 3.569l-.021.136 3.332 2.53.23.022C21.779 18.417 23 15.593 23 12.245z',\n    'M12.225 23c3.03 0 5.574-.978 7.433-2.665l-3.542-2.688c-.948.648-2.22 1.1-3.891 1.1a6.745 6.745 0 01-6.386-4.572l-.132.011-3.465 2.628-.045.124C4.043 20.531 7.835 23 12.225 23z',\n    'M5.84 14.175A6.65 6.65 0 015.463 12c0-.758.138-1.491.361-2.175l-.006-.147-3.508-2.67-.115.054A10.831 10.831 0 001 12c0 1.772.436 3.447 1.197 4.938l3.642-2.763z',\n    'M12.225 5.253c2.108 0 3.529.892 4.34 1.638l3.167-3.031C17.787 2.088 15.255 1 12.225 1 7.834 1 4.043 3.469 2.197 7.062l3.63 2.763a6.77 6.77 0 016.398-4.572z',\n  ],\n  zai: [\n    'M12.105 2L9.927 4.953H.653L2.83 2h9.276zM23.254 19.048L21.078 22h-9.242l2.174-2.952h9.244zM24 2L9.264 22H0L14.736 2H24z',\n  ],\n};\n\nconst providerLabels: Record<ModelLogoProvider, string> = {\n  qwen: 'Qwen',\n  mistral: 'Mistral',\n  kimi: 'Kimi',\n  google: 'Google',\n  zai: 'Z.ai',\n  berget: 'Berget AI',\n};\n\nconst categoryIcons: Record<ModelCategory, React.ComponentType<{ className?: string }>> = {\n  text: Bot,\n  'speech-to-text': AudioLines,\n  embedding: Braces,\n  rerank: ArrowDownWideNarrow,\n  'system-one': ScanEye,\n  vision: Eye,\n};\n\nconst categoryLabels: Record<ModelCategory, string> = {\n  text: 'Model',\n  'speech-to-text': 'Speech-to-text',\n  embedding: 'Embedding',\n  rerank: 'Reranker',\n  'system-one': 'System One',\n  vision: 'Vision',\n};\n\nexport interface ModelLogoProps extends React.SVGAttributes<SVGSVGElement> {\n  /**\n   * Model family to render a brand mark for. Accepts the `owned_by` values\n   * from `GET /v1/models` (e.g. `'moonshotai'`) case-insensitively.\n   */\n  provider?: string;\n  /** Fallback category when `provider` is missing or unknown. */\n  category?: ModelCategory;\n  /** Size (width and height) in pixels. */\n  size?: number;\n}\n\n/**\n * ModelLogo — brand mark for a supported model family, falling back to a\n * category icon for everything else. Renders nothing if no `provider` and\n * no `category` match.\n */\nexport const ModelLogo = React.forwardRef<SVGSVGElement, ModelLogoProps>(\n  ({ provider, category, size = 24, className, ...props }, ref) => {\n    const resolved = provider ? providerAliases[provider.trim().toLowerCase()] : undefined;\n\n    if (resolved === 'berget') {\n      return <BergetLogo variant=\"symbol\" size={size} className={cn('shrink-0', className)} />;\n    }\n\n    if (resolved) {\n      return (\n        <svg\n          ref={ref}\n          viewBox=\"0 0 24 24\"\n          fill=\"currentColor\"\n          width={size}\n          height={size}\n          role=\"img\"\n          aria-label={providerLabels[resolved]}\n          className={cn('shrink-0', className)}\n          {...props}\n        >\n          <title>{providerLabels[resolved]}</title>\n          {providerPaths[resolved].map((d, i) => (\n            <path key={i} d={d} />\n          ))}\n        </svg>\n      );\n    }\n\n    if (category) {\n      const Icon = categoryIcons[category];\n      return <Icon className={cn('shrink-0', className)} {...props} />;\n    }\n\n    return null;\n  },\n);\nModelLogo.displayName = 'ModelLogo';\n\nexport { categoryLabels };\n"],"mappings":";;;;;;;;;;AAyBA,MAAM,kBAAqD;CACzD,MAAM;CACN,WAAW;CACX,SAAS;CACT,YAAY;CACZ,MAAM;CACN,QAAQ;CACR,WAAW;CACX,KAAK;CACL,QAAQ;CACR,UAAU;AACZ;;AAGA,MAAM,gBAAwE;CAC5E,MAAM,CACJ,wjDACF;CACA,SAAS,CACP,qMACF;CACA,MAAM,CACJ,uGACA,udACF;CACA,QAAQ;EACN;EACA;EACA;EACA;CACF;CACA,KAAK,CACH,yHACF;AACF;AAEA,MAAM,iBAAoD;CACxD,MAAM;CACN,SAAS;CACT,MAAM;CACN,QAAQ;CACR,KAAK;CACL,QAAQ;AACV;AAEA,MAAM,gBAAoF;CACxF,MAAMA,aAAAA;CACN,kBAAkBC,aAAAA;CAClB,WAAWC,aAAAA;CACX,QAAQC,aAAAA;CACR,cAAcC,aAAAA;CACd,QAAQC,aAAAA;AACV;AAEA,MAAM,iBAAgD;CACpD,MAAM;CACN,kBAAkB;CAClB,WAAW;CACX,QAAQ;CACR,cAAc;CACd,QAAQ;AACV;;;;;;AAmBA,MAAa,YAAYC,MAAM,YAC5B,EAAE,UAAU,UAAU,OAAO,IAAI,WAAW,GAAG,SAAS,QAAQ;CAC/D,MAAM,WAAW,WAAW,gBAAgB,SAAS,KAAK,CAAC,CAAC,YAAY,KAAK,KAAA;CAE7E,IAAI,aAAa,UACf,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,mBAAAA,YAAD;EAAY,SAAQ;EAAe;EAAM,WAAWC,cAAAA,GAAG,YAAY,SAAS;CAAI,CAAA;CAGzF,IAAI,UACF,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EACO;EACL,SAAQ;EACR,MAAK;EACL,OAAO;EACP,QAAQ;EACR,MAAK;EACL,cAAY,eAAe;EAC3B,WAAWA,cAAAA,GAAG,YAAY,SAAS;EACnC,GAAI;EATN,UAAA,CAWE,iBAAA,GAAA,kBAAA,IAAA,CAAC,SAAD,EAAA,UAAQ,eAAe,UAAiB,CAAA,GACvC,cAAc,SAAS,CAAC,KAAK,GAAG,MAC/B,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD,EAAiB,EAAI,GAAV,CAAU,CACtB,CACE;;CAIT,IAAI,UAAU;EACZ,MAAM,OAAO,cAAc;EAC3B,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAAC,MAAD;GAAM,WAAWA,cAAAA,GAAG,YAAY,SAAS;GAAG,GAAI;EAAQ,CAAA;CACjE;CAEA,OAAO;AACT,CACF;AACA,UAAU,cAAc"}

package/dist/components/model-logo/ModelLogo.d.cts

@@ -0,0 +1,32 @@
+import * as React from "react";
+//#region src/components/model-logo/ModelLogo.d.ts
+/**
+ * Model families with a bundled brand mark, keyed by the `owned_by` values
+ * returned by `GET /v1/models` (normalized: lowercase, aliases below).
+ */
+export type ModelLogoProvider = 'qwen' | 'mistral' | 'kimi' | 'google' | 'zai' | 'berget';
+/** Fallback model categories for models without a brand mark, matching
+ * the `model_type` values in `GET /v1/models` (plus `vision`, which lives
+ * in per-model capabilities). */
+export type ModelCategory = 'text' | 'speech-to-text' | 'embedding' | 'rerank' | 'system-one' | 'vision';
+declare const categoryLabels: Record<ModelCategory, string>;
+export interface ModelLogoProps extends React.SVGAttributes<SVGSVGElement> {
+  /**
+   * Model family to render a brand mark for. Accepts the `owned_by` values
+   * from `GET /v1/models` (e.g. `'moonshotai'`) case-insensitively.
+   */
+  provider?: string;
+  /** Fallback category when `provider` is missing or unknown. */
+  category?: ModelCategory;
+  /** Size (width and height) in pixels. */
+  size?: number;
+}
+/**
+ * ModelLogo — brand mark for a supported model family, falling back to a
+ * category icon for everything else. Renders nothing if no `provider` and
+ * no `category` match.
+ */
+export declare const ModelLogo: React.ForwardRefExoticComponent<ModelLogoProps & React.RefAttributes<SVGSVGElement>>;
+//#endregion
+export { categoryLabels };
+//# sourceMappingURL=ModelLogo.d.cts.map

package/dist/components/model-logo/ModelLogo.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModelLogo.d.cts","names":[],"sources":["../../../src/components/model-logo/ModelLogo.tsx"],"mappings":";;;;;;YAWY;;;;YAKA;cA+DN,gBAAgB,OAAO;iBASZ,uBAAuB,MAAM,cAAc;;;;;EAK1D;;EAEA,WAAW;;EAEX;;;;;;;qBAQW,WAAS,MAAA,0BAAA,iBAAA,MAAA,cAAA"}

package/dist/components/model-logo/ModelLogo.d.mts

@@ -0,0 +1,32 @@
+import * as React from "react";
+//#region src/components/model-logo/ModelLogo.d.ts
+/**
+ * Model families with a bundled brand mark, keyed by the `owned_by` values
+ * returned by `GET /v1/models` (normalized: lowercase, aliases below).
+ */
+export type ModelLogoProvider = 'qwen' | 'mistral' | 'kimi' | 'google' | 'zai' | 'berget';
+/** Fallback model categories for models without a brand mark, matching
+ * the `model_type` values in `GET /v1/models` (plus `vision`, which lives
+ * in per-model capabilities). */
+export type ModelCategory = 'text' | 'speech-to-text' | 'embedding' | 'rerank' | 'system-one' | 'vision';
+declare const categoryLabels: Record<ModelCategory, string>;
+export interface ModelLogoProps extends React.SVGAttributes<SVGSVGElement> {
+  /**
+   * Model family to render a brand mark for. Accepts the `owned_by` values
+   * from `GET /v1/models` (e.g. `'moonshotai'`) case-insensitively.
+   */
+  provider?: string;
+  /** Fallback category when `provider` is missing or unknown. */
+  category?: ModelCategory;
+  /** Size (width and height) in pixels. */
+  size?: number;
+}
+/**
+ * ModelLogo — brand mark for a supported model family, falling back to a
+ * category icon for everything else. Renders nothing if no `provider` and
+ * no `category` match.
+ */
+export declare const ModelLogo: React.ForwardRefExoticComponent<ModelLogoProps & React.RefAttributes<SVGSVGElement>>;
+//#endregion
+export { categoryLabels };
+//# sourceMappingURL=ModelLogo.d.mts.map

package/dist/components/model-logo/ModelLogo.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModelLogo.d.mts","names":[],"sources":["../../../src/components/model-logo/ModelLogo.tsx"],"mappings":";;;;;;YAWY;;;;YAKA;cA+DN,gBAAgB,OAAO;iBASZ,uBAAuB,MAAM,cAAc;;;;;EAK1D;;EAEA,WAAW;;EAEX;;;;;;;qBAQW,WAAS,MAAA,0BAAA,iBAAA,MAAA,cAAA"}