@crisp-ui-kit/crisp 0.57.0 → 0.57.2

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

@@ -0,0 +1,85 @@
+import * as React from "react";
+import type { SelectOption } from "../../components/select";
+export type MemberRow = {
+    id: string;
+    name: React.ReactNode;
+    isYou?: boolean;
+    email: string;
+    /** "Admin" renders Attio's measured purple role badge; any other value
+     *  renders as plain text (Attio's own Member role has no pill). */
+    role: "Admin" | React.ReactNode;
+    teams?: React.ReactNode;
+    avatarSrc?: string;
+};
+export type MembersSettingsProps = Omit<React.ComponentPropsWithoutRef<"div">, "title"> & {
+    members: MemberRow[];
+    /** Search box value (controlled). */
+    searchValue?: string;
+    onSearchChange?: (value: string) => void;
+    onFilterClick?: () => void;
+    onInviteClick?: () => void;
+    onRowMenuClick?: (member: MemberRow) => void;
+    /** Which pill is active — Members is the only tab with a built shape
+     *  (P-119/P-120); Teams renders `teamsContent` or a muted placeholder,
+     *  since Attio's Teams tab body wasn't part of this issue's measurement. */
+    tab?: "members" | "teams";
+    onTabChange?: (tab: "members" | "teams") => void;
+    teamsContent?: React.ReactNode;
+    className?: string;
+    /** Chrome strings, each overridable for non-English UIs. */
+    title?: string;
+    description?: string;
+    learnMoreLabel?: string;
+    learnMoreHref?: string;
+    membersTabLabel?: string;
+    teamsTabLabel?: string;
+    tablistLabel?: string;
+    searchPlaceholder?: string;
+    filterLabel?: string;
+    inviteLabel?: string;
+    userColumnLabel?: string;
+    roleColumnLabel?: string;
+    teamsColumnLabel?: string;
+    memberActionsLabel?: string;
+    noTeamsLabel?: string;
+};
+/**
+ * Attio's "Members and teams" settings page (crisp#636, P-119/P-120):
+ * title + description, a Members/Teams segmented switcher, a
+ * search+Filter+Invite toolbar, and the members table (User/Role/Teams).
+ * Compose `InviteMembersDialog` alongside for the "Invite members" flow.
+ */
+export declare function MembersSettings({ members, searchValue, onSearchChange, onFilterClick, onInviteClick, onRowMenuClick, tab: tabProp, onTabChange, teamsContent, className, title, description, learnMoreLabel, learnMoreHref, membersTabLabel, teamsTabLabel, tablistLabel, searchPlaceholder, filterLabel, inviteLabel, userColumnLabel, roleColumnLabel, teamsColumnLabel, memberActionsLabel, noTeamsLabel, ...rest }: MembersSettingsProps): React.JSX.Element;
+export declare namespace MembersSettings {
+    var displayName: string;
+}
+export type InviteMembersDialogProps = Omit<React.ComponentPropsWithoutRef<"div">, "title" | "onSend" | "children"> & {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    /** Comma/newline-separated email list, as typed into the composer. */
+    emails: string;
+    onEmailsChange: (value: string) => void;
+    inviteAs: "member" | "admin";
+    onInviteAsChange: (value: "member" | "admin") => void;
+    team: string;
+    onTeamChange: (value: string) => void;
+    teamOptions?: SelectOption[];
+    onSend: () => void;
+    title?: string;
+    emailsPlaceholder?: string;
+    inviteAsFieldLabel?: string;
+    memberOptionLabel?: string;
+    adminOptionLabel?: string;
+    addToTeamFieldLabel?: string;
+    addToTeamPlaceholder?: string;
+    sendLabel?: string;
+};
+/**
+ * Attio's "Invite members" modal (crisp#636, P-120), measured live: 708px
+ * wide, a multi-email composer, an "Invite as" select (default Member) and
+ * an optional "Add to team" search-or-create select, footer "Send Invites".
+ */
+export declare function InviteMembersDialog({ open, onOpenChange, emails, onEmailsChange, inviteAs, onInviteAsChange, team, onTeamChange, teamOptions, onSend, title, emailsPlaceholder, inviteAsFieldLabel, memberOptionLabel, adminOptionLabel, addToTeamFieldLabel, addToTeamPlaceholder, sendLabel, ...rest }: InviteMembersDialogProps): React.JSX.Element;
+export declare namespace InviteMembersDialog {
+    var displayName: string;
+}

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

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

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

@@ -0,0 +1 @@
+export { type NotificationMatrixRow, NotificationsSettings, type NotificationsSettingsProps, } from "./notificationssettings";

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

