@crisp-ui-kit/crisp 0.53.5 → 0.54.1

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

@@ -25,7 +25,7 @@ export type BulkBarProps = Omit<React.ComponentPropsWithoutRef<"div">, "children
  * positioned ancestor when a selection is active; render it conditionally
  * (e.g. `count > 0 && <BulkBar …/>`). Measured from a records table.
  */
-export declare function BulkBar({ count, onClear, countLabel, countText, children, className, clearLabel, ...rest }: BulkBarProps): React.JSX.Element;
+export declare function BulkBar({ count, onClear, countLabel: countLabelProp, countText, children, className, clearLabel: clearLabelProp, ...rest }: BulkBarProps): React.JSX.Element;
 export declare namespace BulkBar {
     var displayName: string;
 }

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

@@ -45,7 +45,7 @@ export type HeatmapChartProps = Omit<React.ComponentPropsWithoutRef<"div">, "chi
  * the recipe's own doc comment for why (and for its measurement — or lack
  * of one — against Attio).
  */
-export declare function HeatmapChart({ data, rowAxis, colAxis, format, cellTitle, onCellClick, isCellClickable, empty, emptyLabel, "aria-label": ariaLabel, className, ...rest }: HeatmapChartProps): React.JSX.Element;
+export declare function HeatmapChart({ data, rowAxis, colAxis, format, cellTitle, onCellClick, isCellClickable, empty, emptyLabel: emptyLabelProp, "aria-label": ariaLabel, className, ...rest }: HeatmapChartProps): React.JSX.Element;
 export declare namespace HeatmapChart {
     var displayName: string;
 }

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

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

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

@@ -0,0 +1,18 @@
+import type * as React from "react";
+export type SkipLinkProps = Omit<React.ComponentPropsWithoutRef<"a">, "href"> & {
+    /** The target to jump to. Default `"#main-content"` — give the page's
+     *  main landmark that id. */
+    href?: string;
+    className?: string;
+};
+/**
+ * A "skip to content" link — invisible until it is the thing with focus
+ * (a sighted mouse user never sees it), so a keyboard user's first Tab from
+ * a cold load reaches it instead of walking the whole nav first. Render it
+ * as the very first thing on the page, before the sidebar/header. See the
+ * recipe's own doc comment for why there's no Attio value behind its chrome.
+ */
+export declare function SkipLink({ href, children, className, ...rest }: SkipLinkProps): React.JSX.Element;
+export declare namespace SkipLink {
+    var displayName: string;
+}

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

@@ -0,0 +1,3 @@
+declare const config: import("../..").RecipeConfig<{}>;
+export declare const skiplinkRecipe: import("../..").RecipeFn<{}>;
+export default config;

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

@@ -0,0 +1,2 @@
+export { TextLink, type TextLinkProps } from "./textlink";
+export { textlinkRecipe } from "./textlink.recipe";

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

@@ -0,0 +1,19 @@
+import type * as React from "react";
+export type TextLinkProps = React.ComponentPropsWithoutRef<"a"> & {
+    /** `"brand"` — bold, always brand-coloured (a card's trailing "View all →").
+     *  `"muted"` (default) — quiet until hover, then brand-coloured (an
+     *  in-context reference link, e.g. a sample record under a finding). */
+    tone?: "brand" | "muted";
+    className?: string;
+};
+/**
+ * Inline navigable text — a real `<a href>` always, the same href+onClick
+ * division `StatList` uses: `href` gives ordinary browser behaviour (new
+ * tab, copy link, hover status), an `onClick` that calls
+ * `event.preventDefault()` pairs it with client-side routing (e.g.
+ * react-router's own `Link`).
+ */
+export declare function TextLink({ tone, className, ...rest }: TextLinkProps): React.JSX.Element;
+export declare namespace TextLink {
+    var displayName: string;
+}

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

@@ -0,0 +1,13 @@
+declare const config: import("../..").RecipeConfig<{
+    tone: {
+        brand: string;
+        muted: string;
+    };
+}>;
+export declare const textlinkRecipe: import("../..").RecipeFn<{
+    tone: {
+        brand: string;
+        muted: string;
+    };
+}>;
+export default config;

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

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

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

