@crisp-ui-kit/crisp 0.54.2 → 0.54.3

package/dist/text.d.ts

@@ -0,0 +1,7 @@
+import type { RecipeFn } from "../core/types";
+
+export interface TextVariants {
+  tone?: "default" | "muted";
+}
+
+export declare const textRecipe: RecipeFn<{ tone: { default: string; muted: string } }>;

package/dist/text.layered.css

@@ -0,0 +1,11 @@
+@layer crisp-components {
+.crisp-text {
+  display: inline;
+}
+.crisp-text--tone_default {
+  color: var(--crisp-fg-primary);
+}
+.crisp-text--tone_muted {
+  color: var(--crisp-fg-neutral-muted);
+}
+}

package/dist/types/components/chip/chip.d.ts

@@ -3,6 +3,18 @@ import type { VariantProps } from "../../core";
 import { chipRecipe } from "./chip.recipe";
 export type ChipProps = React.ComponentPropsWithoutRef<"span"> & VariantProps<typeof chipRecipe> & {
     asChild?: boolean;
+    /**
+     * Ellipsis-truncates the label when it no longer fits. Only meaningful
+     * when `children` is a plain string — anything else (an avatar, a
+     * multi-node label) is rendered as given, untruncated.
+     *
+     * Ellipsis only, no `Tooltip` on hover (dropped, #623 — a truncated
+     * value in Attio is revealed by the cell's own click-to-expand, #579,
+     * not by a chip tooltip; there was no Attio reference for one, which
+     * is exactly the "never add polish the reference lacks" case). Not
+     * Attio's "+N" overflow badge either — see `chip.recipe.ts` for why.
+     */
+    truncate?: boolean;
 };
 /**
  * A small pill — the same measured chip RecordsTable, RecordPanel and
@@ -19,6 +31,10 @@ export type ChipProps = React.ComponentPropsWithoutRef<"span"> & VariantProps<ty
  * spacing from the label.
  */
 export declare const Chip: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & VariantProps<import("../..").RecipeFn<{
+    readonly truncate: {
+        readonly true: string;
+        readonly false: string;
+    };
     readonly tone: {
         readonly neutral: string;
         readonly brand: string;
@@ -31,6 +47,10 @@ export declare const Chip: React.ForwardRefExoticComponent<Omit<React.DetailedHT
     };
 }> & {
     config: import("../..").RecipeConfig<{
+        readonly truncate: {
+            readonly true: string;
+            readonly false: string;
+        };
         readonly tone: {
             readonly neutral: string;
             readonly brand: string;
@@ -44,4 +64,16 @@ export declare const Chip: React.ForwardRefExoticComponent<Omit<React.DetailedHT
     }>;
 }> & {
     asChild?: boolean;
+    /**
+     * Ellipsis-truncates the label when it no longer fits. Only meaningful
+     * when `children` is a plain string — anything else (an avatar, a
+     * multi-node label) is rendered as given, untruncated.
+     *
+     * Ellipsis only, no `Tooltip` on hover (dropped, #623 — a truncated
+     * value in Attio is revealed by the cell's own click-to-expand, #579,
+     * not by a chip tooltip; there was no Attio reference for one, which
+     * is exactly the "never add polish the reference lacks" case). Not
+     * Attio's "+N" overflow badge either — see `chip.recipe.ts` for why.
+     */
+    truncate?: boolean;
 } & React.RefAttributes<HTMLSpanElement>>;

package/dist/types/components/chip/chip.recipe.d.ts

@@ -3,7 +3,9 @@ declare const spec: {
     readonly base: {
         readonly display: "inline-flex";
         readonly alignItems: "center";
+        readonly gap: "3px";
         readonly height: `var(--${string})`;
+        readonly minWidth: 0;
         readonly paddingInline: `var(--${string})`;
         readonly borderRadius: `var(--${string})`;
         readonly fontSize: `var(--${string})`;
@@ -12,6 +14,22 @@ declare const spec: {
         readonly whiteSpace: "nowrap";
     };
     readonly variants: {
+        readonly truncate: {
+            readonly true: {
+                readonly decls: {};
+                readonly parts: [{
+                    readonly selector: "& .crisp-chip-label";
+                    readonly decls: {
+                        readonly minWidth: 0;
+                        readonly overflow: "hidden";
+                        readonly textOverflow: "ellipsis";
+                        readonly whiteSpace: "nowrap";
+                        readonly display: "block";
+                    };
+                }];
+            };
+            readonly false: {};
+        };
         readonly tone: {
             readonly neutral: {
                 readonly background: string;
@@ -57,9 +75,14 @@ declare const spec: {
     };
     readonly defaultVariants: {
         readonly tone: "neutral";
+        readonly truncate: false;
     };
 };
 declare const config: import("../..").RecipeConfig<{
+    readonly truncate: {
+        readonly true: string;
+        readonly false: string;
+    };
     readonly tone: {
         readonly neutral: string;
         readonly brand: string;
@@ -72,6 +95,10 @@ declare const config: import("../..").RecipeConfig<{
     };
 }>;
 export declare const chipRecipe: import("../..").RecipeFn<{
+    readonly truncate: {
+        readonly true: string;
+        readonly false: string;
+    };
     readonly tone: {
         readonly neutral: string;
         readonly brand: string;
@@ -84,6 +111,10 @@ export declare const chipRecipe: import("../..").RecipeFn<{
     };
 }> & {
     config: import("../..").RecipeConfig<{
+        readonly truncate: {
+            readonly true: string;
+            readonly false: string;
+        };
         readonly tone: {
             readonly neutral: string;
             readonly brand: string;

package/dist/types/components/datatable/datatable.d.ts

@@ -3,6 +3,10 @@ type IconType = React.ComponentType<{
     size?: number;
     strokeWidth?: number;
 }>;
+export declare function isLabelTruncated(el: {
+    scrollWidth: number;
+    clientWidth: number;
+}): boolean;
 export type EntityValue = {
     name: string;
     avatar?: string;
@@ -21,9 +25,10 @@ export type DataEditableOption = {
 export type DataCellType = "text" | "entity" | "tags" | "status" | "date" | "datetime" | "number" | "currency";
 export type DataTableColumn<T> = {
     key: string;
-    /** Truncates with an ellipsis when it's wider than the
-     * column. The full text stays in the DOM, so assistive tech and copy/paste
-     * get all of it; there is deliberately no `title` tooltip — see the recipe. */
+    /** Truncates with an ellipsis when it's wider than the column (#534: a
+     * `Tooltip` with the full text appears on hover/focus once it actually
+     * overflows — see `ThLabel` below). The full text stays in the DOM
+     * regardless, so assistive tech and copy/paste get all of it either way. */
     header: React.ReactNode;
     /** Built-in rich renderer: entity (avatar+name), tags (colour pills), status
      * (dot), date, number, currency. Overridden by `render`. */
@@ -261,11 +266,30 @@ export type DataTableProps<T extends {
     countLabel?: (shown: number, total: number) => React.ReactNode;
     /** Extra toolbar content (e.g. buttons) on the right of the toolbar. */
     toolbar?: React.ReactNode;
+    /**
+     * Bounds the grid's body to a fixed viewport height and makes it scroll
+     * internally (the way Attio's own grid does), which is also what turns on
+     * ROW virtualization (#577) -- only rows inside that viewport (plus a
+     * small overscan) render; rows outside it collapse into two spacer `<tr>`s
+     * so the scrollbar still reflects the true row count. A number is pixels;
+     * a string is any CSS length ("100%", "60vh") -- the first paint
+     * (including SSR) windows to an assumed viewport before the real size is
+     * measured on mount, so a plain number gets a pixel-accurate first window
+     * and a string gets an approximate one that corrects itself right after
+     * hydration.
+     *
+     * Omitted (the default): the grid grows to fit every row, exactly as
+     * before -- there is no internal scroll position for row windowing to mean
+     * anything, so this is the opt-in half of virtualization. COLUMN
+     * virtualization (below) is the other half and does NOT need this prop --
+     * the grid already has a determinate horizontal scroll container.
+     */
+    height?: number | string;
     className?: string;
 };
 export declare function DataTable<T extends {
     id: string;
-}>({ columns: columnsProp, data, selectable, selectedIds, onSelectionChange, selectAllLabel: selectAllLabelProp, selectRowLabel, selectionAnnouncement, columnMenu, onColumnsChange, groupBy, onRowsReorder, error, sort: sortProp, defaultSort, onSortChange, filterable, searchPlaceholder: searchPlaceholderProp, searchLabel: searchLabelProp, onEdit, stickyFirst, stickyLast, scrollProps, locale: localeProp, avatarTone, surface, interactive, onRowClick, onAddRow, addRowLabel: addRowLabelProp, empty: emptyProp, showCount, countLabel, toolbar, className, reorderRowLabel: reorderRowLabelProp, sortAscendingLabel: sortAscendingLabelProp, sortDescendingLabel: sortDescendingLabelProp, moveColumnLeftLabel: moveColumnLeftLabelProp, moveColumnRightLabel: moveColumnRightLabelProp, editColumnLabel: editColumnLabelProp, hideColumnLabel: hideColumnLabelProp, renameColumnLabel: renameColumnLabelProp, viewSettingsLabel: viewSettingsLabelProp, columnsGroupLabel: columnsGroupLabelProp, ...rest }: DataTableProps<T>): React.JSX.Element;
+}>({ columns: columnsProp, data, selectable, selectedIds, onSelectionChange, selectAllLabel: selectAllLabelProp, selectRowLabel, selectionAnnouncement, columnMenu, onColumnsChange, groupBy, onRowsReorder, error, sort: sortProp, defaultSort, onSortChange, filterable, searchPlaceholder: searchPlaceholderProp, searchLabel: searchLabelProp, onEdit, stickyFirst, stickyLast, scrollProps, locale: localeProp, avatarTone, surface, interactive, onRowClick, onAddRow, addRowLabel: addRowLabelProp, empty: emptyProp, showCount, countLabel, toolbar, height, className, reorderRowLabel: reorderRowLabelProp, sortAscendingLabel: sortAscendingLabelProp, sortDescendingLabel: sortDescendingLabelProp, moveColumnLeftLabel: moveColumnLeftLabelProp, moveColumnRightLabel: moveColumnRightLabelProp, editColumnLabel: editColumnLabelProp, hideColumnLabel: hideColumnLabelProp, renameColumnLabel: renameColumnLabelProp, viewSettingsLabel: viewSettingsLabelProp, columnsGroupLabel: columnsGroupLabelProp, ...rest }: DataTableProps<T>): React.JSX.Element;
 export declare namespace DataTable {
     var displayName: string;
 }

package/dist/types/components/emptystate/emptystate.d.ts

@@ -1,19 +1,44 @@
 import type * as React from "react";
+/**
+ * #603: Attio's zero-*records* state (Users/Workspaces with nothing
+ * imported yet) pairs a "Learn more" label with a clickable card — an
+ * icon tile plus a title, e.g. "Learn more" / "Understanding records".
+ * Rendered as an `<a>` when `href` is given (matches Attio's own
+ * "Import CSV"/card being real links), a `<button>` otherwise.
+ */
+export type EmptyStateLearnMore = {
+    icon: React.ReactNode;
+    /** Defaults to "Learn more". */
+    label?: React.ReactNode;
+    title: React.ReactNode;
+    href?: string;
+    onClick?: () => void;
+};
 export type EmptyStateProps = Omit<React.ComponentPropsWithoutRef<"div">, "title"> & {
     icon?: React.ReactNode;
     title: React.ReactNode;
     description?: React.ReactNode;
-    /** A primary action (e.g. a Button) shown below. */
+    /**
+     * A primary action (e.g. a Button) shown below. Pass more than one
+     * (a Fragment of Buttons) for a multi-CTA state (#603, measured:
+     * Attio's zero-records "Import CSV" + "Connect data source" pair,
+     * 8px gap) -- the container lays them out in a row automatically.
+     */
     action?: React.ReactNode;
+    /** A "Learn more" card below the action(s) (#603). */
+    learnMore?: EmptyStateLearnMore;
     /**
      * `illustrated` shows a large icon on a dotted-grid backdrop; `page` is
-     * the full-view empty state (ringed circle icon + 20px heading).
+     * the full-view empty state (ringed circle icon + 20px heading);
+     * `records` is the larger (138px) dotted-grid tile Attio's zero-records
+     * table state uses (#603) -- same backdrop idiom as `illustrated`, a
+     * different measured size because it's a different surface.
      */
-    variant?: "default" | "illustrated" | "page";
+    variant?: "default" | "illustrated" | "page" | "records";
     className?: string;
 };
 /** A centred empty-state panel — icon, title, description, optional action. */
-export declare function EmptyState({ icon, title, description, action, variant, className, ...rest }: EmptyStateProps): React.JSX.Element;
+export declare function EmptyState({ icon, title, description, action, learnMore, variant, className, ...rest }: EmptyStateProps): React.JSX.Element;
 export declare namespace EmptyState {
     var displayName: string;
 }

package/dist/types/components/emptystate/emptystate.recipe.d.ts

@@ -3,6 +3,7 @@ declare const config: import("../..").RecipeConfig<{
         default: string;
         illustrated: string;
         page: string;
+        records: string;
     };
 }>;
 export declare const emptystateRecipe: import("../..").RecipeFn<{
@@ -10,6 +11,7 @@ export declare const emptystateRecipe: import("../..").RecipeFn<{
         default: string;
         illustrated: string;
         page: string;
+        records: string;
     };
 }>;
 export default config;

package/dist/types/components/emptystate/index.d.ts

@@ -1,2 +1,2 @@
-export { EmptyState, type EmptyStateProps } from "./emptystate";
+export { EmptyState, type EmptyStateLearnMore, type EmptyStateProps, } from "./emptystate";
 export { emptystateRecipe } from "./emptystate.recipe";

package/dist/types/components/personchip/index.d.ts

@@ -0,0 +1 @@
+export * from "./personchip";

package/dist/types/components/personchip/personchip.d.ts

@@ -0,0 +1,37 @@
+import type * as React from "react";
+export type PersonChipProps = Omit<React.ComponentPropsWithoutRef<"span">, "children"> & {
+    /** The person's display name — also the avatar's initials fallback. */
+    name: string;
+    /** A photo URL. Omitted (no populated photo field was reachable to
+     *  measure this round), the avatar falls back to a per-name hashed-colour
+     *  initials tile. */
+    avatar?: string;
+    /** De-emphasises the name (e.g. a departed person, a system actor) —
+     *  `fgNeutralMuted`, the same token `Text`'s own `tone="muted"` uses.
+     *  Applied to the name only; the avatar keeps its full-strength tone so
+     *  the chip still reads as a distinct person, not a disabled control. */
+    muted?: boolean;
+    className?: string;
+};
+/**
+ * A person, as a chip: a small avatar (a photo, or hashed-colour initials)
+ * plus their name, truncating with an ellipsis when it doesn't fit — Attio's
+ * own actor chip (measured live on `techpartners`, Tasks page, "Assigned to"
+ * column): a 16px circular avatar in a neutral `Chip`, `gap: 3px` between
+ * avatar and name (now `Chip`'s own base — every multi-child `Chip` gets
+ * it). Every other value — the pill's height, padding, radius, ring and text
+ * — is already `Chip`'s, unchanged; `PersonChip` adds no recipe of its own.
+ *
+ * Ellipsis only, no `Tooltip` on hover (#623 — no Attio reference for one;
+ * a truncated cell there is revealed by its own click-to-expand, #579, a
+ * different, DataTable-specific interaction).
+ *
+ * Composes `Chip`'s `truncate` CSS directly rather than its string-only
+ * auto-wrap (children here is an avatar plus a name, not a single string),
+ * so the name gets its own `.crisp-chip-label` span while the avatar stays
+ * fixed-size.
+ */
+export declare function PersonChip({ name, avatar, muted, className, ...props }: PersonChipProps): React.JSX.Element;
+export declare namespace PersonChip {
+    var displayName: string;
+}

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

@@ -8,6 +8,24 @@ export type TableProps = React.ComponentPropsWithoutRef<"table"> & VariantProps<
     scrollProps?: React.ComponentPropsWithoutRef<"div"> & {
         ref?: React.Ref<HTMLDivElement>;
     };
+    /**
+     * Style applied to the `<table>` element itself, as opposed to `style`
+     * (below), which sizes the OUTER bordered wrapper -- crisp/#581.
+     * `DataTable` uses this for its `min-width: <sum of column widths>`,
+     * which forces `<table>` to its true content width and lets
+     * `.crisp-table-scroll`'s existing `overflow-x: auto` scroll it
+     * internally. Putting that same min-width on the outer wrapper
+     * (`style`) instead, as this component used to require, forces the
+     * WRAPPER itself that wide -- a plain block box's width is normally set
+     * by its own container regardless of a child's min-width, so the only
+     * element that should ever be forced wider than its container is the
+     * scrollable one, never an ancestor of it. Getting this backwards is
+     * exactly what made a `DataTable` widen its own page instead of
+     * scrolling in place (internal/grc#117), forcing GRC to hand-build its
+     * own `overflow: hidden` clipping wrapper around it -- which the
+     * crisp-only rule forbids and which this makes unnecessary.
+     */
+    tableStyle?: React.CSSProperties;
 };
 /**
  * A composable data table. Wraps `<table>` in a horizontally scrollable
@@ -32,6 +50,24 @@ export declare const Table: React.ForwardRefExoticComponent<Omit<React.DetailedH
     scrollProps?: React.ComponentPropsWithoutRef<"div"> & {
         ref?: React.Ref<HTMLDivElement>;
     };
+    /**
+     * Style applied to the `<table>` element itself, as opposed to `style`
+     * (below), which sizes the OUTER bordered wrapper -- crisp/#581.
+     * `DataTable` uses this for its `min-width: <sum of column widths>`,
+     * which forces `<table>` to its true content width and lets
+     * `.crisp-table-scroll`'s existing `overflow-x: auto` scroll it
+     * internally. Putting that same min-width on the outer wrapper
+     * (`style`) instead, as this component used to require, forces the
+     * WRAPPER itself that wide -- a plain block box's width is normally set
+     * by its own container regardless of a child's min-width, so the only
+     * element that should ever be forced wider than its container is the
+     * scrollable one, never an ancestor of it. Getting this backwards is
+     * exactly what made a `DataTable` widen its own page instead of
+     * scrolling in place (internal/grc#117), forcing GRC to hand-build its
+     * own `overflow: hidden` clipping wrapper around it -- which the
+     * crisp-only rule forbids and which this makes unnecessary.
+     */
+    tableStyle?: React.CSSProperties;
 } & React.RefAttributes<HTMLTableElement>>;
 export declare const TableHeader: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & React.RefAttributes<HTMLTableSectionElement>>;
 export declare const TableBody: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & React.RefAttributes<HTMLTableSectionElement>>;

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

@@ -1,4 +1,6 @@
 import * as React from "react";
+import type { VariantProps } from "../../core";
+import { tabsRecipe } from "./tabs.recipe";
 export type TabItem = {
     value: string;
     label: React.ReactNode;
@@ -8,7 +10,7 @@ export type TabItem = {
     badge?: React.ReactNode;
     disabled?: boolean;
 };
-export type TabsProps = Omit<React.ComponentPropsWithoutRef<"div">, "value" | "defaultValue" | "children"> & {
+export type TabsProps = Omit<React.ComponentPropsWithoutRef<"div">, "value" | "defaultValue" | "children"> & VariantProps<typeof tabsRecipe> & {
     tabs: TabItem[];
     /** Controlled active value. Omit to let Tabs manage it (see defaultValue). */
     value?: string;
@@ -27,7 +29,7 @@ export type TabsProps = Omit<React.ComponentPropsWithoutRef<"div">, "value" | "d
  * Home/End jump); activation follows focus. Controlled via
  * `value`/`onValueChange`, or uncontrolled from `defaultValue`.
  */
-export declare function Tabs({ tabs, value, defaultValue, onValueChange, leading, children, className, "aria-label": ariaLabel, ...rest }: TabsProps): React.JSX.Element;
+export declare function Tabs({ tabs, value, defaultValue, onValueChange, leading, children, className, fill, "aria-label": ariaLabel, ...rest }: TabsProps): React.JSX.Element;
 export declare namespace Tabs {
     var displayName: string;
 }

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

@@ -1,5 +1,20 @@
-declare const config: import("../..").RecipeConfig<{}>;
-export declare const tabsRecipe: import("../..").RecipeFn<{}> & {
-    config: import("../..").RecipeConfig<{}>;
+declare const config: import("../..").RecipeConfig<{
+    fill: {
+        true: string;
+        false: string;
+    };
+}>;
+export declare const tabsRecipe: import("../..").RecipeFn<{
+    fill: {
+        true: string;
+        false: string;
+    };
+}> & {
+    config: import("../..").RecipeConfig<{
+        fill: {
+            true: string;
+            false: string;
+        };
+    }>;
 };
 export default config;

package/dist/types/components/text/index.d.ts

@@ -0,0 +1,2 @@
+export { Text, type TextProps } from "./text";
+export { textRecipe } from "./text.recipe";

package/dist/types/components/text/text.d.ts

@@ -0,0 +1,32 @@
+import * as React from "react";
+import type { VariantProps } from "../../core";
+import { textRecipe } from "./text.recipe";
+export type TextProps = React.ComponentPropsWithoutRef<"span"> & VariantProps<typeof textRecipe> & {
+    asChild?: boolean;
+};
+/**
+ * Plain coloured text — `tone="default"` (the app's primary text colour) or
+ * `"muted"` — for the runs of text that aren't a Badge, a Chip, a link, or
+ * any of crisp's other typed things: a cell's own yes/no, an empty-state
+ * caption, a secondary line under a heading. One component so every such
+ * spot reaches for crisp's own tokens instead of each hand-writing its own
+ * colour utility for the same two values.
+ *
+ * Renders a `<span>` (inherits its size/weight/line-height from context —
+ * see `text.recipe.ts`'s doc for why `Text` sets none of those itself).
+ */
+export declare const Text: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & VariantProps<import("../..").RecipeFn<{
+    readonly tone: {
+        readonly default: string;
+        readonly muted: string;
+    };
+}> & {
+    config: import("../..").RecipeConfig<{
+        readonly tone: {
+            readonly default: string;
+            readonly muted: string;
+        };
+    }>;
+}> & {
+    asChild?: boolean;
+} & React.RefAttributes<HTMLSpanElement>>;

package/dist/types/components/text/text.recipe.d.ts

@@ -0,0 +1,40 @@
+declare const spec: {
+    readonly name: "text";
+    readonly base: {
+        readonly display: "inline";
+    };
+    readonly variants: {
+        tone: {
+            default: {
+                color: `var(--${string})`;
+            };
+            muted: {
+                color: `var(--${string})`;
+            };
+        };
+    };
+    readonly defaultVariants: {
+        readonly tone: "default";
+    };
+};
+declare const config: import("../..").RecipeConfig<{
+    readonly tone: {
+        readonly default: string;
+        readonly muted: string;
+    };
+}>;
+export declare const textRecipe: import("../..").RecipeFn<{
+    readonly tone: {
+        readonly default: string;
+        readonly muted: string;
+    };
+}> & {
+    config: import("../..").RecipeConfig<{
+        readonly tone: {
+            readonly default: string;
+            readonly muted: string;
+        };
+    }>;
+};
+export { spec };
+export default config;

package/dist/types/index.d.ts

@@ -33,6 +33,7 @@ export * from "./components/mentionchip";
 export * from "./components/menu";
 export * from "./components/middletruncate";
 export * from "./components/multiselect";
+export * from "./components/personchip";
 export * from "./components/popover";
 export * from "./components/progress";
 export * from "./components/quantitypicker";
@@ -50,6 +51,7 @@ export * from "./components/switch";
 export * from "./components/table";
 export * from "./components/tabletoolbar";
 export * from "./components/tabs";
+export * from "./components/text";
 export * from "./components/textarea";
 export * from "./components/textlink";
 export * from "./components/timepicker";

package/dist/types/product/recordstable/recordstable.d.ts

@@ -1,9 +1,14 @@
 import * as React from "react";
+import { type EmptyStateLearnMore } from "../../components/emptystate";
 import type { EditableOption } from "./editable-field";
 type IconType = React.ComponentType<{
     size?: number;
     strokeWidth?: number;
 }>;
+export declare function isLabelTruncated(el: {
+    scrollWidth: number;
+    clientWidth: number;
+}): boolean;
 export type ColumnType = "entity" | "text" | "tags" | "number" | "url" | "date" | "currency" | "status" | "reference";
 export type StatusOption = {
     value: string;
@@ -123,6 +128,20 @@ export type RecordsTableProps = Omit<React.ComponentPropsWithoutRef<"div">, "chi
      * stable colour per name, matching what `DataTable`'s `avatarTone` offers).
      * Entity avatars only — `TAG_TONES`/tag/status tone logic is untouched. */
     avatarTone?: "brand" | "hashed";
+    /**
+     * #603: Attio's zero-*records* state (nothing imported yet, no active
+     * filter) adds an "Import CSV" / "Connect data source" pair and a
+     * "Learn more" card next to the usual "New record" action -- measured
+     * on Users/Workspaces, which show nothing else. Omit any of these and
+     * that piece is left out; omit the whole prop and the empty state is
+     * unchanged (just "New record"), since this hasn't been confirmed for
+     * every object type.
+     */
+    emptyStateExtra?: {
+        onImportCsv?: () => void;
+        onConnectDataSource?: () => void;
+        learnMore?: EmptyStateLearnMore;
+    };
     className?: string;
 };
 export declare function tagTone(t: string): string;
@@ -204,6 +223,9 @@ export type RecordsTableLabels = {
     setRecordPlaceholder: string;
     noRecords: string;
     untitled: string;
+    /** #603: the zero-records state's optional extra CTAs. */
+    importCsv: string;
+    connectDataSource: string;
     /** Aggregation names, keyed by the aggregation. */
     agg: Record<Agg, string>;
     /** Filter operator names, keyed by the operator. */
@@ -229,7 +251,7 @@ export type RecordsTableLabelsInput = Partial<Omit<RecordsTableLabels, "agg" | "
     agg?: Partial<Record<Agg, string>>;
     op?: Partial<Record<FilterOp, string>>;
 };
-type FilterOp = "contains" | "is" | "isnot" | "empty" | "notempty";
+type FilterOp = "contains" | "doesnotcontain" | "startswith" | "endswith" | "is" | "isnot" | "empty" | "notempty";
 /**
  * A date-only cell is a CALENDAR DATE, not an instant. ECMA-262 parses the
  * date-only ISO forms — `1998`, `1998-09`, `1998-09-04` — as UTC midnight, and
@@ -251,6 +273,6 @@ export { formatCellDate, parseCellDate };
  * and a floating bulk-action bar (delete / deselect) when rows are selected.
  * Selection can be controlled via `selectedIds`/`onSelectionChange`.
  */
-export declare function RecordsTable({ labels, columns: columnsProp, rows: rowsProp, selectedIds, onSelectionChange, showNew, allowAddColumn, onOpenRecord, onOpenRecordPage, avatarTone, className, ...rest }: RecordsTableProps): React.JSX.Element;
+export declare function RecordsTable({ labels, columns: columnsProp, rows: rowsProp, selectedIds, onSelectionChange, showNew, allowAddColumn, onOpenRecord, onOpenRecordPage, avatarTone, emptyStateExtra, className, ...rest }: RecordsTableProps): React.JSX.Element;
 export declare const defaultColumns: Column[];
 export declare const defaultRows: Row[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crisp-ui-kit/crisp",
-  "version": "0.54.2",
+  "version": "0.54.3",
   "description": "A lean React design system, measured pixel-for-pixel from Attio.",
   "license": "MIT",
   "type": "module",
@@ -208,6 +208,11 @@
       "import": "./dist/esm/components/multiselect/index.js",
       "require": "./dist/cjs/components/multiselect/index.js"
     },
+    "./personchip": {
+      "types": "./dist/types/components/personchip/index.d.ts",
+      "import": "./dist/esm/components/personchip/index.js",
+      "require": "./dist/cjs/components/personchip/index.js"
+    },
     "./popover": {
       "types": "./dist/types/components/popover/index.d.ts",
       "import": "./dist/esm/components/popover/index.js",
@@ -293,6 +298,11 @@
       "import": "./dist/esm/components/tabs/index.js",
       "require": "./dist/cjs/components/tabs/index.js"
     },
+    "./text": {
+      "types": "./dist/types/components/text/index.d.ts",
+      "import": "./dist/esm/components/text/index.js",
+      "require": "./dist/cjs/components/text/index.js"
+    },
     "./textarea": {
       "types": "./dist/types/components/textarea/index.d.ts",
       "import": "./dist/esm/components/textarea/index.js",