@@ -0,0 +1,37 @@
+import type * as React from "react";
+export type NotificationMatrixRow = {
+    id: string;
+    title: React.ReactNode;
+    description: React.ReactNode;
+    email: boolean;
+    app: boolean;
+};
+export type NotificationsSettingsProps = Omit<React.ComponentPropsWithoutRef<"div">, "title"> & {
+    dailyDigestEnabled: boolean;
+    onDailyDigestChange: (enabled: boolean) => void;
+    rows: NotificationMatrixRow[];
+    onEmailChange: (id: string, checked: boolean) => void;
+    onAppChange: (id: string, checked: boolean) => void;
+    /** Chrome strings, each overridable for non-English UIs. */
+    title?: string;
+    description?: string;
+    learnMoreLabel?: string;
+    learnMoreHref?: string;
+    dailyDigestSectionTitle?: string;
+    dailyDigestRowTitle?: string;
+    dailyDigestRowDescription?: string;
+    collaborationSectionTitle?: string;
+    notifyMeAboutLabel?: string;
+    emailColumnLabel?: string;
+    appColumnLabel?: string;
+};
+/**
+ * Attio's "Notifications" settings page (crisp#630, P-083): title +
+ * description, a "Daily digest" card (a single toggle row), and a
+ * "Collaboration notifications" matrix — a header row plus one row per
+ * event, each with an Email and an App checkbox. Measured live.
+ */
+export declare function NotificationsSettings({ dailyDigestEnabled, onDailyDigestChange, rows, onEmailChange, onAppChange, className, title, description, learnMoreLabel, learnMoreHref, dailyDigestSectionTitle, dailyDigestRowTitle, dailyDigestRowDescription, collaborationSectionTitle, notifyMeAboutLabel, emailColumnLabel, appColumnLabel, ...rest }: NotificationsSettingsProps): React.JSX.Element;
+export declare namespace NotificationsSettings {
+    var displayName: string;
+}

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

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

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

@@ -1,8 +1,18 @@
 import { type LucideIcon } from "lucide-react";
 import * as React from "react";
+import { type CommentAuthor, type CommentThread } from "../comments";
 import { type Column, type Row } from "./column";
+/**
+ * `title` is optional (#871) — Attio's own note preview always has one (a
+ * real note defaults to "Untitled note" until renamed, confirmed live), but
+ * crisp's own data model has never carried a separate note title, only
+ * `text`, and no existing consumer supplies one. Adding it as optional
+ * rather than required keeps every existing `notes` array valid; a consumer
+ * with no title concept just gets the single remaining string inline.
+ */
 export type RecordPageNote = {
     id: string;
+    title?: string;
     text: string;
     time: string;
 };
@@ -90,6 +100,26 @@ export type RecordPageProps = Omit<React.ComponentPropsWithoutRef<"div">, "child
     /** When provided, shows a maximise/minimise button in the top bar. */
     onToggleFull?: () => void;
     full?: boolean;
+    /**
+     * The peek-style header (#624) — measured live: expanding a peek to its
+     * full record does NOT revert to the plain breadcrumb, it keeps a hybrid
+     * header (Close, Previous/Next, "N of M in <view>" counter), replacing the
+     * breadcrumb entirely rather than adding to it. Naming mirrors
+     * `RecordPanel`'s own identical props exactly (`onClose`/`closeLabel`,
+     * `onPrevious`/`previousRecordLabel`, `onNext`/`nextRecordLabel`,
+     * `counterLabel`) — a consumer wiring both components together (a list
+     * whose peek expands to this page) reuses the same handlers and state,
+     * not a second parallel API. `onClose` alone is enough to switch the
+     * topbar into this mode; Previous/Next/counter are each independently
+     * optional, same as `RecordPanel`'s own toolbar.
+     */
+    onClose?: () => void;
+    closeLabel?: string;
+    onPrevious?: () => void;
+    previousRecordLabel?: string;
+    onNext?: () => void;
+    nextRecordLabel?: string;
+    counterLabel?: React.ReactNode;
     className?: string;
     /**
      * Replaces the built-in CRM tab set. An app with a non-CRM domain (a
@@ -143,6 +173,29 @@ export type RecordPageProps = Omit<React.ComponentPropsWithoutRef<"div">, "child
      * the built-in CRM set.
      */
     highlights?: RecordPageHighlight[] | false;