@@ -0,0 +1,15 @@
+import type * as React from "react";
+export type VisuallyHiddenProps = React.ComponentPropsWithoutRef<"span"> & {
+    className?: string;
+};
+/**
+ * Hides content visually while keeping it in the accessibility tree and
+ * the tab order — a label for an icon-only control, extra context for a
+ * screen-reader user that a sighted one gets from layout alone. Renders a
+ * `<span>`; wrap the element that needs the treatment, or read its content
+ * as a `label`/`aria-label` source in a test.
+ */
+export declare function VisuallyHidden({ className, ...rest }: VisuallyHiddenProps): React.JSX.Element;
+export declare namespace VisuallyHidden {
+    var displayName: string;
+}

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

@@ -0,0 +1,3 @@
+declare const config: import("../..").RecipeConfig<{}>;
+export declare const visuallyhiddenRecipe: import("../..").RecipeFn<{}>;
+export default config;

package/dist/types/index.d.ts

@@ -40,6 +40,7 @@ export * from "./components/resizablepanel";
 export * from "./components/segmented";
 export * from "./components/select";
 export * from "./components/skeleton";
+export * from "./components/skiplink";
 export * from "./components/slider";
 export * from "./components/spinner";
 export * from "./components/stagebar";
@@ -49,17 +50,21 @@ export * from "./components/table";
 export * from "./components/tabletoolbar";
 export * from "./components/tabs";
 export * from "./components/textarea";
+export * from "./components/textlink";
 export * from "./components/timepicker";
 export * from "./components/toast";
 export * from "./components/tooltip";
+export * from "./components/visuallyhidden";
 export * from "./components/wheelpicker";
 export * from "./core";
+export * from "./product/activityfeed";
 export * from "./product/appshell";
 export * from "./product/authshell";
 export * from "./product/board";
 export * from "./product/command";
 export * from "./product/entitycard";
 export * from "./product/flowcanvas";
+export * from "./product/headerbar";
 export * from "./product/inbox";
 export * from "./product/listpage";
 export * from "./product/navitem";

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

@@ -0,0 +1,57 @@
+import type * as React from "react";
+export type ActivityFeedProps = React.ComponentPropsWithoutRef<"div"> & {
+    className?: string;
+};
+/**
+ * A record's own event timeline — a vertically stacked, bordered list of
+ * `ActivityFeedRow`s, capped at a readable content width. Built for
+ * internal/grc's per-record "Activity" tab (crisp#462 SHELL/forms gap): it
+ * replaces a hand-rolled `<div className="mx-auto max-w-3xl space-y-4
+ * p-6">`. No live Attio re-measurement behind its own chrome this pass (the
+ * CDP bridge was unreachable when this was built) — see the recipe's own
+ * doc comment for which already-measured crisp values it reuses instead of
+ * a new guess.
+ */
+export declare function ActivityFeed({ className, children, ...rest }: ActivityFeedProps): React.JSX.Element;
+export declare namespace ActivityFeed {
+    var displayName: string;
+}
+export type ActivityFeedRowProps = {
+    /** Who did it — a chip, an avatar+name, whatever the consumer's identity
+     *  treatment is. crisp renders no actor chip of its own. */
+    actor: React.ReactNode;
+    /** What happened — a tag/badge naming the action. */
+    action: React.ReactNode;
+    /** When — already formatted for display. */
+    when: React.ReactNode;
+    /** An optional field-level diff list under the row (see
+     *  `ActivityFeedDiffItem`). */
+    children?: React.ReactNode;
+};
+/** One event row: actor + action + timestamp, with an optional diff list
+ *  underneath. The last row in an `ActivityFeed` draws no divider. */
+export declare function ActivityFeedRow({ actor, action, when, children, }: ActivityFeedRowProps): React.JSX.Element;
+export declare namespace ActivityFeedRow {
+    var displayName: string;
+}
+export type ActivityFeedDiffItemProps = {
+    /** The changed field's label. */
+    field: React.ReactNode;
+    /** The prior value, already formatted — omit for a "set to" (no known
+     *  prior value) row. */
+    before?: React.ReactNode;
+    /** The new value, already formatted. */
+    after: React.ReactNode;
+};
+/** One changed-field line under an `ActivityFeedRow` — "Field: before →
+ *  after", or "Field: set to after" when there is no known prior value. */
+export declare function ActivityFeedDiffItem({ field, before, after, }: ActivityFeedDiffItemProps): React.JSX.Element;
+export declare namespace ActivityFeedDiffItem {
+    var displayName: string;
+}
+export declare function ActivityFeedDiffList({ children, }: {
+    children: React.ReactNode;
+}): React.JSX.Element;
+export declare namespace ActivityFeedDiffList {
+    var displayName: string;
+}

