@crisp-ui-kit/crisp 0.31.3 → 0.31.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (138) hide show
  1. package/dist/cjs/components/accordion/accordion.js +1 -1
  2. package/dist/cjs/components/avatargroup/avatargroup.js +1 -1
  3. package/dist/cjs/components/barchart/barchart.js +1 -1
  4. package/dist/cjs/components/breadcrumb/breadcrumb.js +1 -1
  5. package/dist/cjs/components/bulkbar/bulkbar.js +1 -1
  6. package/dist/cjs/components/callout/callout.js +1 -1
  7. package/dist/cjs/components/checkbox/checkbox.js +1 -1
  8. package/dist/cjs/components/columncalc/columncalc.js +2 -2
  9. package/dist/cjs/components/datatable/datatable.js +5 -5
  10. package/dist/cjs/components/datepickerfield/datepickerfield.js +1 -1
  11. package/dist/cjs/components/dialog/dialog.js +1 -1
  12. package/dist/cjs/components/donutchart/donutchart.js +1 -1
  13. package/dist/cjs/components/fileupload/fileupload.js +1 -1
  14. package/dist/cjs/components/formfield/formfield.js +1 -1
  15. package/dist/cjs/components/linechart/linechart.js +1 -1
  16. package/dist/cjs/components/menu/menu.js +1 -1
  17. package/dist/cjs/components/multiselect/multiselect.js +1 -1
  18. package/dist/cjs/components/radiogroup/radiogroup.js +1 -1
  19. package/dist/cjs/components/resizablepanel/resizablepanel.js +1 -1
  20. package/dist/cjs/components/segmented/segmented.js +1 -1
  21. package/dist/cjs/components/select/select.js +1 -1
  22. package/dist/cjs/components/stagebar/stagebar.js +1 -1
  23. package/dist/cjs/components/statcard/statcard.js +1 -1
  24. package/dist/cjs/components/switch/switch.js +1 -1
  25. package/dist/cjs/components/tabletoolbar/tabletoolbar.js +2 -2
  26. package/dist/cjs/components/tabs/tabs.js +2 -2
  27. package/dist/cjs/components/textarea/textarea.js +1 -1
  28. package/dist/cjs/components/tooltip/tooltip.js +1 -1
  29. package/dist/cjs/product/appshell/appshell.js +4 -4
  30. package/dist/cjs/product/authshell/authshell.js +1 -1
  31. package/dist/cjs/product/board/board.js +1 -1
  32. package/dist/cjs/product/command/command.js +1 -1
  33. package/dist/cjs/product/entitycard/entitycard.js +1 -1
  34. package/dist/cjs/product/flowcanvas/flowcanvas.js +1 -1
  35. package/dist/cjs/product/inbox/inbox.js +1 -1
  36. package/dist/cjs/product/listpage/listpage.js +1 -1
  37. package/dist/cjs/product/onboarding/onboarding.js +1 -1
  38. package/dist/cjs/product/recordpage/recordpage.js +7 -7
  39. package/dist/cjs/product/recordstable/recordstable.js +9 -9
  40. package/dist/cjs/product/richtext/richtext.js +1 -1
  41. package/dist/cjs/product/settingssection/settingssection.js +1 -1
  42. package/dist/cjs/product/settingsshell/settingsshell.js +1 -1
  43. package/dist/cjs/product/sidebar/sidebar.js +6 -6
  44. package/dist/cjs/product/tasklist/tasklist.js +1 -1
  45. package/dist/cjs/product/trialbanner/trialbanner.js +1 -1
  46. package/dist/cjs/product/viewtoggle/viewtoggle.js +1 -1
  47. package/dist/esm/components/accordion/accordion.js +1 -1
  48. package/dist/esm/components/avatargroup/avatargroup.js +1 -1
  49. package/dist/esm/components/barchart/barchart.js +1 -1
  50. package/dist/esm/components/breadcrumb/breadcrumb.js +1 -1
  51. package/dist/esm/components/bulkbar/bulkbar.js +1 -1
  52. package/dist/esm/components/callout/callout.js +1 -1
  53. package/dist/esm/components/checkbox/checkbox.js +1 -1
  54. package/dist/esm/components/columncalc/columncalc.js +2 -2
  55. package/dist/esm/components/datatable/datatable.js +5 -5
  56. package/dist/esm/components/datepickerfield/datepickerfield.js +1 -1
  57. package/dist/esm/components/dialog/dialog.js +1 -1
  58. package/dist/esm/components/donutchart/donutchart.js +1 -1
  59. package/dist/esm/components/fileupload/fileupload.js +1 -1
  60. package/dist/esm/components/formfield/formfield.js +1 -1
  61. package/dist/esm/components/linechart/linechart.js +1 -1
  62. package/dist/esm/components/menu/menu.js +1 -1
  63. package/dist/esm/components/multiselect/multiselect.js +1 -1
  64. package/dist/esm/components/radiogroup/radiogroup.js +1 -1
  65. package/dist/esm/components/resizablepanel/resizablepanel.js +1 -1
  66. package/dist/esm/components/segmented/segmented.js +1 -1
  67. package/dist/esm/components/select/select.js +1 -1
  68. package/dist/esm/components/stagebar/stagebar.js +1 -1
  69. package/dist/esm/components/statcard/statcard.js +1 -1
  70. package/dist/esm/components/switch/switch.js +1 -1
  71. package/dist/esm/components/tabletoolbar/tabletoolbar.js +2 -2
  72. package/dist/esm/components/tabs/tabs.js +2 -2
  73. package/dist/esm/components/textarea/textarea.js +1 -1
  74. package/dist/esm/components/tooltip/tooltip.js +1 -1
  75. package/dist/esm/product/appshell/appshell.js +4 -4
  76. package/dist/esm/product/authshell/authshell.js +1 -1
  77. package/dist/esm/product/board/board.js +1 -1
  78. package/dist/esm/product/command/command.js +1 -1
  79. package/dist/esm/product/entitycard/entitycard.js +1 -1
  80. package/dist/esm/product/flowcanvas/flowcanvas.js +1 -1
  81. package/dist/esm/product/inbox/inbox.js +1 -1
  82. package/dist/esm/product/listpage/listpage.js +1 -1
  83. package/dist/esm/product/onboarding/onboarding.js +1 -1
  84. package/dist/esm/product/recordpage/recordpage.js +7 -7
  85. package/dist/esm/product/recordstable/recordstable.js +9 -9
  86. package/dist/esm/product/richtext/richtext.js +1 -1
  87. package/dist/esm/product/settingssection/settingssection.js +1 -1
  88. package/dist/esm/product/settingsshell/settingsshell.js +1 -1
  89. package/dist/esm/product/sidebar/sidebar.js +6 -6
  90. package/dist/esm/product/tasklist/tasklist.js +1 -1
  91. package/dist/esm/product/trialbanner/trialbanner.js +1 -1
  92. package/dist/esm/product/viewtoggle/viewtoggle.js +1 -1
  93. package/dist/types/components/avatargroup/avatargroup.d.ts +1 -1
  94. package/dist/types/components/barchart/barchart.d.ts +1 -1
  95. package/dist/types/components/breadcrumb/breadcrumb.d.ts +1 -1
  96. package/dist/types/components/bulkbar/bulkbar.d.ts +1 -1
  97. package/dist/types/components/callout/callout.d.ts +1 -1
  98. package/dist/types/components/checkbox/checkbox.d.ts +1 -1
  99. package/dist/types/components/columncalc/columncalc.d.ts +5 -5
  100. package/dist/types/components/datatable/datatable.d.ts +5 -5
  101. package/dist/types/components/datepickerfield/datepickerfield.d.ts +1 -1
  102. package/dist/types/components/dialog/dialog.d.ts +1 -1
  103. package/dist/types/components/donutchart/donutchart.d.ts +1 -1
  104. package/dist/types/components/emptystate/emptystate.d.ts +1 -1
  105. package/dist/types/components/formfield/formfield.d.ts +1 -1
  106. package/dist/types/components/linechart/linechart.d.ts +1 -1
  107. package/dist/types/components/menu/menu.d.ts +1 -1
  108. package/dist/types/components/multiselect/multiselect.d.ts +1 -1
  109. package/dist/types/components/progress/progress.d.ts +1 -1
  110. package/dist/types/components/radiogroup/radiogroup.d.ts +1 -1
  111. package/dist/types/components/resizablepanel/resizablepanel.d.ts +4 -4
  112. package/dist/types/components/segmented/segmented.d.ts +1 -1
  113. package/dist/types/components/select/select.d.ts +2 -2
  114. package/dist/types/components/stagebar/stagebar.d.ts +1 -1
  115. package/dist/types/components/statcard/statcard.d.ts +1 -1
  116. package/dist/types/components/switch/switch.d.ts +1 -1
  117. package/dist/types/components/tabletoolbar/tabletoolbar.d.ts +1 -1
  118. package/dist/types/components/tabs/tabs.d.ts +2 -2
  119. package/dist/types/components/textarea/textarea.d.ts +1 -1
  120. package/dist/types/components/tooltip/tooltip.d.ts +1 -1
  121. package/dist/types/product/appshell/appshell.d.ts +2 -2
  122. package/dist/types/product/authshell/authshell.d.ts +1 -1
  123. package/dist/types/product/board/board.d.ts +1 -1
  124. package/dist/types/product/entitycard/entitycard.d.ts +1 -1
  125. package/dist/types/product/flowcanvas/flowcanvas.d.ts +1 -1
  126. package/dist/types/product/inbox/inbox.d.ts +1 -1
  127. package/dist/types/product/listpage/listpage.d.ts +1 -1
  128. package/dist/types/product/onboarding/onboarding.d.ts +1 -1
  129. package/dist/types/product/recordpage/recordpage.d.ts +2 -2
  130. package/dist/types/product/recordstable/recordstable.d.ts +10 -4
  131. package/dist/types/product/richtext/richtext.d.ts +1 -1
  132. package/dist/types/product/settingssection/settingssection.d.ts +1 -1
  133. package/dist/types/product/settingsshell/settingsshell.d.ts +1 -1
  134. package/dist/types/product/sidebar/sidebar.d.ts +10 -10
  135. package/dist/types/product/tasklist/tasklist.d.ts +1 -1
  136. package/dist/types/product/trialbanner/trialbanner.d.ts +1 -1
  137. package/dist/types/product/viewtoggle/viewtoggle.d.ts +1 -1
  138. package/package.json +1 -1