+    /**
+     * Wires the header's Comments entry point (#864) to crisp's own,
+     * already-closed `product/comments` panel (#625) — the gap #864 found
+     * wasn't the comments feature itself, only that `RecordPage` never
+     * opened it. Controlled the same way `notes`/`tasks` are: supply this
+     * (even `[]`) and `onPostComment` to own the data yourself; omit both to
+     * let `RecordPage` keep a small self-contained thread list, same as its
+     * default Notes/Tasks behaviour.
+     */
+    comments?: CommentThread[];
+    onPostComment?: (text: string, threadId: string | null) => void;
+    /**
+     * Attributes a self-managed comment's `author` (id/name/avatar) — has no
+     * effect when `comments` is controlled, since then every thread's author
+     * is already the caller's own data. Defaults to a synthetic "You", same
+     * as Notes/Tasks already show for a comment-less consumer.
+     */
+    currentUser?: CommentAuthor;
+    /** Called when the header's Share button is clicked. Renders regardless
+     *  (matching Compose email/Add to list's own no-op-until-wired
+     *  convention) — Attio's own Share opens a dialog crisp has no measured
+     *  content for; only the entry point is in scope here (#864). */
+    onShare?: () => void;
 };
 /**
  * Every chrome string RecordPage renders. Supplied as a PARTIAL map, so
@@ -161,6 +214,14 @@ export type RecordPageLabels = {
     addToFavourites: string;
     removeFromFavourites: string;
     copyRecordLink: string;
+    /** "…" record actions menu (#621): configure the record page's layout. */
+    configurePage: string;
+    /** "…" record actions menu (#621): copy this page's own URL. */
+    copyPageUrl: string;
+    /** "…" record actions menu (#621): copy the record's raw id. */
+    copyRecordId: string;
+    /** "…" record actions menu (#621): merge this record into another. */
+    mergeRecords: string;
     deleteRecord: string;
     linkRecords: string;
     logANote: string;
@@ -172,6 +233,10 @@ export type RecordPageLabels = {
     composeEmail: string;
     askAttio: string;
     addToList: string;
+    /** The header's text-only Share button (#864, measured: no icon). */
+    share: string;
+    /** aria-label on the header's Comments icon button (#864). */
+    comments: string;
     /** Empty state under the Lists panel. */
     noLists: string;
     highlights: string;
@@ -234,6 +299,28 @@ export type RecordDetailsProps = Omit<React.ComponentPropsWithoutRef<"div">, "ch
     onEdit?: (id: string, key: string, value: string) => Promise<void> | void;
     labels?: RecordPageLabelsInput;
     className?: string;
+    /**
+     * Drag-to-resize (#930) — the same shape `RecordPanel`'s own resize props
+     * already have (`resizable`/`width`/`defaultWidth`/`onWidthChange`/
+     * `minWidth`/`maxWidth`), so a consumer composing `RecordDetails`
+     * standalone (GRC's own record-page rail: its own header/tabs, this
+     * component for the details column only) gets Attio's real record-page
+     * details-column resize without reimplementing the drag math `RecordPage`
+     * already has internally for its own aside. Uncontrolled by default
+     * (`defaultWidth`); pass `width`/`onWidthChange` together to own it
+     * instead — same controlled/uncontrolled split as `RecordPanel`'s.
+     * `minWidth`/`maxWidth`/`defaultWidth` default to the exact clamp
+     * `RecordPage`'s own resizer already uses (#798, live-measured: 619/1170,
+     * 734 default) — reused, not re-measured. Omit `resizable` (the default)
+     * to keep rendering the plain, non-resizing block this component has
+     * always been.
+     */
+    resizable?: boolean;
+    width?: number;
+    defaultWidth?: number;
+    onWidthChange?: (width: number) => void;
+    minWidth?: number;
+    maxWidth?: number;
 };
 /**
  * The Details column's own field list, on its own (#528) — `RecordPage`'s
@@ -256,7 +343,7 @@ export type RecordDetailsProps = Omit<React.ComponentPropsWithoutRef<"div">, "ch
  * `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 function RecordDetails({ record, columns, sections, onEdit, labels, className, resizable, width: controlledWidth, defaultWidth, onWidthChange, minWidth, maxWidth, ...rest }: RecordDetailsProps): React.JSX.Element;
 export declare namespace RecordDetails {
     var displayName: string;
 }
@@ -268,7 +355,7 @@ export declare namespace RecordDetails {
  * 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, sections, highlights: highlightsProp, quickActions: quickActionsProp, ...rest }: RecordPageProps): React.JSX.Element;
+export declare function RecordPage({ record, columns, collection, labels, onBack, onToggleFull, full, onClose, closeLabel, onPrevious, previousRecordLabel, onNext, nextRecordLabel, counterLabel, className, onEdit, tabs: tabsProp, defaultTab, notes: notesProp, onAddNote, tasks: tasksProp, onAddTask, onToggleTask, sections, highlights: highlightsProp, quickActions: quickActionsProp, comments: commentsProp, onPostComment, currentUser, onShare, ...rest }: RecordPageProps): React.JSX.Element;
 export declare namespace RecordPage {
     var displayName: string;
 }

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

@@ -0,0 +1 @@
+export { type WorkspaceExportRow, WorkspaceGeneralSettings, type WorkspaceGeneralSettingsProps, } from "./workspacegeneralsettings";

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

@@ -0,0 +1,48 @@
+import type * as React from "react";
+export type WorkspaceExportRow = {
+    id: string;
+    type: React.ReactNode;
+    date: React.ReactNode;
+};
+export type WorkspaceGeneralSettingsProps = Omit<React.ComponentPropsWithoutRef<"div">, "title"> & {
+    logoSrc?: string;
+    /** Shown in the logo tile when `logoSrc` is unset — the workspace's own initial. */
+    workspaceInitial: string;
+    onUploadLogo?: () => void;
+    name: string;
+    onNameChange: (value: string) => void;
+    slug: string;
+    onCopySlug?: () => void;
+    exports: WorkspaceExportRow[];
+    onStartExport?: () => void;
+    onDeleteWorkspace?: () => void;
+    /** Chrome strings, each overridable for non-English UIs. */
+    title?: string;
+    description?: string;
+    learnMoreLabel?: string;
+    learnMoreHref?: string;
+    logoHelpText?: string;
+    uploadLogoLabel?: string;
+    nameFieldLabel?: string;
+    slugFieldLabel?: string;
+    copySlugLabel?: string;
+    exportSectionTitle?: string;
+    exportSectionDescription?: string;
+    startExportLabel?: string;
+    typeColumnLabel?: string;
+    dateColumnLabel?: string;
+    noExportsLabel?: string;
+    dangerSectionTitle?: string;
+    deleteWorkspaceTitle?: string;
+    deleteWorkspaceWarning?: string;
+    deleteWorkspaceLabel?: string;
+};
+/**
+ * Attio's Settings → Workspace → General page (crisp#638, P-128), measured
+ * live: a logo + Name/Slug section, an "Export workspace data" table, and a
+ * "Danger zone" delete-workspace row.
+ */
+export declare function WorkspaceGeneralSettings({ logoSrc, workspaceInitial, onUploadLogo, name, onNameChange, slug, onCopySlug, exports: exportRows, onStartExport, onDeleteWorkspace, className, title, description, learnMoreLabel, learnMoreHref, logoHelpText, uploadLogoLabel, nameFieldLabel, slugFieldLabel, copySlugLabel, exportSectionTitle, exportSectionDescription, startExportLabel, typeColumnLabel, dateColumnLabel, noExportsLabel, dangerSectionTitle, deleteWorkspaceTitle, deleteWorkspaceWarning, deleteWorkspaceLabel, ...rest }: WorkspaceGeneralSettingsProps): React.JSX.Element;
+export declare namespace WorkspaceGeneralSettings {
+    var displayName: string;
+}

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

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

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