package/dist/types/product/activityfeed/activityfeed.recipe.d.ts

@@ -0,0 +1,3 @@
+declare const config: import("../..").RecipeConfig<{}>;
+export declare const activityfeedRecipe: import("../..").RecipeFn<{}>;
+export default config;

package/dist/types/product/activityfeed/index.d.ts

@@ -0,0 +1,2 @@
+export { ActivityFeed, ActivityFeedDiffItem, type ActivityFeedDiffItemProps, ActivityFeedDiffList, type ActivityFeedProps, ActivityFeedRow, type ActivityFeedRowProps, } from "./activityfeed";
+export { activityfeedRecipe } from "./activityfeed.recipe";

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

@@ -34,7 +34,7 @@ export type BoardProps<T extends BoardCard> = Omit<React.ComponentPropsWithoutRe
  * (the parent owns the cards, so the move is a controlled state update).
  * Measured from a deals pipeline.
  */
-export declare function Board<T extends BoardCard>({ columns, cards, onCardsChange, renderCard, onNewCard, newCardLabel, getCardLabel, announceMove, className, ...rest }: BoardProps<T>): React.JSX.Element;
+export declare function Board<T extends BoardCard>({ columns, cards, onCardsChange, renderCard, onNewCard, newCardLabel: newCardLabelProp, getCardLabel, announceMove: announceMoveProp, className, ...rest }: BoardProps<T>): React.JSX.Element;
 export declare namespace Board {
     var displayName: string;
 }

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

@@ -54,4 +54,4 @@ export type CommandProps = Omit<React.ComponentPropsWithoutRef<"div">, "children
  * option list) so keyboard/focus correctness comes from the machines, not
  * hand-rolled event handling.
  */
-export declare function Command({ open, onOpenChange, items, placeholder, "aria-label": ariaLabel, navigateLabel, selectLabel, emptyLabel, query: queryProp, onQueryChange, filterItems, className, "aria-describedby": describedBy, ...rest }: CommandProps): React.JSX.Element | null;
+export declare function Command({ open, onOpenChange, items, placeholder: placeholderProp, "aria-label": ariaLabelProp, navigateLabel: navigateLabelProp, selectLabel: selectLabelProp, emptyLabel: emptyLabelProp, query: queryProp, onQueryChange, filterItems, className, "aria-describedby": describedBy, ...rest }: CommandProps): React.JSX.Element | null;

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

@@ -34,7 +34,7 @@ export type FlowCanvasProps<T extends FlowNode> = Omit<React.ComponentPropsWitho
  * measured from a workflows editor. Drag a node to move it (fires
  * `onNodesChange`); drag the background to pan; use the toolbar to zoom.
  */
-export declare function FlowCanvas<T extends FlowNode>({ nodes, edges, onNodesChange, renderNode, nodeWidth, nodeHeight, "aria-label": ariaLabel, className, zoomOutLabel, zoomInLabel, resetLabel, edgesLabel, ...rest }: FlowCanvasProps<T>): React.JSX.Element;
+export declare function FlowCanvas<T extends FlowNode>({ nodes, edges, onNodesChange, renderNode, nodeWidth, nodeHeight, "aria-label": ariaLabelProp, className, zoomOutLabel: zoomOutLabelProp, zoomInLabel: zoomInLabelProp, resetLabel: resetLabelProp, edgesLabel: edgesLabelProp, ...rest }: FlowCanvasProps<T>): React.JSX.Element;
 export declare namespace FlowCanvas {
     var displayName: string;
 }

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