@@ -39,7 +39,7 @@ const lucide_react_1 = require("lucide-react");
39
39
  const React = __importStar(require("react"));
40
40
  const settingsshell_recipe_1 = require("./settingsshell.recipe");
41
41
  /**
42
- * The Settings layout — measured from Attio's Settings. A left nav (back header,
42
+ * The Settings layout — measured live. A left nav (back header,
43
43
  * search, grouped items) beside a scrolling content pane. The search filters the
44
44
  * nav by label. Fills the height its container gives it.
45
45
  */
@@ -64,13 +64,13 @@ const GlyphPeople = () => ((0, jsx_runtime_1.jsx)(lucide_react_1.User, { size: 1
64
64
  const GlyphDeals = () => ((0, jsx_runtime_1.jsx)(lucide_react_1.CircleDollarSign, { size: 12, color: "white", strokeWidth: 1.75, "aria-hidden": "true" }));
65
65
  const GlyphUsers = () => ((0, jsx_runtime_1.jsx)(lucide_react_1.Users, { size: 12, color: "white", strokeWidth: 1.75, "aria-hidden": "true" }));
66
66
  const GlyphWorkspaces = () => ((0, jsx_runtime_1.jsx)(lucide_react_1.LayoutGrid, { size: 12, color: "white", strokeWidth: 1.75, "aria-hidden": "true" }));
67
- /** The measured Attio workspace switcher — the default `workspace` prop. */
67
+ /** The measured workspace switcher — the default `workspace` prop. */
68
68
  exports.ATTIO_SIDEBAR_WORKSPACE = {
69
69
  name: "techpartners",
70
70
  avatarLabel: "T",
71
71
  avatarTone: "cyan",
72
72
  };
73
- /** The measured Attio main nav — the default `items` prop. */
73
+ /** The measured main nav — the default `items` prop. */
74
74
  exports.ATTIO_SIDEBAR_ITEMS = [
75
75
  { label: "Home", icon: IconHome },
76
76
  {
@@ -86,7 +86,7 @@ exports.ATTIO_SIDEBAR_ITEMS = [
86
86
  { label: "Sequences", icon: IconSequences },
87
87
  { label: "Workflows", icon: IconWorkflows },
88
88
  ];
89
- /** The measured Attio Records section — the default `recordsSection` prop. */
89
+ /** The measured Records section — the default `recordsSection` prop. */
90
90
  exports.ATTIO_SIDEBAR_RECORDS_SECTION = {
91
91
  label: "Records",
92
92
  items: [
@@ -97,17 +97,17 @@ exports.ATTIO_SIDEBAR_RECORDS_SECTION = {
97
97
  { label: "Workspaces", tone: "purple", glyph: GlyphWorkspaces },
98
98
  ],
99
99
  };
100
- /** The measured Attio Lists section — the default `listsSection` prop. */
100
+ /** The measured Lists section — the default `listsSection` prop. */
101
101
  exports.ATTIO_SIDEBAR_LISTS_SECTION = {
102
102
  label: "Lists",
103
103
  newListLabel: "+ New list",
104
104
  };
105
- /** The measured Attio Chats section — the default `chatsSection` prop. */
105
+ /** The measured Chats section — the default `chatsSection` prop. */
106
106
  exports.ATTIO_SIDEBAR_CHATS_SECTION = {
107
107
  label: "Chats",
108
108
  items: [{ label: "In-app notification for deal wins", icon: IconChat }],
109
109
  };
110
- /** The measured Attio footer copy — the default `footer` prop. */
110
+ /** The measured footer copy — the default `footer` prop. */
111
111
  exports.ATTIO_SIDEBAR_FOOTER = {
112
112
  gettingStartedLabel: "Getting started 1/6",
113
113
  inviteLabel: "Invite team members",
@@ -7,7 +7,7 @@ function Row({ task, onToggle, completeLabel, incompleteLabel, }) {
7
7
  return ((0, jsx_runtime_1.jsxs)("div", { className: "tasklist-row", "data-done": task.done ? "" : undefined, children: [(0, jsx_runtime_1.jsx)("input", { type: "checkbox", className: "tasklist-check", checked: !!task.done, "aria-label": task.done ? incompleteLabel : completeLabel, onChange: () => onToggle?.(task.id, !task.done) }), (0, jsx_runtime_1.jsx)("span", { className: "tasklist-title", children: task.title }), (task.due != null || task.meta != null) && ((0, jsx_runtime_1.jsxs)("span", { className: "tasklist-meta", children: [task.due != null && ((0, jsx_runtime_1.jsx)("span", { className: "tasklist-due", "data-overdue": task.overdue ? "" : undefined, children: task.due })), task.meta] }))] }));
8
8
  }
9
9
  /**
10
- * A task list — measured from Attio's Tasks page. Optional group headers with a
10
+ * A task list — measured from a tasks page. Optional group headers with a
11
11
  * count, then rows of a round complete-checkbox + title + trailing meta.
12
12
  * Completed rows strike through; overdue dates go red.
13
13
  */
@@ -4,7 +4,7 @@ exports.TrialBanner = TrialBanner;
4
4
  const jsx_runtime_1 = require("react/jsx-runtime");
5
5
  const trialbanner_recipe_1 = require("./trialbanner.recipe");
6
6
  /**
7
- * A compact trial / upgrade banner — measured from Attio's sidebar footer.
7
+ * A compact trial / upgrade banner — measured from a sidebar footer.
8
8
  * Icon + message + an optional small action pill (soft-glow outlined button).
9
9
  */
10
10
  function TrialBanner({ icon, children, action, onAction, tone = "neutral", className, ...rest }) {
@@ -38,7 +38,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
38
38
  const React = __importStar(require("react"));
39
39
  const viewtoggle_recipe_1 = require("./viewtoggle.recipe");
40
40
  /**
41
- * A compact icon toggle — measured from Attio's list/grid switch. A padded track
41
+ * A compact icon toggle — measured from a list/grid switch. A padded track
42
42
  * of icon tiles; the selected tile is raised. Use for view-mode switches (list ⇄
43
43
  * grid) or any small mutually-exclusive icon choice.
44
44
  */
@@ -3,7 +3,7 @@ import { ChevronDown } from "lucide-react";
3
3
  import * as React from "react";
4
4
  import { accordionRecipe } from "./accordion.recipe.js";
5
5
  /**
6
- * A collapsible section list — measured from Attio's sidebar groups. Single or
6
+ * A collapsible section list — measured from sidebar groups. Single or
7
7
  * multiple open; panels animate their height (grid-rows 0fr->1fr). Headers are
8
8
  * buttons with `aria-expanded` / `aria-controls`.
9
9
  */
@@ -4,7 +4,7 @@ import { Avatar } from "../avatar/avatar.js";
4
4
  import { avatargroupRecipe } from "./avatargroup.recipe.js";
5
5
  /**
6
6
  * A stack of overlapping avatars with an optional "+N" overflow chip — measured
7
- * from Attio's team / member rows. Pass `<Avatar>` children; each is ringed in
7
+ * from team / member rows. Pass `<Avatar>` children; each is ringed in
8
8
  * the surface colour so it reads against its neighbour.
9
9
  */
10
10
  export function AvatarGroup({ children, max, size = "md", className, "aria-label": ariaLabel, ...rest }) {
@@ -11,7 +11,7 @@ function niceNum(raw) {
11
11
  return step * mag;
12
12
  }
13
13
  /**
14
- * A responsive bar chart — measured from Attio's Reports dashboard. Pure CSS, so
14
+ * A responsive bar chart for dashboards. Pure CSS, so
15
15
  * it scales with its container. Renders `role="img"` with an accessible summary.
16
16
  */
17
17
  export function BarChart({ data, height = 240, max, ticks = 5, color, format = (n) => n.toLocaleString(), yAxisWidth, xAxisTitle, "aria-label": ariaLabel, className, ...rest }) {
@@ -3,7 +3,7 @@ import { ChevronRight } from "lucide-react";
3
3
  import * as React from "react";
4
4
  import { breadcrumbRecipe } from "./breadcrumb.recipe.js";
5
5
  /**
6
- * A breadcrumb trail — measured from Attio's record-page nav. The last item is
6
+ * A breadcrumb trail — measured from a record-page nav. The last item is
7
7
  * marked `aria-current="page"`; earlier items render as links or buttons.
8
8
  */
9
9
  export function Breadcrumb({ items, separator, "aria-label": ariaLabel = "Breadcrumb", className, ...rest }) {
@@ -5,7 +5,7 @@ import { bulkbarRecipe } from "./bulkbar.recipe.js";
5
5
  /**
6
6
  * A floating bulk-action bar. Rises from the bottom-centre of its nearest
7
7
  * positioned ancestor when a selection is active; render it conditionally
8
- * (e.g. `count > 0 && <BulkBar …/>`). Measured from Attio's records table.
8
+ * (e.g. `count > 0 && <BulkBar …/>`). Measured from a records table.
9
9
  */
10
10
  export function BulkBar({ count, onClear, countLabel = "selected", countText = (count, label) => (_jsxs(_Fragment, { children: [count, " ", label] })), children, className, clearLabel = "Clear selection", ...rest }) {
11
11
  return (_jsx("div", { className: bulkbarRecipe({ className }), ...rest, children: _jsxs("div", { className: "bulkbar-bar", children: [count != null && (_jsxs("button", { type: "button", className: "bulkbar-count", onClick: onClear, title: clearLabel, children: [countText(count, countLabel), _jsx(X, { size: 13, strokeWidth: 2, "aria-hidden": "true" })] })), children] }) }));
@@ -9,7 +9,7 @@ const DEFAULT_ICONS = {
9
9
  danger: CircleAlert,
10
10
  };
11
11
  /**
12
- * An inline callout / banner — measured from Attio's info notices. `tone` tints
12
+ * An inline callout / banner — measured from info notices. `tone` tints
13
13
  * the background and icon; pass a `title` and/or body `children`.
14
14
  */
15
15
  export function Callout({ tone = "neutral", icon, title, children, action, className, ...rest }) {
@@ -3,7 +3,7 @@ import * as React from "react";
3
3
  import { Primitive } from "../../core/index.js";
4
4
  import { checkboxRecipe } from "./checkbox.recipe.js";
5
5
  /**
6
- * A native `<input type="checkbox">` styled to Attio's grid checkbox (16px,
6
+ * A native `<input type="checkbox">` styled to the measured grid checkbox (16px,
7
7
  * r6, brand fill + white check). Native on purpose: keyboard, focus, and form
8
8
  * semantics come for free. `indeterminate` is a DOM-only property, so it is
9
9
  * applied via ref rather than an attribute.
@@ -3,14 +3,14 @@ import { ChevronDown, Plus } from "lucide-react";
3
3
  import * as React from "react";
4
4
  import { Menu, MenuItem } from "../menu/index.js";
5
5
  import { columncalcRecipe } from "./columncalc.recipe.js";
6
- /** The four Attio offers on every column, in its order. */
6
+ /** The four calcs offered on every column, in their order. */
7
7
  export const UNIVERSAL_CALCS = [
8
8
  "countEmpty",
9
9
  "countFilled",
10
10
  "percentEmpty",
11
11
  "percentFilled",
12
12
  ];
13
- /** The four Attio adds for numeric columns, in its order. */
13
+ /** The four calcs added for numeric columns, in their order. */
14
14
  export const NUMERIC_CALCS = ["sum", "average", "min", "max"];
15
15
  export const CALC_LABEL = {
16
16
  none: "None",
@@ -33,7 +33,7 @@ function asText(v) {
33
33
  return v.join(", ");
34
34
  return String(v);
35
35
  }
36
- // stable pastel tone per string value — colour-coded tags/statuses, like Attio
36
+ // stable pastel tone per string value — colour-coded tags/statuses
37
37
  const TAG_TONES = [
38
38
  "brand",
39
39
  "success",
@@ -241,8 +241,8 @@ export function DataTable({ columns: columnsProp, data, selectable = false, sele
241
241
  });
242
242
  }, [filtered, sorts, colByKey]);
243
243
  /**
244
- * Rows bucketed under a heading, preserving first-seen group order (Attio
245
- * groups a view without reordering within a group). One bucket with a null
244
+ * Rows bucketed under a heading, preserving first-seen group order (a
245
+ * grouped view without reordering within a group). One bucket with a null
246
246
  * group when `groupBy` is absent, so the render path is identical either way.
247
247
  */
248
248
  const groupedRows = React.useMemo(() => {
@@ -274,7 +274,7 @@ export function DataTable({ columns: columnsProp, data, selectable = false, sele
274
274
  }
275
275
  function cycleSort(key) {
276
276
  // Clicking a header drives a single sort, as before. Multi-sort is supplied
277
- // by the caller through the `sort` prop (Attio builds it in its sort popover).
277
+ // by the caller through the `sort` prop (built in a sort popover).
278
278
  const dir = sortDirByKey.get(key);
279
279
  if (!dir)
280
280
  setSort({ key, dir: "asc" });
@@ -284,7 +284,7 @@ export function DataTable({ columns: columnsProp, data, selectable = false, sele
284
284
  setSort(null);
285
285
  }
286
286
  /**
287
- * Which editor a column gets. Mirrors RecordsTable — the Attio-measured
287
+ * Which editor a column gets. Mirrors RecordsTable — the measured
288
288
  * sibling — rather than giving every type the same text box:
289
289
  * number/currency numeric, with a decimal keypad on touch
290
290
  * date a native date field
@@ -17,7 +17,7 @@ const fromDate = (d) => ({
17
17
  day: d.getDate(),
18
18
  });
19
19
  /**
20
- * Attio's date field: a trigger showing the value, opening a calendar in a
20
+ * A measured date field: a trigger showing the value, opening a calendar in a
21
21
  * popover. This is what `DatePicker` used to be; `DatePicker` is now
22
22
  * seed-design's bare calendar, and this composes it.
23
23
  */
@@ -19,7 +19,7 @@ function useDialogInstanceId() {
19
19
  }
20
20
  /**
21
21
  * A modal dialog — composes Zag's dialog machine (focus trap, scroll lock,
22
- * Escape / outside-click dismissal) with the measured Attio modal surface.
22
+ * Escape / outside-click dismissal) with the measured modal surface.
23
23
  * Compose the body with `DialogBody` and actions with `DialogFooter`.
24
24
  */
25
25
  export function Dialog({ open, onOpenChange, title, icon, width = 640, "aria-label": ariaLabel, closeLabel = "Close", children, className, style, "aria-describedby": describedBy, ...rest }) {
@@ -12,7 +12,7 @@ const PALETTE = [
12
12
  c.bgDanger,
13
13
  ];
14
14
  /**
15
- * A donut / ring chart — measured from Attio's Reports breakdown reports. SVG
15
+ * A donut / ring chart — measured from a reports breakdown report. SVG
16
16
  * ring using the r=15.915 (circumference 100) trick so slices are percentages;
17
17
  * a centred total and an optional legend. `role="img"` with a summary.
18
18
  */
@@ -6,7 +6,7 @@ import * as React from "react";
6
6
  import { useFocusAfterRemoval } from "../../core/index.js";
7
7
  import { fileuploadRecipe } from "./fileupload.recipe.js";
8
8
  export const fileUploadLabels = {
9
- // Attio's own copy on the record Files pane.
9
+ // Matches the copy on the record Files pane.
10
10
  title: "No files",
11
11
  hint: "Drag a file here or choose one from your computer.",
12
12
  remove: "Remove file",
@@ -52,7 +52,7 @@ function useFieldWiring({ htmlFor, messageId, invalid, required, }) {
52
52
  }, [htmlFor, messageId, invalid, required]);
53
53
  }
54
54
  /**
55
- * A labelled form field — measured from Attio's Settings forms. A muted label
55
+ * A labelled form field — measured from settings forms. A muted label
56
56
  * above any control, with an optional description or error line below. When
57
57
  * `error` is set it replaces the description; the control is given
58
58
  * `aria-describedby`, plus `aria-invalid` and `aria-required` as they apply.
@@ -10,7 +10,7 @@ function niceNum(raw) {
10
10
  return step * mag;
11
11
  }
12
12
  /**
13
- * A responsive line chart — measured from Attio's Reports historical charts.
13
+ * A responsive line chart — measured from a reports historical chart.
14
14
  * A stretched SVG line/area (non-scaling stroke keeps it crisp) over dashed
15
15
  * gridlines; dots are HTML so they stay round. `role="img"` with a summary.
16
16
  */
@@ -6,7 +6,7 @@ import { menuRecipe } from "./menu.recipe.js";
6
6
  import { useMenuKeyboard } from "./menu-keyboard.js";
7
7
  const MenuContext = React.createContext(null);
8
8
  /**
9
- * A dropdown menu — the ⋯ / sort / filter menu surface, on Attio's measured
9
+ * A dropdown menu — the ⋯ / sort / filter menu surface, on a measured
10
10
  * popover. Give it a `trigger` element and Menu items as children. Opens on
11
11
  * click / ↓ / Enter; roving-focus keyboard model (↑/↓ move, Home/End jump,
12
12
  * typeahead, Enter/Space select, Esc closes and returns focus to the trigger);
@@ -24,7 +24,7 @@ function Chip({ opt }) {
24
24
  return (_jsx("span", { className: "recordstable-tag", "data-tone": opt.tone ?? toneFor(opt.value), children: opt.label }));
25
25
  }
26
26
  /**
27
- * A multi-select / tag editor — measured from Attio's cell tag picker. The
27
+ * A multi-select / tag editor — measured from a cell tag picker. The
28
28
  * outlined trigger shows the selected values as coloured chips; it opens a
29
29
  * popover with a search field over rows of "[chip] … [checkbox]" that toggle on
30
30
  * click (the menu stays open). Keyboard: ↑/↓ move, Enter toggles, Esc closes.
@@ -5,7 +5,7 @@ import { radiogroupRecipe } from "./radiogroup.recipe.js";
5
5
  import { useRadioGroupKeyboard } from "./radiogroup-keyboard.js";
6
6
  const RadioContext = React.createContext(null);
7
7
  /**
8
- * A radio group — measured from Attio's settings. `default` renders rows (a ring
8
+ * A radio group — measured from a settings page. `default` renders rows (a ring
9
9
  * that fills brand when selected + a label); `card` renders a row of bordered
10
10
  * preview cards whose border turns brand when picked (the Theme picker). Arrow
11
11
  * keys move between options (roving focus). Controlled or uncontrolled.
@@ -53,7 +53,7 @@ export function writeStoredPercent(key, percent, storage = window.localStorage)
53
53
  }
54
54
  }
55
55
  /**
56
- * Attio's adjustable-panel primitive: a spacer that reserves layout width
56
+ * An adjustable-panel primitive: a spacer that reserves layout width
57
57
  * plus a panel that overlays it, so the panel can move between docked
58
58
  * (in-flow) and floating (`position: fixed`, an overlay) without a reflow
59
59
  * glitch. Drag the edge handle to resize; constraints are CSS `min-width`/
@@ -4,7 +4,7 @@ import { useLabelAssociation } from "../../core/index.js";
4
4
  import { useRadioGroupKeyboard } from "../radiogroup/index.js";
5
5
  import { segmentedRecipe } from "./segmented.recipe.js";
6
6
  /**
7
- * A segmented control (single-choice toggle) — measured from Attio's view
7
+ * A segmented control (single-choice toggle) — measured from a view
8
8
  * switcher. `role="radiogroup"` over `role="radio"` buttons with roving
9
9
  * tabindex and ←/→ (Home/End) keyboard selection.
10
10
  */
@@ -10,7 +10,7 @@ function optionText(o) {
10
10
  return typeof o.label === "string" ? o.label : o.value;
11
11
  }
12
12
  /**
13
- * A select / dropdown — the settings control, measured from Attio, with an
13
+ * A select / dropdown — the settings control, measured live, with an
14
14
  * optional Linear-style search. A `role="combobox"` trigger opens a
15
15
  * `role="listbox"`; pass `searchable` to add a filter field at the top (with a
16
16
  * "No results" empty state). Full keyboard model — ↑/↓ move, Enter/Space pick,
@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { stagebarRecipe } from "./stagebar.recipe.js";
3
3
  const DEFAULT = "#266df0";
4
4
  /**
5
- * A pipeline stage bar — measured from Attio's Deal-stage Highlight. Each stage
5
+ * A pipeline stage bar — measured from a deal-stage highlight. Each stage
6
6
  * is a segment tinted with its colour; the current stage is at full strength.
7
7
  */
8
8
  export function StageBar({ stages, current, "aria-label": ariaLabel, className, ...rest }) {
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { ArrowDown, ArrowUp } from "lucide-react";
3
3
  import { statcardRecipe } from "./statcard.recipe.js";
4
4
  /**
5
- * A single-metric KPI tile — measured from Attio's Reports number/insight cards.
5
+ * A single-metric KPI tile — measured from a reports number/insight card.
6
6
  * Label, a large value, and an optional up/down delta pill with a caption.
7
7
  */
8
8
  export function StatCard({ label, icon, value, delta, deltaSuffix = "%", caption, card, className, ...rest }) {
@@ -3,7 +3,7 @@ import * as React from "react";
3
3
  import { formValueStyle, useFormReset } from "../../core/index.js";
4
4
  import { switchRecipe } from "./switch.recipe.js";
5
5
  /**
6
- * An on/off toggle — the settings switch, measured from Attio. Renders a
6
+ * An on/off toggle — the settings switch, measured live. Renders a
7
7
  * `role="switch"` button (a native checkbox's semantics without its box), so
8
8
  * label association and keyboard (Space/Enter) come for free. Controlled via
9
9
  * `checked`/`onCheckedChange`, or uncontrolled from `defaultChecked`.
@@ -28,7 +28,7 @@ const asText = (v) => {
28
28
  // Before the generic object branch, which would look for `.name`, find none
29
29
  // and return "" — turning every Date into the empty string (#185). The ISO
30
30
  // date is stable and locale-independent, so `contains "2026-06"` works; it
31
- // will not match "16/06/2026", and a date-aware operator set is Attio's
31
+ // will not match "16/06/2026", and a date-aware operator set needs a
32
32
  // date-picker UI, which has to be measured before it can be built.
33
33
  if (v instanceof Date)
34
34
  return Number.isNaN(v.getTime()) ? "" : v.toISOString().slice(0, 10);
@@ -90,7 +90,7 @@ export function applySorts(rows, sorts, get = (row, key) => row[key]) {
90
90
  });
91
91
  }
92
92
  /**
93
- * Attio's table toolbar as a standalone primitive: the Sort and Filter
93
+ * The table toolbar as a standalone primitive: the Sort and Filter
94
94
  * controls, their menus, the sort-condition rows and the filter chips.
95
95
  *
96
96
  * `RecordsTable` renders this same measured chrome internally; this is the
@@ -4,8 +4,8 @@ import { tabsRecipe } from "./tabs.recipe.js";
4
4
  import { useTablistKeyboard } from "./tabs-keyboard.js";
5
5
  /**
6
6
  * A row of text tabs over a sliding ink underline — the record-view tab bar,
7
- * measured from Attio. Roving-tabindex keyboard model (←/→ move + activate,
8
- * Home/End jump); activation follows focus, matching Attio. Controlled via
7
+ * measured live. Roving-tabindex keyboard model (←/→ move + activate,
8
+ * Home/End jump); activation follows focus. Controlled via
9
9
  * `value`/`onValueChange`, or uncontrolled from `defaultValue`.
10
10
  */
11
11
  export function Tabs({ tabs, value, defaultValue, onValueChange, leading, children, className, "aria-label": ariaLabel, ...rest }) {
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import * as React from "react";
3
3
  import { textareaRecipe } from "./textarea.recipe.js";
4
4
  /**
5
- * A multiline text field — measured from Attio's settings. Forwards every native
5
+ * A multiline text field — measured from settings. Forwards every native
6
6
  * `<textarea>` prop; pass `showCount` with `maxLength` to render a live
7
7
  * character counter (which turns red if the value exceeds the limit).
8
8
  */
@@ -3,7 +3,7 @@ import * as React from "react";
3
3
  import { createPortal } from "react-dom";
4
4
  import { tooltipRecipe } from "./tooltip.recipe.js";
5
5
  /**
6
- * A hover/focus tooltip — a dark hint chip measured from Attio. Wraps its
6
+ * A hover/focus tooltip — a dark hint chip measured live. Wraps its
7
7
  * trigger in an inline element, shows after `delay` on pointer-enter / focus,
8
8
  * and hides on leave / blur / Escape. The bubble is portaled and positioned
9
9
  * above the trigger (flipping below near the top edge).
@@ -4,8 +4,8 @@ import * as React from "react";
4
4
  import { isRtlElement } from "../../core/index.js";
5
5
  import { appshellRecipe } from "./appshell.recipe.js";
6
6
  /**
7
- * App-shell layout with a collapsible + resizable sidebar, mirroring Attio's
8
- * window: drag the sidebar's right edge to resize, press the sidebar's
7
+ * App-shell layout with a collapsible + resizable sidebar, mirroring a live
8
+ * app's window: drag the sidebar's right edge to resize, press the sidebar's
9
9
  * collapse button to slide it away (a floating button brings it back). The
10
10
  * sidebar pane clips rather than squishing, so its content never reflows.
11
11
  */
@@ -32,8 +32,8 @@ export function AppShell({ sidebar, children, width: widthProp, defaultWidth = 2
32
32
  // it there. Mirroring the handle's CSS without this is the half-conversion
33
33
  // lesson 54 is about, which is why both change in one commit (#212).
34
34
  const dir = isRtlElement(e.currentTarget) ? -1 : 1;
35
- // Attio only enters the drag state once the pointer has actually moved — a
36
- // click on the handle is not a drag, so the blue bar must not flash on press.
35
+ // Only enter the drag state once the pointer has actually moved — a click
36
+ // on the handle is not a drag, so the blue bar must not flash on press.
37
37
  let moved = false;
38
38
  let last = startW;
39
39
  const prevSelect = document.body.style.userSelect;
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { authshellRecipe } from "./authshell.recipe.js";
3
3
  /**
4
- * The Attio welcome/auth layout (app.attio.com/welcome/*) — measured live.
4
+ * The welcome/auth layout — measured live.
5
5
  * A centered page frame: an optional top progress bar, a logo, a two-pane
6
6
  * card (the form + an optional product preview, hidden under 1200px), and
7
7
  * a footer. Auth-surface Input/FormField/Button treatment (flatter fields,
@@ -6,7 +6,7 @@ import { boardRecipe } from "./board.recipe.js";
6
6
  * A kanban board with native drag-and-drop between columns. Cards are
7
7
  * `draggable`; dropping one on a column reparents it via `onCardsChange`
8
8
  * (the parent owns the cards, so the move is a controlled state update).
9
- * Measured from Attio's Deals pipeline.
9
+ * Measured from a deals pipeline.
10
10
  */
11
11
  export function Board({ columns, cards, onCardsChange, renderCard, onNewCard, newCardLabel = "New", getCardLabel, announceMove = (column, card) => card ? `${card} moved to ${column}` : `Moved to ${column}`, className, ...rest }) {
12
12
  const [dragId, setDragId] = React.useState(null);
@@ -208,7 +208,7 @@ export function Command({ open, onOpenChange, items = defaultCommandItems, place
208
208
  combo.setInputValue("", "script");
209
209
  combo.clearHighlightValue();
210
210
  }, [open]);
211
- // The footer's primary button mirrors the currently highlighted row (Attio
211
+ // The footer's primary button mirrors the currently highlighted row (this
212
212
  // shows the active action there and runs it on ↵ / click).
213
213
  const highlightedItem = filteredItems.find((item) => item.id === combo.highlightedValue) ??
214
214
  filteredItems[0];
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { entitycardRecipe } from "./entitycard.recipe.js";
3
3
  /**
4
- * A note / entity card — measured from Attio's Notes grid. A bordered white
4
+ * A note / entity card — measured from a notes grid. A bordered white
5
5
  * card with an author row, a title, a clamped excerpt, and a footer row with a
6
6
  * right-aligned date. Rendered as a button so the whole card is clickable.
7
7
  */
@@ -6,7 +6,7 @@ const GRID = 20;
6
6
  const clampZoom = (z) => Math.min(1.5, Math.max(0.5, z));
7
7
  /**
8
8
  * A pannable, zoomable node canvas with draggable nodes and connecting edges —
9
- * measured from Attio's Workflows editor. Drag a node to move it (fires
9
+ * measured from a workflows editor. Drag a node to move it (fires
10
10
  * `onNodesChange`); drag the background to pan; use the toolbar to zoom.
11
11
  */
12
12
  export function FlowCanvas({ nodes, edges, onNodesChange, renderNode, nodeWidth = 240, nodeHeight = 64, "aria-label": ariaLabel, className, zoomOutLabel = "Zoom out", zoomInLabel = "Zoom in", resetLabel = "Reset", edgesLabel = "Edges", ...rest }) {
@@ -4,7 +4,7 @@ import * as React from "react";
4
4
  import { useTablistKeyboard } from "../../components/tabs/index.js";
5
5
  import { inboxRecipe } from "./inbox.recipe.js";
6
6
  /**
7
- * A notifications inbox panel — measured from Attio's notification flyout. A
7
+ * A notifications inbox panel — measured from a notification flyout. A
8
8
  * title, Notifications/Requests tabs with counts, then notification rows
9
9
  * (avatar + message + time + unread dot) or a centred empty state. Put it inside
10
10
  * a Popover for the flyout.
@@ -9,7 +9,7 @@ export function ListRow({ children, onClick, }) {
9
9
  return _jsx("div", { className: "listpage-row", children: children });
10
10
  }
11
11
  /**
12
- * The entity-list page shell — measured from Attio's Reports/Sequences/Tasks/
12
+ * The entity-list page shell — measured from Reports/Sequences/Tasks/
13
13
  * Notes list views. A view-bar toolbar (leading/trailing slots + record count),
14
14
  * an optional dashed Favorites region, then column headers and time-grouped
15
15
  * rows. Rows are composed by the caller (wrap each in <ListRow>).
@@ -11,7 +11,7 @@ export const onboardingLabels = {
11
11
  completedStepLabel: (label) => `${String(label)} — completed`,
12
12
  };
13
13
  /**
14
- * An onboarding checklist card — measured from Attio's floating "Getting
14
+ * An onboarding checklist card — measured from a floating "Getting
15
15
  * started" widget. Title + optional menu/minimize, a segmented progress bar,
16
16
  * and step rows (completed rows strike through with a brand check).
17
17
  */
@@ -26,7 +26,7 @@ export const recordPageLabels = {
26
26
  exitFullScreen: "Exit full screen",
27
27
  resizeDetails: "Resize details column",
28
28
  composeEmail: "Compose email",
29
- askAttio: "Ask Attio",
29
+ askAttio: "Ask AI",
30
30
  addToList: "Add to list",
31
31
  noLists: "This record has not been added to any lists.",
32
32
  highlights: "Highlights",
@@ -146,7 +146,7 @@ function EmptyCard({ icon, children, }) {
146
146
  return (_jsxs("div", { className: "recordpage-emptycard", children: [icon, children] }));
147
147
  }
148
148
  /**
149
- * The full-page company record view — the page Attio opens when you click into a
149
+ * The full-page company record view — the page that opens when you click into a
150
150
  * record (as opposed to the peek [RecordPanel]). A top breadcrumb bar with
151
151
  * favourite/edit/compose/… actions, a 320px left attribute column, and a tabbed
152
152
  * main area: Overview stacks Highlights, an Activity feed, and Notes / Tasks /
@@ -171,12 +171,12 @@ export function RecordPage({ record, columns, collection = "Records", labels, on
171
171
  const [notes, setNotes] = React.useState([]);
172
172
  const [tasks, setTasks] = React.useState([]);
173
173
  const [showAllActivity, setShowAllActivity] = React.useState(false);
174
- // Collapsible + searchable Record Details, like Attio.
174
+ // Collapsible + searchable Record Details.
175
175
  const [detailsOpen, setDetailsOpen] = React.useState(true);
176
176
  const [searchOpen, setSearchOpen] = React.useState(false);
177
177
  const [fieldQuery, setFieldQuery] = React.useState("");
178
178
  const [showAllValues, setShowAllValues] = React.useState(false);
179
- // Drag-resizable left details column, like Attio.
179
+ // Drag-resizable left details column.
180
180
  const [detailsW, setDetailsW] = React.useState(320);
181
181
  const [resizing, setResizing] = React.useState(false);
182
182
  const dragRef = React.useRef(null);
@@ -217,14 +217,14 @@ export function RecordPage({ record, columns, collection = "Records", labels, on
217
217
  const matchedFields = q
218
218
  ? fields.filter((col) => col.label.toLowerCase().includes(q))
219
219
  : fields;
220
- // Attio shows the first 5 fields; "View all values" reveals the rest.
220
+ // Shows the first 5 fields; "View all values" reveals the rest.
221
221
  const FIELD_LIMIT = 5;
222
222
  const canRevealFields = !q && matchedFields.length > FIELD_LIMIT;
223
223
  const shownFields = canRevealFields && !showAllValues
224
224
  ? matchedFields.slice(0, FIELD_LIMIT)
225
225
  : matchedFields;
226
226
  const byKey = React.useMemo(() => new Map(columns.map((col) => [col.key, col])), [columns]);
227
- // Attio's Overview "Highlights" — a fixed set of enrichment stats (measured
227
+ // The Overview "Highlights" — a fixed set of enrichment stats (measured
228
228
  // from the live app), a couple derived from the record, the rest empty.
229
229
  const arrVal = record.arr;
230
230
  const empVal = record.employees;
@@ -369,7 +369,7 @@ export function RecordPage({ record, columns, collection = "Records", labels, on
369
369
  setDetailsOpen(true);
370
370
  }, children: searchOpen ? (_jsx(X, { size: 14, strokeWidth: 1.75 })) : (_jsx(Search, { size: 14, strokeWidth: 1.75 })) })] }), detailsOpen &&
371
371
  (shownFields.length > 0 ? (_jsxs(_Fragment, { children: [shownFields.map((col) => (_jsxs("div", { className: "recordpage-field", children: [_jsxs("span", { className: "recordpage-field-label", children: [col.icon ? (_jsx(col.icon, { size: 15, strokeWidth: 1.75 })) : null, _jsx("span", { className: "recordpage-field-label-text", children: col.label })] }), _jsx("span", { className: "recordpage-field-value", children: _jsx(FieldValue, { col: col, row: record, labels: t }) })] }, col.key))), canRevealFields && (_jsx("button", { type: "button", className: "recordpage-viewall recordpage-viewall--section", onClick: () => {
372
- // Attio: revealing all fields also opens the (focused)
372
+ // Revealing all fields also opens the (focused)
373
373
  // field search; collapsing closes it.
374
374
  const next = !showAllValues;
375
375
  setShowAllValues(next);