@@ -3,6 +3,8 @@ export type Theme = "light" | "dark";
 export declare const contract: MapLeafNodes<{
     bgBrandSolid: "brand600";
     bgBrandSolidPressed: "brand700";
+    bgBrandContrast: "brandContrast";
+    fgBrandContrast: "brandContrast";
     fgOnBrand: "white";
     fgOnTone: "ink";
     bgSurface: "gray00";
@@ -18,6 +20,8 @@ export declare const contract: MapLeafNodes<{
     bgTileActive: "tileActive";
     shadowTileActive: "tileActiveShadow";
     bgScrim: "bgScrim";
+    bgOverlayStrong: "bgOverlayStrong";
+    strokeGroupDivider: "strokeGroupDivider";
     fgAlertDescription: "fgAlertDescription";
     bgOverlayFrost: "overlayFrost";
     shadowOverlay1: "shadowOverlay1";
@@ -43,6 +47,7 @@ export declare const contract: MapLeafNodes<{
     strokeFocusRing: "focusRing";
     bgSuccess: "green600";
     bgWarning: "amber600";
+    bgWarningSolid: "amberSolid";
     bgOrange: "orange600";
     bgCyan: "cyan600";
     bgPurple: "purple600";
@@ -68,9 +73,10 @@ export declare const contract: MapLeafNodes<{
     shadowSelect: "selectShadow";
 }, `var(--${string})`> & {
     space: Record<"0.5" | "1" | "1.5" | "2" | "2.5" | "3" | "3.5" | "4" | "5" | "6" | "8" | "px", `var(--${string})`>;
-    radius: Record<"2xl" | "3xl" | "chip" | "full" | "lg" | "md" | "sm" | "xl", `var(--${string})`>;
+    radius: Record<"2xl" | "3xl" | "4xl" | "chip" | "full" | "lg" | "md" | "sm" | "xl" | "xs", `var(--${string})`>;
     size: Record<"calendarCell" | "calendarPill" | "chip" | "header" | "icon" | "menuRow" | "row" | "selectIconLg" | "selectTriggerLg" | "selectTriggerMd" | "tableHeader" | "tableRow", `var(--${string})`>;
     font: Record<"sans", `var(--${string})`>;
     text: Record<"lg" | "md" | "sm" | "xl" | "xs", `var(--${string})`>;
     weight: Record<"bold" | "medium" | "regular" | "semibold", `var(--${string})`>;
+    tracking: Record<"18" | "20" | "24" | "26" | "28" | "32", `var(--${string})`>;
 };

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

@@ -11,9 +11,11 @@
  */
 export declare const elevation: {
     /**
-     * Tier 1 — anything floating and *attached*: menus, popovers, dropdowns,
+     * Tier 1 — anything floating and *attached*: popovers, dropdowns,
      * hover-preview cards, the floating sidebar, the record peek, drawers, the
      * bulk bar. Pairs with a 10–12px radius and, for panels, an 8px gutter.
+     * NOT `Menu` (your-moon/crisp#934) -- that moved to
+     * `selectFloating`, seed-design's own flat shadow, below.
      */
     readonly floating: `inset 0 0 0 1px var(--${string}), 0 0 0 1px var(--${string}), 0 4px 8px -4px var(--${string}), 0 4px 12px -2px var(--${string})`;
     /**
@@ -56,10 +58,11 @@ export declare const elevation: {
      */
     readonly fieldNoRing: `0 0 2px rgba(28,40,64,0.18), 0 1px 3px rgba(0,0,0,0.04)`;
     /**
-     * Select's own listbox shadow (crisp/#867) — seed-design's `$shadow.s3`, a
-     * single layer, NOT `floating` above. This component follows seed, not
-     * Attio, for the same reason `DatePicker` follows seed's calendar
-     * structure: an explicit owner request to match seed-design exactly.
+     * Seed-design's own `$shadow.s3`, a single flat layer, NOT `floating`
+     * above. Originally Select's own listbox shadow (crisp/#867); also `Menu`'s
+     * (your-moon/crisp#934) -- the raw seed dump confirms Menu
+     * is the one component seed's own spec gives a shadow to at all, and it's
+     * this exact value. Despite the name, not exclusive to Select.
      */
     readonly selectFloating: `0 4px 16px var(--${string})`;
 };

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

@@ -12,7 +12,7 @@ export declare const palette: {
         readonly dark: "#101112";
     };
     readonly gray50: {
-        readonly light: "#f4f4f5";
+        readonly light: "#f7f8f9";
         readonly dark: "#101112";
     };
     readonly gray900: {
@@ -20,7 +20,7 @@ export declare const palette: {
         readonly dark: "#f5f5f5";
     };
     readonly line200: {
-        readonly light: "#e4e4e7";
+        readonly light: "#dcdee3";
         readonly dark: "#212224";
     };
     readonly line100: {
@@ -60,9 +60,17 @@ export declare const palette: {
         readonly dark: "rgba(0,0,0,0)";
     };
     readonly bgScrim: {
-        readonly light: "rgba(0,0,0,0.25)";
+        readonly light: "rgba(0,0,0,0.45)";
         readonly dark: "rgba(0,0,0,0.55)";
     };
+    readonly bgOverlayStrong: {
+        readonly light: "#00000074";
+        readonly dark: "#00000074";
+    };
+    readonly strokeGroupDivider: {
+        readonly light: "#00000010";
+        readonly dark: "#ffffff17";
+    };
     readonly fgAlertDescription: {
         readonly light: "rgba(0,0,0,0.63)";
         readonly dark: "rgba(255,255,255,0.6)";
@@ -108,23 +116,27 @@ export declare const palette: {
         readonly dark: "#9a9aa2";
     };
     readonly brand600: {
-        readonly light: "#266df0";
-        readonly dark: "#266df0";
+        readonly light: "#0298d9";
+        readonly dark: "#0298d9";
     };
     readonly brand700: {
-        readonly light: "#1f5fd6";
-        readonly dark: "#1f5fd6";
+        readonly light: "#0283bb";
+        readonly dark: "#0283bb";
+    };
+    readonly brandContrast: {
+        readonly light: "#0278ac";
+        readonly dark: "#0278ac";
     };
     readonly red600: {
-        readonly light: "#e5484d";
+        readonly light: "#fa342c";
         readonly dark: "#ff5a5f";
     };
     readonly red700: {
-        readonly light: "#ba2525";
+        readonly light: "#ca1d13";
         readonly dark: "#ba2525";
     };
     readonly red500: {
-        readonly light: "#eb3b3b";
+        readonly light: "#fa342c";
         readonly dark: "#ff5a5f";
     };
     readonly fieldFocus: {
@@ -160,11 +172,15 @@ export declare const palette: {
         readonly dark: "#5e98fe";
     };
     readonly green600: {
-        readonly light: "#1f9d57";
+        readonly light: "#079171";
         readonly dark: "#2ea968";
     };
     readonly amber600: {
-        readonly light: "#b5730f";
+        readonly light: "#9b7821";
+        readonly dark: "#e0982a";
+    };
+    readonly amberSolid: {
+        readonly light: "#fbdc65";
         readonly dark: "#e0982a";
     };
     readonly orange600: {

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

@@ -13,13 +13,15 @@ export declare const space: {
     readonly "8": "32px";
 };
 export declare const radius: {
-    readonly chip: "7px";
+    readonly xs: "4px";
+    readonly chip: "999px";
     readonly sm: "6px";
     readonly md: "8px";
     readonly lg: "9px";
     readonly xl: "12px";
     readonly "2xl": "16px";
     readonly "3xl": "20px";
+    readonly "4xl": "24px";
     readonly full: "999px";
 };
 export declare const size: {
@@ -52,9 +54,18 @@ export declare const weight: {
     readonly semibold: "600";
     readonly bold: "700";
 };
+export declare const tracking: {
+    readonly "18": "-0.36px";
+    readonly "20": "-0.4px";
+    readonly "24": "-0.48px";
+    readonly "26": "-0.52px";
+    readonly "28": "-0.56px";
+    readonly "32": "-0.64px";
+};
 export type SpaceKey = keyof typeof space;
 export type RadiusKey = keyof typeof radius;
 export type SizeKey = keyof typeof size;
 export type FontKey = keyof typeof font;
 export type TextKey = keyof typeof text;
 export type WeightKey = keyof typeof weight;
+export type TrackingKey = keyof typeof tracking;

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

@@ -1,6 +1,17 @@
 export declare const semantic: {
     bgBrandSolid: "brand600";
     bgBrandSolidPressed: "brand700";
+    /** your-moon/crisp#897: the AA-safe darker sibling of `bgBrandSolid` — a
+     * SOLID fill carrying white text (Button primary, Badge solid+brand,
+     * Avatar's brand tone). `bgBrandSolid` itself stays the exact brand
+     * accent (focus rings, selected states, icons, tints), unpaired with
+     * white text anywhere that matters for contrast. */
+    bgBrandContrast: "brandContrast";
+    /** your-moon/crisp#897: brand-coloured TEXT sitting on a white page
+     * (TextLink/Text's `brand` tone) — same value as `bgBrandContrast`,
+     * named separately because one's a background and one's a foreground,
+     * matching every other fg/bg pair in this file. */
+    fgBrandContrast: "brandContrast";
     fgOnBrand: "white";
     fgOnTone: "ink";
     bgSurface: "gray00";
@@ -24,6 +35,8 @@ export declare const semantic: {
     bgTileActive: "tileActive";
     shadowTileActive: "tileActiveShadow";
     bgScrim: "bgScrim";
+    bgOverlayStrong: "bgOverlayStrong";
+    strokeGroupDivider: "strokeGroupDivider";
     fgAlertDescription: "fgAlertDescription";
     bgOverlayFrost: "overlayFrost";
     shadowOverlay1: "shadowOverlay1";
@@ -60,6 +73,10 @@ export declare const semantic: {
     strokeFocusRing: "focusRing";
     bgSuccess: "green600";
     bgWarning: "amber600";
+    /** A SOLID warning fill (Badge's `variant="solid" tone="warning"`) — seed's
+     * own warning-solid is a distinct, paler yellow, not `bgWarning` tinted
+     * lighter. See `amberSolid` in palette.ts. */
+    bgWarningSolid: "amberSolid";
     bgOrange: "orange600";
     bgCyan: "cyan600";
     bgPurple: "purple600";

package/dist/wheelpicker.css

@@ -1,14 +1,16 @@
 .crisp-wheelpicker {
   position: relative; box-sizing: border-box; width: 100%; overflow: hidden; background: var(--crisp-bg-surface); font-family: var(--crisp-font-sans); /* the band the selected row sits in; behind the items, never hit-tested */
     & .crisp-wheelpicker-indicator { position: absolute; z-index: 0; inset-inline: var(--crisp-space-4); top: 50%; transform: translateY(-50%); border-radius: var(--crisp-radius-md); background: var(--crisp-bg-neutral-weak); pointer-events: none; }
-    /* fades the rows furthest from the centre, so the column reads as a wheel rather than a list. 40% of the viewport, capped, top and bottom. */
+    /* fades the rows furthest from the centre, so the column reads as a wheel
+       rather than a list. 40% of the viewport, capped, top and bottom. */
     & .crisp-wheelpicker-fog { position: relative; z-index: 1; height: 100%; overflow: hidden; mask-image: linear-gradient( to bottom, transparent 0, #000 var(--crisp-wheelpicker-fog), #000 calc(100% - var(--crisp-wheelpicker-fog)), transparent 100% ); }
     & .crisp-wheelpicker-columns { display: flex; width: 100%; height: 100%; justify-content: center; }
     & .crisp-wheelpicker-column { box-sizing: border-box; flex: 0 0 auto; width: max-content; height: 100%; overflow-x: hidden; overflow-y: auto; overscroll-behavior-y: contain; overscroll-behavior-x: none; scroll-snap-type: y mandatory; touch-action: pan-y; scrollbar-width: none; -ms-overflow-style: none; outline: none; padding-block: var(--crisp-wheelpicker-offset); }
     & .crisp-wheelpicker-column::-webkit-scrollbar { display: none; }
     & .crisp-wheelpicker-item { display: flex; align-items: center; justify-content: center; scroll-snap-align: center; user-select: none; white-space: nowrap; padding-inline: var(--crisp-space-4); color: var(--crisp-fg-disabled); background: none; border: none; font: inherit; cursor: pointer; }
     & .crisp-wheelpicker-item[data-selected] { color: var(--crisp-fg-primary); }
-    /* the ring is drawn on the SELECTED row, and only for keyboard focus: a pointer user has just tapped the row they meant and does not need it */
+    /* the ring is drawn on the SELECTED row, and only for keyboard focus:
+       a pointer user has just tapped the row they meant and does not need it */
     & .crisp-wheelpicker-column:focus-visible .crisp-wheelpicker-item[data-selected] { outline: 2px solid var(--crisp-stroke-focus-ring); outline-offset: -2px; border-radius: var(--crisp-radius-md); }
 }
 .crisp-wheelpicker--size_small {

package/dist/wheelpicker.layered.css

@@ -2,14 +2,16 @@
 .crisp-wheelpicker {
   position: relative; box-sizing: border-box; width: 100%; overflow: hidden; background: var(--crisp-bg-surface); font-family: var(--crisp-font-sans); /* the band the selected row sits in; behind the items, never hit-tested */
     & .crisp-wheelpicker-indicator { position: absolute; z-index: 0; inset-inline: var(--crisp-space-4); top: 50%; transform: translateY(-50%); border-radius: var(--crisp-radius-md); background: var(--crisp-bg-neutral-weak); pointer-events: none; }
-    /* fades the rows furthest from the centre, so the column reads as a wheel rather than a list. 40% of the viewport, capped, top and bottom. */
+    /* fades the rows furthest from the centre, so the column reads as a wheel
+       rather than a list. 40% of the viewport, capped, top and bottom. */
     & .crisp-wheelpicker-fog { position: relative; z-index: 1; height: 100%; overflow: hidden; mask-image: linear-gradient( to bottom, transparent 0, #000 var(--crisp-wheelpicker-fog), #000 calc(100% - var(--crisp-wheelpicker-fog)), transparent 100% ); }
     & .crisp-wheelpicker-columns { display: flex; width: 100%; height: 100%; justify-content: center; }
     & .crisp-wheelpicker-column { box-sizing: border-box; flex: 0 0 auto; width: max-content; height: 100%; overflow-x: hidden; overflow-y: auto; overscroll-behavior-y: contain; overscroll-behavior-x: none; scroll-snap-type: y mandatory; touch-action: pan-y; scrollbar-width: none; -ms-overflow-style: none; outline: none; padding-block: var(--crisp-wheelpicker-offset); }
     & .crisp-wheelpicker-column::-webkit-scrollbar { display: none; }
     & .crisp-wheelpicker-item { display: flex; align-items: center; justify-content: center; scroll-snap-align: center; user-select: none; white-space: nowrap; padding-inline: var(--crisp-space-4); color: var(--crisp-fg-disabled); background: none; border: none; font: inherit; cursor: pointer; }
     & .crisp-wheelpicker-item[data-selected] { color: var(--crisp-fg-primary); }
-    /* the ring is drawn on the SELECTED row, and only for keyboard focus: a pointer user has just tapped the row they meant and does not need it */
+    /* the ring is drawn on the SELECTED row, and only for keyboard focus:
+       a pointer user has just tapped the row they meant and does not need it */
     & .crisp-wheelpicker-column:focus-visible .crisp-wheelpicker-item[data-selected] { outline: 2px solid var(--crisp-stroke-focus-ring); outline-offset: -2px; border-radius: var(--crisp-radius-md); }
 }
 .crisp-wheelpicker--size_small {

package/dist/workspacegeneralsettings.css

@@ -0,0 +1,30 @@
+.crisp-workspacegeneralsettings {
+  & .crisp-workspacegeneralsettings-page { display: flex; flex-direction: column; gap: var(--crisp-space-6); font-family: var(--crisp-font-sans); }
+    & .crisp-workspacegeneralsettings-heading { display: flex; flex-direction: column; gap: var(--crisp-space-0-5); }
+    & .crisp-workspacegeneralsettings-title { font-size: 24px; line-height: 28px; font-weight: var(--crisp-weight-semibold); letter-spacing: -0.48px; color: var(--crisp-fg-primary); margin: 0; }
+    & .crisp-workspacegeneralsettings-desc { font-size: var(--crisp-text-lg); line-height: 20px; color: var(--crisp-fg-muted); margin: 0; }
+    & .crisp-workspacegeneralsettings-section { display: flex; flex-direction: column; gap: var(--crisp-space-4); }
+    & .crisp-workspacegeneralsettings-sectiontitle { font-size: 16px; line-height: 20px; font-weight: var(--crisp-weight-semibold); color: var(--crisp-fg-primary); margin: 0; }
+    & .crisp-workspacegeneralsettings-sectionhead { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--crisp-space-4); }
+    & .crisp-workspacegeneralsettings-sectionhead-text { display: flex; flex-direction: column; gap: var(--crisp-space-1); }
+    /* Logo row: a tile + helper text + "Upload logo" button. */
+    & .crisp-workspacegeneralsettings-logorow { display: flex; align-items: center; gap: var(--crisp-space-4); }
+    & .crisp-workspacegeneralsettings-logohelp { font-size: var(--crisp-text-sm); color: var(--crisp-fg-muted); }
+    & .crisp-workspacegeneralsettings-logotext { display: flex; flex-direction: column; align-items: flex-start; gap: var(--crisp-space-1); }
+    /* Name + Slug sit side by side, each ~half the content width. */
+    & .crisp-workspacegeneralsettings-fieldrow { display: flex; gap: var(--crisp-space-4); }
+    & .crisp-workspacegeneralsettings-fieldrow > * { flex: 1; min-width: 0; }
+    & .crisp-workspacegeneralsettings-slugfield { display: flex; align-items: center; gap: var(--crisp-space-1-5); }
+    & .crisp-workspacegeneralsettings-slugfield > :first-child { flex: 1; min-width: 0; }
+    & .crisp-workspacegeneralsettings-copybtn { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 32px; height: 32px; border: none; border-radius: var(--crisp-radius-md); background: none; font-family: inherit; color: var(--crisp-fg-muted); cursor: pointer; }
+    & .crisp-workspacegeneralsettings-copybtn:hover { background: var(--crisp-bg-raised); color: var(--crisp-fg-primary); }
+    /* Export-data empty state -- measured: 14/500/63%-opacity, centred in a
+       40px row, no border of its own (the Table wrapper already draws it). */
+    & .crisp-workspacegeneralsettings-emptyrow { padding: var(--crisp-space-2-5) var(--crisp-space-4); font-size: var(--crisp-text-lg); font-weight: var(--crisp-weight-medium); color: color-mix(in srgb, var(--crisp-fg-primary) 63%, transparent); text-align: center; }
+    /* Danger zone: a red-tinted bordered row, distinct from every other
+       card on the page. */
+    & .crisp-workspacegeneralsettings-dangerrow { display: flex; align-items: center; justify-content: space-between; gap: var(--crisp-space-6); padding: var(--crisp-space-3) var(--crisp-space-4); border: 1px solid color-mix(in srgb, var(--crisp-bg-danger) 30%, transparent); border-radius: 12px; background: color-mix(in srgb, var(--crisp-bg-danger) 6%, transparent); }
+    & .crisp-workspacegeneralsettings-dangertext { display: flex; flex-direction: column; gap: var(--crisp-space-1); }
+    & .crisp-workspacegeneralsettings-rowtitle { font-size: var(--crisp-text-lg); font-weight: var(--crisp-weight-medium); color: var(--crisp-fg-primary); }
+    & .crisp-workspacegeneralsettings-dangerwarning { font-size: var(--crisp-text-sm); font-weight: var(--crisp-weight-medium); color: color-mix(in srgb, var(--crisp-fg-primary) 63%, transparent); }
+}