@@ -0,0 +1,27 @@
+import type * as React from "react";
+export type HeaderBarProps = Omit<React.ComponentPropsWithoutRef<"div">, "title"> & {
+    /** Content before the title — a back button, an icon. Optional. */
+    leading?: React.ReactNode;
+    /** The bar's main content — plain text, or a `Breadcrumb`. Optional. */
+    title?: React.ReactNode;
+    /** Trailing action cluster — icon buttons, a search trigger. Optional. */
+    trailing?: React.ReactNode;
+    /**
+     * Draws the measured bottom divider. Default `true`. Set `false` when
+     * stacking two bars (a page header over a view bar) so only the outer one
+     * carries it — matches Attio's own two-bar pages, where only the top bar
+     * has a border and the one directly under it does not.
+     */
+    bordered?: boolean;
+    className?: string;
+};
+/**
+ * A page-level header row: an optional leading slot, a flexible title/
+ * breadcrumb region, and a trailing action cluster, on the measured 48px
+ * bar Attio uses for both its page-header and its view-bar row. See the
+ * recipe's own doc comment for the live measurement (crisp#462).
+ */
+export declare function HeaderBar({ leading, title, trailing, bordered, className, ...rest }: HeaderBarProps): React.JSX.Element;
+export declare namespace HeaderBar {
+    var displayName: string;
+}

package/dist/types/product/headerbar/headerbar.recipe.d.ts

@@ -0,0 +1,3 @@
+declare const config: import("../..").RecipeConfig<{}>;
+export declare const headerbarRecipe: import("../..").RecipeFn<{}>;
+export default config;

package/dist/types/product/headerbar/index.d.ts

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

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

@@ -38,7 +38,7 @@ export type InboxProps = Omit<React.ComponentPropsWithoutRef<"div">, "children"
  * (avatar + message + time + unread dot) or a centred empty state. Put it inside
  * a Popover for the flyout.
  */
-export declare function Inbox({ notifications, title, tabs, activeTab, onTabChange, emptyTitle, emptySubtitle, emptyAction, tabsLabel, className, ...rest }: InboxProps): React.JSX.Element;
+export declare function Inbox({ notifications, title: titleProp, tabs, activeTab, onTabChange, emptyTitle: emptyTitleProp, emptySubtitle: emptySubtitleProp, emptyAction, tabsLabel: tabsLabelProp, className, ...rest }: InboxProps): React.JSX.Element;
 export declare namespace Inbox {
     var displayName: string;
 }

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

