@crisp-ui-kit/crisp 0.31.4 → 0.31.6

package/dist/esm/components/resizablepanel/resizablepanel.recipe.js

@@ -1,7 +1,7 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c, elevation as e } from "../../tokens/index.js";
-// Attio's adjustable-panel primitive (measured live — see
-// docs/study/attio-panels.md §1-2). Two elements carry the layout: an
+// The adjustable-panel primitive (measured live). Two elements carry the
+// layout: an
 // invisible SPACER that reserves flow width (it alone animates `width`, a
 // cheap reflow of a leaf node) and the PANEL, taken out of flow with
 // `position: absolute` and drawn on top of the spacer. That split is what

package/dist/esm/components/segmented/segmented.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// A segmented control — Attio's view switcher: a subtle track holding options,
+// A segmented control — a view switcher: a subtle track holding options,
 // the selected one raised on a white pill.
 const config = defineRecipe({
     name: "segmented",

package/dist/esm/components/select/select.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c, elevation as e } from "../../tokens/index.js";
-// A select / dropdown, measured from Attio's settings: a 32px combobox trigger
+// A select / dropdown, measured from settings: a 32px combobox trigger
 // (radius 9, value + a 16px chevron) over a listbox — radius 12, 4px padding, a
 // layered soft shadow — of 32px options (radius 8, 6/8 padding) that show a
 // check on the selected one and highlight on hover / keyboard. The listbox is
@@ -54,7 +54,7 @@ const config = defineRecipe({
   `,
     variants: {
         // ghost: borderless at rest (transparent), reveals a subtle fill on hover —
-        // Attio's inline selects (e.g. the sort configurator).
+        // inline selects (e.g. the sort configurator).
         variant: {
             default: "",
             ghost: `

package/dist/esm/components/slider/slider.recipe.js

@@ -2,9 +2,9 @@ import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c, elevation as e } from "../../tokens/index.js";
 // seed-design's slider, shape for shape, in crisp's colours.
 //
-// Attio ships no slider anywhere — Records, Reports, Settings and the record
+// No slider ships anywhere — Records, Reports, Settings and the record
 // pages contain no `input[type=range]` or `[role=slider]` — so there is nothing
-// of Attio's to measure. The GEOMETRY is therefore seed's own, read from
+// measured to draw from. The GEOMETRY is therefore seed's own, read from
 // `@seed-design/css/recipes/slider.css`: a 26px control row, a 4px track on
 // `radius.full`, a 20px thumb whose visible disc is an `::after` that scales to
 // 1.2 while dragging, and a 2px focus ring offset 2px.

package/dist/esm/components/stagebar/stagebar.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// A pipeline stage indicator — Attio's Deal-stage Highlight bar: one segment per
+// A pipeline stage indicator — a Deal-stage Highlight bar: one segment per
 // stage, each tinted with its stage colour, the current stage at full strength.
 const config = defineRecipe({
     name: "stagebar",

package/dist/esm/components/statcard/statcard.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// A single-metric KPI tile — measured from Attio's Reports "Insight" number
+// A single-metric KPI tile — measured from a Reports "Insight" number
 // report: a small muted label, a large semibold value, and an optional delta
 // pill (green up / red down) with a caption. Fills its container.
 const config = defineRecipe({
@@ -18,7 +18,7 @@ const config = defineRecipe({
     & .statcard-delta[data-trend="flat"] { background: color-mix(in srgb, ${c.fgPrimary} 6%, transparent); color: ${c.fgMuted}; }`,
     variants: {
         // Opt-in chrome for consumers who want the tile self-contained instead of
-        // hand-wrapping it in <Card><CardBody>. Not measured as part of the Attio
+        // hand-wrapping it in <Card><CardBody>. Not measured as part of the
         // report tile itself (the tile sits bare inside the report's own Card —
         // see the docs page) — reuses Card's exact border/radius/bg rather than
         // inventing a new value, since it is only ever an explicit opt-in.

package/dist/esm/components/switch/switch.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// Attio's settings toggle, measured from the live app: a 24×16 pill track that
+// A settings toggle, measured from the live app: a 24×16 pill track that
 // flips from a muted grey to brand blue (#266df0), with a 12px white thumb
 // (2px inset) that slides 8px across. background + transform both animate .2s.
 const config = defineRecipe({

package/dist/esm/components/table/table.recipe.js

@@ -2,7 +2,7 @@ import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
 // A general-purpose, composable data table — the lightweight primitive for
 // arbitrary tabular data (as opposed to `product/recordstable`, which is a
-// faithful rebuild of Attio's heavy records grid). It carries the SAME measured
+// faithful rebuild of a heavy records grid). It carries the SAME measured
 // grid styling as RecordsTable — 36px rows, a 40px header, hairline vertical +
 // horizontal grid lines — so `DataTable` (built on this) matches that polish.
 const config = defineRecipe({

package/dist/esm/components/tabletoolbar/tabletoolbar.chrome.js

@@ -1,12 +1,12 @@
 import { contract as c, elevation as e } from "../../tokens/index.js";
-// The measured chrome of Attio's table toolbar: the Sort/Filter controls, the
+// The measured chrome of the table toolbar: the Sort/Filter controls, the
 // menu/popover surface they open into, the sort-condition rows, and the filter
 // chips. It lives here, parameterised by class prefix, because TWO surfaces
 // render it — the standalone `TableToolbar` primitive and `RecordsTable`, whose
 // markup predates it and must keep its own `recordstable-` class names.
 //
 // These strings were MOVED out of `recordstable.recipe.ts` verbatim, not
-// retyped: every value is still the one measured from Attio. Do not "tidy" them.
+// retyped: every value is still the one originally measured. Do not "tidy" them.
 //
 // It comes in two halves because RecordsTable interleaves three rules of its own
 // (the context-menu z-index and the column drop-target) into the middle of the

package/dist/esm/components/tabletoolbar/tabletoolbar.recipe.js

@@ -1,7 +1,7 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
 import { toolbarChromeBody, toolbarChromeHead } from "./tabletoolbar.chrome.js";
-// Attio's table toolbar, measured: 28px controls, the Sort/Filter buttons and
+// The table toolbar, measured: 28px controls, the Sort/Filter buttons and
 // the menus they open, sort-condition rows, and the filter chips. The chrome
 // itself lives in ./tabletoolbar.chrome.ts because RecordsTable renders the
 // same measured surface under its own class prefix — one source, two prefixes,

package/dist/esm/components/tabs/tabs.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// Attio's record-view tabs: a row of segmented tab buttons over a 1px baseline.
+// Record-view tabs: a row of segmented tab buttons over a 1px baseline.
 // The active tab is a light pill — bg #fbfbfb + inset ring borderSubtle, r8 —
 // with a 2px ink underline that slides along the baseline; inactive tabs are
 // muted and fill to a subtle pill on hover. Each tab carries a 16px leading icon

package/dist/esm/components/textarea/textarea.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c, elevation as e } from "../../tokens/index.js";
-// A multiline text field, measured from Attio's settings "Personal context": an
+// A multiline text field, measured from a settings "Personal context" field: an
 // inset 1px ring (radius 8), 14px text, 6/10 padding, and an optional character
 // counter pinned bottom-right (12px, muted). Focus rings the field brand.
 const config = defineRecipe({

package/dist/esm/components/tooltip/tooltip.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// The floating bubble for a Tooltip — Attio's dark hint chip. Applied to the
+// The floating bubble for a Tooltip — a dark hint chip. Applied to the
 // portaled bubble itself (not a wrapper), so its styles survive the portal.
 const config = defineRecipe({
     name: "tooltip",

package/dist/esm/core/dialog-description.js

@@ -1,7 +1,7 @@
 /**
  * Zag's dialog machine always advertises a description: `getContentProps()`
  * returns an `aria-describedby` pointing at the id of a description element.
- * crisp renders no such element — Attio's modals have a title and a body, no
+ * crisp renders no such element — the measured modals have a title and a body, no
  * description line — so the reference dangles, and a dangling id is not a
  * relationship a screen reader can follow.
  *

package/dist/esm/index.js

@@ -54,7 +54,7 @@ export * from "./components/tooltip/index.js";
 export * from "./components/wheelpicker/index.js";
 export * from "./core/index.js";
 // product surfaces (product/) — faithful, pixel-measured rebuilds of specific
-// Attio screens (Sidebar, RecordsTable, RecordPage, Inbox, …). Use them as-is
+// product screens (Sidebar, RecordsTable, RecordPage, Inbox, …). Use them as-is
 // or as composition references for your own data; `components/` above holds
 // the generic primitives (Table, DataTable, Button, …) to build your own UI from.
 export * from "./product/appshell/index.js";

package/dist/esm/product/appshell/appshell.recipe.js

@@ -1,7 +1,7 @@
 import { defineRecipe, resolveRecipe, rtlFlipCss } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
 // App-shell layout: a collapsible + resizable sidebar pane next to a main pane,
-// mirroring how Attio's window works. The sidebar pane clips (never squishes)
+// mirroring a familiar app-window layout. The sidebar pane clips (never squishes)
 // when collapsing, and a drag handle on its edge resizes it.
 const config = defineRecipe({
     name: "appshell",

package/dist/esm/product/authshell/authshell.recipe.js

@@ -1,11 +1,11 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// Attio's welcome/auth surface (app.attio.com/welcome/*) — measured live,
+// A welcome/auth surface — measured live,
 // 2026-09-15. A centered page frame holding a two-pane card: the form on the
 // left, an optional product preview on the right, with an optional top
 // progress bar and a footer under the card. Every value below is measured
 // from the live app, EXCEPT the 1200px preview-hiding breakpoint (called out
-// at the container query below) — Attio drops the pane in JS somewhere between a
+// at the container query below) — the pane drops out in JS somewhere between a
 // measured 954px and 1393px viewport width, so 1200px is chosen, not measured.
 const config = defineRecipe({
     name: "authshell",
@@ -48,7 +48,7 @@ const config = defineRecipe({
     & .authshell-body .button { height: 36px; padding-inline: ${c.space["3"]}; border-radius: 10px; }
     & .authshell-body .button--intent_primary { box-shadow: inset 0 0 0 1px rgba(0,0,0,0.06), 0 2px 4px -2px rgba(38,109,240,0.12), 0 3px 6px -2px rgba(38,109,240,0.08); }
 
-    /* Attio drops the preview pane in JS on narrow viewports (measured: two
+    /* The preview pane drops out in JS on narrow viewports (measured: two
        panes at 1393px, one at 954px), so 1200px is a chosen threshold inside
        that bracket, not a measured value. A CONTAINER query, not a media
        query: the shell is embedded in the docs inside an ~800px column, where

package/dist/esm/product/board/board.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// A kanban board — measured from Attio's Deals pipeline: horizontally scrolling
+// A kanban board — measured from a Deals pipeline: horizontally scrolling
 // columns (dot + title + count header, a "New" button, a stack of draggable
 // cards), with the hovered drop column highlighted.
 const config = defineRecipe({

package/dist/esm/product/entitycard/entitycard.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// A note / entity card — measured from Attio's Notes grid: a bordered white card
+// A note / entity card — measured from a Notes grid: a bordered white card
 // with an author row (avatar + name) at the top, a title, a clamped excerpt,
 // and a footer row (avatar + name … date). The whole card is clickable.
 const config = defineRecipe({

package/dist/esm/product/flowcanvas/flowcanvas.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// A pannable, zoomable node canvas — measured from Attio's Workflows editor:
+// A pannable, zoomable node canvas — measured from a Workflows editor:
 // a dotted-grid background, draggable node cards, and connecting edges with dots.
 const config = defineRecipe({
     name: "flowcanvas",

package/dist/esm/product/inbox/inbox.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// A notifications inbox panel — measured from Attio's notification flyout: a
+// A notifications inbox panel — measured from a notification flyout: a
 // ~380px rounded panel with a title, "Notifications / Requests" tabs (with
 // counts), then notification rows (avatar + message + time + unread dot) or a
 // centred empty state. Drop it in a Popover for the flyout, or use standalone.

package/dist/esm/product/listpage/listpage.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// The entity-list page shell — measured from Attio's Reports / Sequences / Tasks
+// The entity-list page shell — measured from Reports / Sequences / Tasks
 // / Notes list views: a view-bar toolbar (leading Sort/Filter, trailing view
 // toggle / settings / New, and a record count), an optional dashed "Favorites"
 // region, then a list with column headers and time-grouped 52px rows.

package/dist/esm/product/onboarding/onboarding.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// An onboarding checklist card — measured from Attio's floating "Getting started"
+// An onboarding checklist card — measured from a floating "Getting started"
 // widget: a title + menu/minimize header, a "N/total steps" subtitle, a
 // segmented progress bar (filled pills brand, rest 4% ink), then step rows with
 // an icon + label; completed rows strike through and show a brand check.

package/dist/esm/product/recordpage/recordpage.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c, elevation as e } from "../../tokens/index.js";
-// The full-page company record view Attio opens when you click into a record —
+// The full-page company record view opened when you click into a record —
 // measured from the live app. A slim top bar (breadcrumb · logo · name 16/600 ·
 // actions), then a two-column body: a 320px left "Record Details" attribute
 // column (transparent, border-right) and a flexible main area whose tab bar
@@ -50,7 +50,7 @@ const config = defineRecipe({
     & .recordpage-section { padding-top: ${c.space["2"]}; }
     & .recordpage-section-title { font-size: ${c.text.sm}; font-weight: ${c.weight.medium}; letter-spacing: -0.12px; color: color-mix(in srgb, ${c.fgPrimary} 63%, transparent); padding: ${c.space["1"]}; }
     /* main-area section headers (Highlights / Activity / Emails / Notes / Tasks)
-       are 14px in Attio; the left column's (Record Details / Lists) stay 12px. */
+       are 14px; the left column's (Record Details / Lists) stay 12px. */
     & .recordpage-main .recordpage-section-title { font-size: ${c.text.lg}; }
     & .recordpage-detailhead { display: flex; align-items: center; gap: ${c.space["0.5"]}; margin-bottom: ${c.space["3"]}; padding-inline-end: ${c.space["0.5"]}; }
     & .recordpage-collapse { display: inline-flex; align-items: center; gap: 2px; flex: 1; min-width: 0; margin: 0; border: none; background: none; padding: ${c.space["1"]}; border-radius: ${c.radius.md}; font-family: inherit; font-size: ${c.text.sm}; font-weight: ${c.weight.medium}; letter-spacing: -0.12px; color: ${c.fgMuted}; cursor: pointer; text-align: start; }

package/dist/esm/product/recordpanel/recordpanel.recipe.js

@@ -2,7 +2,7 @@ import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c, elevation as e } from "../../tokens/index.js";
 import { recordTagCss } from "../recordstable/recordstable.tag.js";
 // A right-side record peek panel — slides in over the main content to show one
-// record's fields, the way Attio opens a row. Positioned absolutely inside a
+// record's fields, the way a row peek panel opens. Positioned absolutely inside a
 // relative container (the app main area); slides in via @starting-style.
 const config = defineRecipe({
     name: "recordpanel",

package/dist/esm/product/recordstable/recordstable.recipe.js

@@ -2,7 +2,7 @@ import { toolbarChromeBody, toolbarChromeHead, } from "../../components/tabletoo
 import { defineRecipe, resolveRecipe, rtlFlipCss } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
 import { recordTagCss } from "./recordstable.tag.js";
-// Attio's record grid, measured: 36px rows, 1px borderSubtle (#eeeff1) grid
+// A record grid, measured: 36px rows, 1px borderSubtle (#eeeff1) grid
 // lines on BOTH axes, sticky checkbox + entity (first) columns, entity = 16px
 // avatar + 14px/500 name, 28px toolbar controls, a floating bulk-action bar.
 //
@@ -112,7 +112,7 @@ ${toolbarChromeBody("recordstable")}
     /* box-shadow has no logical form either: the bleed follows the scrolled
        content, which is the opposite side under RTL. */
     [dir="rtl"] & .recordstable-scroll[data-scrolled] .recordstable-col-entity { box-shadow: -6px 0 16px 4px rgba(0,0,0,0.12); }
-    /* AI-enriched values carry a purple wash. Measured from Attio:
+    /* AI-enriched values carry a purple wash. Measured live:
        a full-bleed overlay at #9b69ff 4% (== bgPurple), composited OVER
        whatever row-state background the cell already has, which is why it
        is an ::after and not a background. */

package/dist/esm/product/recordstable/recordstable.tag.js

@@ -1,6 +1,6 @@
 import { contract as c } from "../../tokens/index.js";
 /**
- * The record tag/chip, measured from Attio: 22px tall, `padding: 0 4px`,
+ * The record tag/chip, measured live: 22px tall, `padding: 0 4px`,
  * `border-radius: ${c.radius.chip}`, 14px/20px at weight 500, and a 1px inset ring in the
  * tone's colour.
  *

package/dist/esm/product/richtext/richtext.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// A block rich-text editor — measured from Attio's Notes editor: a large 32/36
+// A block rich-text editor — measured from a Notes editor: a large 32/36
 // title, a 14/20 prose body (headings, lists, quote, code, marks, links), and a
 // floating selection toolbar. Built on contentEditable so it stays dependency-
 // free. Placeholders show via [data-empty]::before.

package/dist/esm/product/settingssection/settingssection.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// A settings section — measured from Attio's Settings pages: a 16px/600 title
+// A settings section — measured from Settings pages: a 16px/600 title
 // with an optional subtitle, then a stack of rows (form fields, toggles…). Rows
 // gap evenly; an optional trailing action sits on the title row.
 const config = defineRecipe({

package/dist/esm/product/settingsshell/settingsshell.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe, rtlFlipCss } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// The Settings layout — measured from Attio's Settings: a 256px left nav with a
+// The Settings layout — measured from a Settings screen: a 256px left nav with a
 // back header, a search field, and grouped nav items (active row raised), beside
 // a scrolling content pane. Sits inside whatever height its container gives it.
 const config = defineRecipe({
@@ -15,7 +15,7 @@ const config = defineRecipe({
 
     & .settingsshell-search { display: flex; align-items: center; gap: ${c.space["2"]}; height: 32px; margin-bottom: ${c.space["2"]}; padding: 0 ${c.space["2.5"]}; border-radius: ${c.radius.md}; background: ${c.bgSurface}; box-shadow: inset 0 0 0 1px ${c.borderDefault}; color: ${c.fgMuted}; }
     /* The field box owns the ring, so focus has to move it -- the inner
-       input kills its own outline. Measured on Attio: a focused field's
+       input kills its own outline. Measured live: a focused field's
        input carries box-shadow: none while its wrapper carries
        inset 0 0 0 1px #266df0. */
     & .settingsshell-search:focus-within { box-shadow: inset 0 0 0 1px ${c.bgBrandSolid}; }

package/dist/esm/product/tasklist/tasklist.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// A task list — measured from Attio's Tasks page: optional group headers, then
+// A task list — measured from a Tasks page: optional group headers, then
 // rows of a round complete-checkbox + title + trailing meta (due date, record,
 // assignee). Completed rows strike through; overdue due-dates go red.
 const config = defineRecipe({

package/dist/esm/product/trialbanner/trialbanner.recipe.js

@@ -1,8 +1,8 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c, elevation as e } from "../../tokens/index.js";
-// A compact trial / upgrade banner — measured from Attio's sidebar footer: an
+// A compact trial / upgrade banner — measured from a sidebar footer: an
 // icon + a message on the left and a small action pill on the right, in a 28px
-// row. The action uses Attio's soft-glow outlined-button shadow.
+// row. The action uses the measured soft-glow outlined-button shadow.
 const config = defineRecipe({
     name: "trialbanner",
     base: `display: flex; align-items: center; gap: ${c.space["1.5"]}; box-sizing: border-box; min-height: 28px;

package/dist/esm/product/viewtoggle/viewtoggle.recipe.js

@@ -1,6 +1,6 @@
 import { defineRecipe, resolveRecipe } from "../../core/index.js";
 import { contract as c } from "../../tokens/index.js";
-// A compact icon toggle — measured from Attio's list/grid switch: a 28px track
+// A compact icon toggle — measured from a list/grid switch: a 28px track
 // (radius 10, ~5% ink) padded 2px, holding 24px icon tiles (radius 8). The
 // selected tile gets a raised surface with a soft shadow.
 const config = defineRecipe({

package/dist/esm/tokens/elevation.js

@@ -1,9 +1,9 @@
 import { contract as c } from "./contract.js";
 /**
- * Attio's measured elevation recipes, written **once**.
+ * The measured elevation recipes, written **once**.
  *
  * The whole product runs on two elevation tiers plus one control shadow
- * (measured live — see `docs/study/attio-panels.md` §4). Before this module each
+ * (measured live — see the panels study §4). Before this module each
  * surface carried its own copy of the string: the tier-1 stack appeared in 9
  * places, the control shadow in 12. Copies drift, and every drift was a real
  * bug — `Drawer`/`RecordPanel` grew invented directional shadows, `BulkBar`'s
@@ -20,14 +20,14 @@ export const elevation = {
     /**
      * Tier 2 — the modal frosted bezel (Dialog, Command). Sits on the
      * `bgOverlayFrost` 60% + `blur(15px)` surface at radius 16, wrapping an inner
-     * card at radius 12. Attio dims nothing behind it; the blur does the work.
+     * card at radius 12. Nothing is dimmed behind it; the blur does the work.
      */
     modal: `0 8px 28px -6px ${c.shadowOverlay1}, 0 18px 88px -4px ${c.shadowOverlay2}, 0 0 1px ${c.shadowOverlay3}`,
     /**
      * The neutral/outlined control shadow — buttons, inputs, textareas, the
      * sidebar search, record-page actions.
      *
-     * The two raw values **are** the measured Attio value (Lessons 22 and 29) and
+     * The two raw values **are** the measured value (Lessons 22 and 29) and
      * must stay raw. `rgba(0,0,0,0.04)` equals `tileActiveShadow`'s light value by
      * coincidence, not by meaning; tokenizing it would delete a measured layer in
      * dark mode. Only the ring is theme-aware, via `ringNeutral`.

package/dist/esm/tokens/palette.js

@@ -2,7 +2,7 @@ export const palette = {
     gray00: { light: "#ffffff", dark: "#0a0a0a" },
     white: { light: "#ffffff", dark: "#ffffff" },
     // the counterpart to `white`: ink that does NOT flip with the theme, for text
-    // on a bright tone fill. Same value as gray900's light side (Attio's measured
+    // on a bright tone fill. Same value as gray900's light side (the measured
     // near-black), named separately because its job is not "primary foreground".
     ink: { light: "#101112", dark: "#101112" },
     gray50: { light: "#f4f4f5", dark: "#101112" },
@@ -28,7 +28,7 @@ export const palette = {
     // A red dark enough to carry white text. red600 cannot: white on it is
     // 3.91:1 light / 3.05:1 dark, and the solid button's hover DARKENS the fill
     // (filter: brightness), so dark ink fails there instead (4.49 at hover).
-    // Measured from Attio's own stylesheet, which ships this red alongside the
+    // Measured from the reference stylesheet, which ships this red alongside the
     // #EB3B3B it uses for destructive menu TEXT. Does not flip: a filled
     // destructive control needs the same white-bearing fill in both themes.
     red700: { light: "#ba2525", dark: "#ba2525" },

package/dist/esm/tokens/scale.js

@@ -2,7 +2,7 @@
 // component sizing. Theme-invariant (identical in light/dark), so it is emitted
 // once into :root, unlike the color tokens which flip per theme.
 //
-// Derived by measuring the live Attio app (not taste): its spacing is a
+// Derived by measuring a live production app (not taste): its spacing is a
 // 2px-granular / 4px-base scale — the values 1,2,4,6,8,10,12,16 account for
 // nearly every gap/pad/margin in the sidebar. Radii cluster at 6/8/9 + a pill.
 // Recipes MUST reference these through the contract (`c.space[...]`), never a
@@ -22,10 +22,10 @@ export const space = {
     "6": "24px",
     "8": "32px", // overlay / empty-state padding
 };
-// Corner radius. sm/md/lg are the three Attio uses on stacked surfaces
+// Corner radius. sm/md/lg are the three used on stacked surfaces
 // (inputs, rows, tiles); full is the pill.
 export const radius = {
-    chip: "7px", // tag / chip corner — the single most used radius in Attio
+    chip: "7px", // tag / chip corner — the single most used radius
     sm: "6px", // chips, badges
     md: "8px", // inputs, search box
     lg: "9px", // rows, tiles, list items
@@ -37,20 +37,20 @@ export const radius = {
 // radius (row height, header height, the nav icon box).
 export const size = {
     icon: "16px", // nav / control glyph box
-    chip: "22px", // tag / chip height — Attio's most repeated small control
+    chip: "22px", // tag / chip height — the most repeated small control
     row: "28px", // nav item · search · control height
     menuRow: "32px", // overlay row: menu item, select option, bulk-bar button
     tableRow: "36px", // data-grid row height
     tableHeader: "40px", // data-grid header row height
     header: "48px", // workspace-switcher header height
-    // Attio's date picker, measured: a 32px day with a 2px gap on both axes, so
+    // The measured date picker: a 32px day with a 2px gap on both axes, so
     // the pitch is 34. The gap is expressed as the cell being 2px taller than the
     // highlight rather than as a grid gap, because crisp's range bridge spans
     // whole cells and a column gap would cut it.
     calendarCell: "34px", // calendar day pitch (32px day + 2px gap)
     calendarPill: "32px", // the day highlight itself
 };
-// Typography — Attio's UI runs entirely on Inter. Sizes measured in the sidebar
+// Typography — the measured UI runs entirely on Inter. Sizes measured in the sidebar
 // collapse onto 11/12/13/14/16 (lg = 14px is the default body/label size);
 // weights are 400/500/600 with 500 the UI default.
 export const font = {

package/dist/esm/tokens/semantic.js

@@ -48,7 +48,7 @@ export const semantic = {
     bgCyan: "cyan600",
     bgPurple: "purple600",
     bgSidebar: "graySidebar",
-    // #fbfbfb — Attio's subtle raised fill; the active tab pill uses the same
+    // #fbfbfb — the subtle raised fill; the active tab pill uses the same
     // value as the sidebar, so it shares the palette entry under a neutral name.
     bgSubtle: "graySidebar",
 };

package/dist/fileupload.css

@@ -23,12 +23,12 @@
     & .fileupload-zone[data-disabled] { opacity: .5; cursor: not-allowed; }
     & .fileupload-zone[data-invalid] { border-color: var(--bg-danger); }
 
-    /* Attio: "No files" 16/20 weight 600 */
+    /* "No files" 16/20 weight 600 */
     & .fileupload-title {
       color: var(--fg-primary); font-size: var(--text-xl); line-height: 20px;
       font-weight: var(--weight-semibold);
     }
-    /* Attio: the hint line, 14/20 weight 500 at 63% of the foreground */
+    /* The hint line, 14/20 weight 500 at 63% of the foreground */
     & .fileupload-hint {
       color: color-mix(in srgb, var(--fg-primary) 63%, transparent);
       font-size: var(--text-lg); line-height: 20px;

package/dist/recordpage.css

@@ -41,7 +41,7 @@
     & .recordpage-section { padding-top: var(--space-2); }
     & .recordpage-section-title { font-size: var(--text-sm); font-weight: var(--weight-medium); letter-spacing: -0.12px; color: color-mix(in srgb, var(--fg-primary) 63%, transparent); padding: var(--space-1); }
     /* main-area section headers (Highlights / Activity / Emails / Notes / Tasks)
-       are 14px in Attio; the left column's (Record Details / Lists) stay 12px. */
+       are 14px; the left column's (Record Details / Lists) stay 12px. */
     & .recordpage-main .recordpage-section-title { font-size: var(--text-lg); }
     & .recordpage-detailhead { display: flex; align-items: center; gap: var(--space-0-5); margin-bottom: var(--space-3); padding-inline-end: var(--space-0-5); }
     & .recordpage-collapse { display: inline-flex; align-items: center; gap: 2px; flex: 1; min-width: 0; margin: 0; border: none; background: none; padding: var(--space-1); border-radius: var(--radius-md); font-family: inherit; font-size: var(--text-sm); font-weight: var(--weight-medium); letter-spacing: -0.12px; color: var(--fg-muted); cursor: pointer; text-align: start; }

package/dist/recordstable.css

@@ -167,7 +167,7 @@
     /* box-shadow has no logical form either: the bleed follows the scrolled
        content, which is the opposite side under RTL. */
     [dir="rtl"] & .recordstable-scroll[data-scrolled] .recordstable-col-entity { box-shadow: -6px 0 16px 4px rgba(0,0,0,0.12); }
-    /* AI-enriched values carry a purple wash. Measured from Attio:
+    /* AI-enriched values carry a purple wash. Measured live:
        a full-bleed overlay at #9b69ff 4% (== bgPurple), composited OVER
        whatever row-state background the cell already has, which is why it
        is an ::after and not a background. */

package/dist/settingsshell.css

@@ -9,7 +9,7 @@
 
     & .settingsshell-search { display: flex; align-items: center; gap: var(--space-2); height: 32px; margin-bottom: var(--space-2); padding: 0 var(--space-2-5); border-radius: var(--radius-md); background: var(--bg-surface); box-shadow: inset 0 0 0 1px var(--border-default); color: var(--fg-muted); }
     /* The field box owns the ring, so focus has to move it -- the inner
-       input kills its own outline. Measured on Attio: a focused field's
+       input kills its own outline. Measured live: a focused field's
        input carries box-shadow: none while its wrapper carries
        inset 0 0 0 1px #266df0. */
     & .settingsshell-search:focus-within { box-shadow: inset 0 0 0 1px var(--bg-brand-solid); }