@@ -52,7 +52,7 @@ export declare const onboardingLabels: {
  * started" widget. Title + optional menu/minimize, a segmented progress bar,
  * and step rows (completed rows strike through with a brand check).
  */
-export declare function OnboardingChecklist({ title, steps, encouragement, onStepClick, onMenu, onMinimize, className, optionsLabel, minimizeLabel, progressLabel, progressText, completedStepLabel, ...rest }: OnboardingChecklistProps): React.JSX.Element;
+export declare function OnboardingChecklist({ title: titleProp, steps, encouragement: encouragementProp, onStepClick, onMenu, onMinimize, className, optionsLabel: optionsLabelProp, minimizeLabel: minimizeLabelProp, progressLabel: progressLabelProp, progressText: progressTextProp, completedStepLabel: completedStepLabelProp, ...rest }: OnboardingChecklistProps): React.JSX.Element;
 export declare namespace OnboardingChecklist {
     var displayName: string;
 }

package/dist/types/product/recordpage/index.d.ts

@@ -1,2 +1,2 @@
-export { RecordPage, type RecordPageLabels, type RecordPageLabelsInput, type RecordPageProps, recordPageLabels, } from "./recordpage";
+export { RecordDetails, type RecordDetailsProps, RecordPage, type RecordPageHighlight, type RecordPageLabels, type RecordPageLabelsInput, type RecordPageNote, type RecordPageProps, type RecordPageSection, type RecordPageTab, type RecordPageTask, recordPageLabels, } from "./recordpage";
 export { recordpageRecipe } from "./recordpage.recipe";

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

@@ -1,3 +1,4 @@
+import { type LucideIcon } from "lucide-react";
 import * as React from "react";
 import { type Column, type Row } from "../recordstable";
 export type RecordPageNote = {
@@ -23,6 +24,39 @@ export type RecordPageTab = {
     count?: number;
     render: () => React.ReactNode;
 };
+/**
+ * One heading in the Details column, grouping a subset of `columns` by key
+ * (#528). Attio's own Details column is flat (measured live — no section
+ * headings at all), so a caller with no grouping of its own just omits
+ * `sections` and keeps that flat list, "View all values" reveal included.
+ * A caller that supplies `sections` replaces the flat list WHOLESALE — the
+ * same "caller's list replaces the built-in one, never merges with it"
+ * choice `tabs` already makes (#379) — so a column key named by no
+ * `fields` array here simply doesn't render. Sectioned mode always shows
+ * every field in every section (no 5-field reveal/"View all values"): a
+ * caller reaching for `sections` at all (GRC's own field groups; Attio has
+ * none to match) has already opted out of the flat Attio shape that reveal
+ * exists for.
+ */
+export type RecordPageSection = {
+    /** Section heading; omit for an untitled group (no heading rendered). */
+    title?: React.ReactNode;
+    /** Field keys in this section, in the order shown. */
+    fields: string[];
+};
+/**
+ * One Overview Highlights card — same shape `RecordPanel`'s own
+ * `RecordPanelHighlight` uses (#448), plus the empty-state node the CRM
+ * default already needed: `RecordPanel`'s peek never shows an empty
+ * highlight card, but `RecordPage`'s Overview always has (Attio's own
+ * "No connection", "No team", measured live), so that stays here.
+ */
+export type RecordPageHighlight = {
+    label: string;
+    icon?: LucideIcon;
+    value: React.ReactNode | null;
+    empty?: React.ReactNode;
+};
 export type RecordPageProps = Omit<React.ComponentPropsWithoutRef<"div">, "children"> & {
     record: Row;
     columns: Column[];
@@ -70,6 +104,22 @@ export type RecordPageProps = Omit<React.ComponentPropsWithoutRef<"div">, "child
     tasks?: RecordPageTask[];
     onAddTask?: (text: string) => void;
     onToggleTask?: (id: string) => void;
+    /**
+     * Groups the Details column's fields under headings instead of Attio's
+     * flat list (#528) — see `RecordPageSection`'s own doc. Omit to keep the
+     * flat Attio-parity list.
+     */
+    sections?: RecordPageSection[];
+    /**
+     * Replaces the Overview Highlights cards (#528) — Attio's own set is a
+     * fixed CRM shape (Connection strength, Estimated ARR, …) that has
+     * nothing to do with a non-CRM domain's data, the same problem #379
+     * already solved for `tabs`. `false` omits the whole Highlights section
+     * (heading included, matching how `RecordPanel`'s own `highlights` omits
+     * its section by being left out, #448). Omit the prop entirely to keep
+     * the built-in CRM set.
+     */
+    highlights?: RecordPageHighlight[] | false;
 };
 /**
  * Every chrome string RecordPage renders. Supplied as a PARTIAL map, so
@@ -139,6 +189,10 @@ export type RecordPageLabels = {
     recordCreated: (name: React.ReactNode) => React.ReactNode;
     /** Empty state on the Emails tab, given the record's name. */
     noEmailsWith: (name: React.ReactNode) => React.ReactNode;
+    /** Field search's own empty state, given the typed query — previously a
+     *  hardcoded English string; #528 moved it here alongside every other
+     *  chrome string this component renders, so it translates like the rest. */
+    noFieldsMatch: (query: React.ReactNode) => React.ReactNode;
 };
 export declare const recordPageLabels: RecordPageLabels;
 /** Partial override of any chrome string; the keyed maps nest. */
@@ -147,6 +201,41 @@ export type RecordPageLabelsInput = Partial<Omit<RecordPageLabels, "tabs" | "hig
     highlightLabels?: Partial<RecordPageLabels["highlightLabels"]>;
     highlightEmpty?: Partial<RecordPageLabels["highlightEmpty"]>;
 };
+export type RecordDetailsProps = Omit<React.ComponentPropsWithoutRef<"div">, "children"> & {
+    record: Row;
+    columns: Column[];
+    /** Groups fields under headings instead of Attio's flat list — see
+     *  `RecordPageSection`'s own doc. Omit to keep the flat list. */
+    sections?: RecordPageSection[];
+    onEdit?: (id: string, key: string, value: string) => Promise<void> | void;
+    labels?: RecordPageLabelsInput;
+    className?: string;
+};
+/**
+ * The Details column's own field list, on its own (#528) — `RecordPage`'s
+ * "Record Details" collapsible + searchable field list, the one piece a
+ * consumer with a fixed-width rail of its own (no resize handle, no entity
+ * header, no CRM Lists panel — GRC's own persistent 320px column, grc#66)
+ * actually needs, rather than rebuilding this same click-to-edit/search/
+ * `sections` machinery by hand or pulling in the whole page's chrome for a
+ * rail that isn't one. `RecordPage` composes this internally for its own
+ * resizable aside (same component either way, not a second copy) — this is
+ * that same block, exactly, just not wrapped in `RecordPage`'s own topbar/
+ * tabs/resizer.
+ *
+ * Not wrapped in `recordpageRecipe` itself: doing so would duplicate the
+ * recipe's own `display:flex;height:100%` base rule as a nested child
+ * inside `RecordPage`'s aside (which already carries that class from
+ * `RecordPage`'s own root), breaking that layout. A standalone caller
+ * needs exactly one `.crisp-recordpage`-scoped ancestor for this
+ * component's classes to resolve — wrap it in one, the same way
+ * `RecordPage`'s own root does: `<div className={recordpageRecipe()}>`
+ * (also exported from this package).
+ */
+export declare function RecordDetails({ record, columns, sections, onEdit, labels, className, ...rest }: RecordDetailsProps): React.JSX.Element;
+export declare namespace RecordDetails {
+    var displayName: string;
+}
 /**
  * The full-page company record view — the page that opens when you click into a
  * record (as opposed to the peek [RecordPanel]). A top breadcrumb bar with
@@ -155,7 +244,7 @@ export type RecordPageLabelsInput = Partial<Omit<RecordPageLabels, "tabs" | "hig
  * Emails sections (Notes & Tasks are live — add and check things off). Drop it
  * into the app's main content area.
  */
-export declare function RecordPage({ record, columns, collection, labels, onBack, onToggleFull, full, className, onEdit, tabs: tabsProp, defaultTab, notes: notesProp, onAddNote, tasks: tasksProp, onAddTask, onToggleTask, ...rest }: RecordPageProps): React.JSX.Element;
+export declare function RecordPage({ record, columns, collection, labels, onBack, onToggleFull, full, className, onEdit, tabs: tabsProp, defaultTab, notes: notesProp, onAddNote, tasks: tasksProp, onAddTask, onToggleTask, sections, highlights: highlightsProp, ...rest }: RecordPageProps): React.JSX.Element;
 export declare namespace RecordPage {
     var displayName: string;
 }

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

@@ -34,7 +34,7 @@ export type TaskListProps = Omit<React.ComponentPropsWithoutRef<"div">, "childre
  * count, then rows of a round complete-checkbox + title + trailing meta.
  * Completed rows strike through; overdue dates go red.
  */
-export declare function TaskList({ tasks, groups, onToggle, emptyLabel, className, completeLabel, incompleteLabel, ...rest }: TaskListProps): React.JSX.Element;
+export declare function TaskList({ tasks, groups, onToggle, emptyLabel: emptyLabelProp, className, completeLabel: completeLabelProp, incompleteLabel: incompleteLabelProp, ...rest }: TaskListProps): React.JSX.Element;
 export declare namespace TaskList {
     var displayName: string;
 }

package/dist/types/tokens/contract.d.ts

@@ -47,6 +47,9 @@ export declare const contract: MapLeafNodes<{
     fgWarningSoft: "softWarningText";
     fgDangerSoft: "softDangerText";
     fgNeutralSoft: "softNeutralText";
+    bgPurpleSoft: "purpleTint";
+    fgPurpleSoft: "softPurpleText";
+    ringPurpleSoft: "purpleRing";
 }, `var(--${string})`> & {
     space: Record<"0.5" | "1" | "1.5" | "2" | "2.5" | "3" | "4" | "5" | "6" | "8" | "px", `var(--${string})`>;
     radius: Record<"2xl" | "chip" | "full" | "lg" | "md" | "sm" | "xl", `var(--${string})`>;

package/dist/types/tokens/palette.d.ts

@@ -179,5 +179,17 @@ export declare const palette: {
         readonly light: "#686870";
         readonly dark: "#9a9aa2";
     };
+    readonly purpleTint: {
+        readonly light: "#f5f0ff";
+        readonly dark: "#f5f0ff";
+    };
+    readonly softPurpleText: {
+        readonly light: "#6238b5";
+        readonly dark: "#6238b5";
+    };
+    readonly purpleRing: {
+        readonly light: "#e8ddfe";
+        readonly dark: "#e8ddfe";
+    };
 };
 export type PaletteKey = keyof typeof palette;

package/dist/types/tokens/semantic.d.ts

@@ -55,5 +55,10 @@ export declare const semantic: {
     fgWarningSoft: "softWarningText";
     fgDangerSoft: "softDangerText";
     fgNeutralSoft: "softNeutralText";
+    /** Badge's purple/role-pill tone (crisp#506) — see palette.ts's comment
+     * on `purpleTint`/`softPurpleText`/`purpleRing` for the measurement. */
+    bgPurpleSoft: "purpleTint";
+    fgPurpleSoft: "softPurpleText";
+    ringPurpleSoft: "purpleRing";
 };
 export type Tokens = typeof semantic;

package/dist/visuallyhidden.css

@@ -0,0 +1,3 @@
+.crisp-visuallyhidden {
+  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
+}

package/dist/visuallyhidden.d.ts

@@ -0,0 +1,7 @@
+import type { RecipeFn } from "../core/types";
+
+export interface VisuallyhiddenVariants {
+
+}
+
+export declare const visuallyhiddenRecipe: RecipeFn<{  }>;

package/dist/visuallyhidden.layered.css

@@ -0,0 +1,5 @@
+@layer crisp-components {
+.crisp-visuallyhidden {
+  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
+}
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crisp-ui-kit/crisp",
-  "version": "0.53.5",
+  "version": "0.54.1",
   "description": "A lean React design system, measured pixel-for-pixel from Attio.",
   "license": "MIT",
   "type": "module",
@@ -243,6 +243,11 @@
       "import": "./dist/esm/components/skeleton/index.js",
       "require": "./dist/cjs/components/skeleton/index.js"
     },
+    "./skiplink": {
+      "types": "./dist/types/components/skiplink/index.d.ts",
+      "import": "./dist/esm/components/skiplink/index.js",
+      "require": "./dist/cjs/components/skiplink/index.js"
+    },
     "./slider": {
       "types": "./dist/types/components/slider/index.d.ts",
       "import": "./dist/esm/components/slider/index.js",
@@ -288,6 +293,11 @@
       "import": "./dist/esm/components/textarea/index.js",
       "require": "./dist/cjs/components/textarea/index.js"
     },
+    "./textlink": {
+      "types": "./dist/types/components/textlink/index.d.ts",
+      "import": "./dist/esm/components/textlink/index.js",
+      "require": "./dist/cjs/components/textlink/index.js"
+    },
     "./timepicker": {
       "types": "./dist/types/components/timepicker/index.d.ts",
       "import": "./dist/esm/components/timepicker/index.js",
@@ -303,11 +313,21 @@
       "import": "./dist/esm/components/tooltip/index.js",
       "require": "./dist/cjs/components/tooltip/index.js"
     },
+    "./visuallyhidden": {
+      "types": "./dist/types/components/visuallyhidden/index.d.ts",
+      "import": "./dist/esm/components/visuallyhidden/index.js",
+      "require": "./dist/cjs/components/visuallyhidden/index.js"
+    },
     "./wheelpicker": {
       "types": "./dist/types/components/wheelpicker/index.d.ts",
       "import": "./dist/esm/components/wheelpicker/index.js",
       "require": "./dist/cjs/components/wheelpicker/index.js"
     },
+    "./activityfeed": {
+      "types": "./dist/types/product/activityfeed/index.d.ts",
+      "import": "./dist/esm/product/activityfeed/index.js",
+      "require": "./dist/cjs/product/activityfeed/index.js"
+    },
     "./appshell": {
       "types": "./dist/types/product/appshell/index.d.ts",
       "import": "./dist/esm/product/appshell/index.js",
@@ -338,6 +358,11 @@
       "import": "./dist/esm/product/flowcanvas/index.js",
       "require": "./dist/cjs/product/flowcanvas/index.js"
     },
+    "./headerbar": {
+      "types": "./dist/types/product/headerbar/index.d.ts",
+      "import": "./dist/esm/product/headerbar/index.js",
+      "require": "./dist/cjs/product/headerbar/index.js"
+    },
     "./inbox": {
       "types": "./dist/types/product/inbox/index.d.ts",
       "import": "./dist/esm/product/inbox/index.js",