@crisp-ui-kit/crisp 0.55.4 → 0.55.5

package/dist/cjs/components/datatable/datatable.recipe.js

@@ -282,7 +282,14 @@ const config = (0, core_1.defineRecipe)({
        is rgba(0,0,0,0.09), a 9% tint, not the name's own full-contrast text
        colour. The previous :hover-gated, full-contrast rule here was itself
        unmeasured and wrong in two ways at once. */
-    & .crisp-datatable-entity-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: underline; text-decoration-color: color-mix(in srgb, ${tokens_1.contract.fgPrimary} 9%, transparent); }
+    /* crisp#851 -- Attio's own entity/record names are measured at
+       font-weight 500, distinct from a plain-text primary column's 400
+       (table.recipe.ts's own \`tbody th\` default). This was never its own
+       explicit style -- it silently rode on a since-fixed header-rule leak
+       (#833/#835/#848) that happened to apply the same 500 to every
+       primary-column body cell regardless of type. Made explicit here so
+       fixing that leak doesn't also (wrongly) drop entity names to 400. */
+    & .crisp-datatable-entity-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: ${tokens_1.contract.weight.medium}; text-decoration: underline; text-decoration-color: color-mix(in srgb, ${tokens_1.contract.fgPrimary} 9%, transparent); }
     & button.crisp-datatable-entity-name--link { margin: 0; padding: 0; border: none; background: none; font: inherit; color: inherit; letter-spacing: inherit; text-align: start; cursor: pointer; max-width: 100%; }
     /* crisp/#601, G-048: two 20px ghost icons, right-aligned in the primary
        column, revealed on ROW hover (the issue's own title says "row

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

@@ -48,6 +48,23 @@ const config = (0, core_1.defineRecipe)({
        \`& table\`'s own color) applies to it like every other cell. */
     & thead th { position: sticky; top: 0; z-index: 2; height: ${tokens_1.contract.size.tableHeader}; background: ${tokens_1.contract.bgSurface}; border-top: 1px solid ${tokens_1.contract.borderSubtle}; font-size: ${tokens_1.contract.text.lg}; font-weight: ${tokens_1.contract.weight.medium}; letter-spacing: -0.14px; color: ${tokens_1.contract.fgPrimary}; user-select: none; }
     & td { color: ${tokens_1.contract.fgPrimary}; background: ${tokens_1.contract.bgSurface}; }
+    /* crisp#851 -- a REGRESSION from #833/#835/#848's own fix: scoping the
+       header rule above to \`thead th\` correctly stopped it leaking onto
+       the primary column's body cell (a real \`<th scope="row">\` since
+       #779), but that same leaked rule's \`font-weight: ${tokens_1.contract.weight.medium}\`
+       was the ONLY thing overriding the browser's own UA stylesheet default
+       for \`<th>\` (\`font-weight: bold; text-align: center\`) on that cell --
+       once the leak stopped, a plain-text primary column fell through to
+       bold+centred instead of matching its sibling \`<td>\`s (\`400\`/start,
+       Attio's own plain-text primary cell). \`text-align\` was already safe
+       (the base \`& th, & td\` rule's own \`text-align: start\` above is
+       author-origin and always beats the UA stylesheet regardless of
+       specificity) but is restated here explicitly, defensively -- cheap,
+       and removes any doubt. \`type: "entity"\` primary columns are a
+       separate case (Attio's own entity/record names are 500, not 400) --
+       see \`.crisp-datatable-entity-name\`'s own new explicit weight in
+       datatable.recipe.ts, which wins here by class specificity. */
+    & tbody th { font-weight: ${tokens_1.contract.weight.regular}; text-align: start; }
     & th:last-child, & td:last-child { border-inline-end: none; }
     & tbody tr:last-child td { border-bottom: none; }
     /* #554: sticky to the bottom, mirroring \`.crisp-recordstable-sum\`. */

package/dist/datatable.css

@@ -192,8 +192,13 @@
     & .crisp-datatable-cell-actions-row { display: flex; align-items: center; gap: var(--crisp-space-1-5); min-width: 0; width: 100%; }
     /* crisp/#601, G-050: measured LIVE (getComputedStyle on the name text, plain hover vs rest) that Attio's underline is unconditional, not a
        hover reveal -- identical at rest and on hover: text-decoration-color
-       is rgba(0,0,0,0.09), a 9% tint, not the name's own full-contrast text colour. The previous :hover-gated, full-contrast rule here was itself unmeasured and wrong in two ways at once. */
-    & .crisp-datatable-entity-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--crisp-fg-primary) 9%, transparent); }
+       is rgba(0,0,0,0.09), a 9% tint, not the name's own full-contrast text colour. The previous :hover-gated, full-contrast rule here was itself unmeasured and wrong in two ways at once. */ /* crisp#851 -- Attio's own entity/record names are measured at
+       font-weight 500, distinct from a plain-text primary column's 400 (table.recipe.ts's own `tbody th` default). This was never its own
+       explicit style -- it silently rode on a since-fixed header-rule leak
+       (#833/#835/#848) that happened to apply the same 500 to every
+       primary-column body cell regardless of type. Made explicit here so
+       fixing that leak doesn't also (wrongly) drop entity names to 400. */
+    & .crisp-datatable-entity-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: var(--crisp-weight-medium); text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--crisp-fg-primary) 9%, transparent); }
     & button.crisp-datatable-entity-name--link { margin: 0; padding: 0; border: none; background: none; font: inherit; color: inherit; letter-spacing: inherit; text-align: start; cursor: pointer; max-width: 100%; }
     /* crisp/#601, G-048: two 20px ghost icons, right-aligned in the primary column, revealed on ROW hover (the issue's own title says "row
        hover", and a live check confirmed hovering well past the name --

package/dist/datatable.layered.css

@@ -193,8 +193,13 @@
     & .crisp-datatable-cell-actions-row { display: flex; align-items: center; gap: var(--crisp-space-1-5); min-width: 0; width: 100%; }
     /* crisp/#601, G-050: measured LIVE (getComputedStyle on the name text, plain hover vs rest) that Attio's underline is unconditional, not a
        hover reveal -- identical at rest and on hover: text-decoration-color
-       is rgba(0,0,0,0.09), a 9% tint, not the name's own full-contrast text colour. The previous :hover-gated, full-contrast rule here was itself unmeasured and wrong in two ways at once. */
-    & .crisp-datatable-entity-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--crisp-fg-primary) 9%, transparent); }
+       is rgba(0,0,0,0.09), a 9% tint, not the name's own full-contrast text colour. The previous :hover-gated, full-contrast rule here was itself unmeasured and wrong in two ways at once. */ /* crisp#851 -- Attio's own entity/record names are measured at
+       font-weight 500, distinct from a plain-text primary column's 400 (table.recipe.ts's own `tbody th` default). This was never its own
+       explicit style -- it silently rode on a since-fixed header-rule leak
+       (#833/#835/#848) that happened to apply the same 500 to every
+       primary-column body cell regardless of type. Made explicit here so
+       fixing that leak doesn't also (wrongly) drop entity names to 400. */
+    & .crisp-datatable-entity-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: var(--crisp-weight-medium); text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--crisp-fg-primary) 9%, transparent); }
     & button.crisp-datatable-entity-name--link { margin: 0; padding: 0; border: none; background: none; font: inherit; color: inherit; letter-spacing: inherit; text-align: start; cursor: pointer; max-width: 100%; }
     /* crisp/#601, G-048: two 20px ghost icons, right-aligned in the primary column, revealed on ROW hover (the issue's own title says "row
        hover", and a live check confirmed hovering well past the name --

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

@@ -279,7 +279,14 @@ const config = defineRecipe({
        is rgba(0,0,0,0.09), a 9% tint, not the name's own full-contrast text
        colour. The previous :hover-gated, full-contrast rule here was itself
        unmeasured and wrong in two ways at once. */
-    & .crisp-datatable-entity-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: underline; text-decoration-color: color-mix(in srgb, ${c.fgPrimary} 9%, transparent); }
+    /* crisp#851 -- Attio's own entity/record names are measured at
+       font-weight 500, distinct from a plain-text primary column's 400
+       (table.recipe.ts's own \`tbody th\` default). This was never its own
+       explicit style -- it silently rode on a since-fixed header-rule leak
+       (#833/#835/#848) that happened to apply the same 500 to every
+       primary-column body cell regardless of type. Made explicit here so
+       fixing that leak doesn't also (wrongly) drop entity names to 400. */
+    & .crisp-datatable-entity-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: ${c.weight.medium}; text-decoration: underline; text-decoration-color: color-mix(in srgb, ${c.fgPrimary} 9%, transparent); }
     & button.crisp-datatable-entity-name--link { margin: 0; padding: 0; border: none; background: none; font: inherit; color: inherit; letter-spacing: inherit; text-align: start; cursor: pointer; max-width: 100%; }
     /* crisp/#601, G-048: two 20px ghost icons, right-aligned in the primary
        column, revealed on ROW hover (the issue's own title says "row

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

@@ -45,6 +45,23 @@ const config = defineRecipe({
        \`& table\`'s own color) applies to it like every other cell. */
     & thead th { position: sticky; top: 0; z-index: 2; height: ${c.size.tableHeader}; background: ${c.bgSurface}; border-top: 1px solid ${c.borderSubtle}; font-size: ${c.text.lg}; font-weight: ${c.weight.medium}; letter-spacing: -0.14px; color: ${c.fgPrimary}; user-select: none; }
     & td { color: ${c.fgPrimary}; background: ${c.bgSurface}; }
+    /* crisp#851 -- a REGRESSION from #833/#835/#848's own fix: scoping the
+       header rule above to \`thead th\` correctly stopped it leaking onto
+       the primary column's body cell (a real \`<th scope="row">\` since
+       #779), but that same leaked rule's \`font-weight: ${c.weight.medium}\`
+       was the ONLY thing overriding the browser's own UA stylesheet default
+       for \`<th>\` (\`font-weight: bold; text-align: center\`) on that cell --
+       once the leak stopped, a plain-text primary column fell through to
+       bold+centred instead of matching its sibling \`<td>\`s (\`400\`/start,
+       Attio's own plain-text primary cell). \`text-align\` was already safe
+       (the base \`& th, & td\` rule's own \`text-align: start\` above is
+       author-origin and always beats the UA stylesheet regardless of
+       specificity) but is restated here explicitly, defensively -- cheap,
+       and removes any doubt. \`type: "entity"\` primary columns are a
+       separate case (Attio's own entity/record names are 500, not 400) --
+       see \`.crisp-datatable-entity-name\`'s own new explicit weight in
+       datatable.recipe.ts, which wins here by class specificity. */
+    & tbody th { font-weight: ${c.weight.regular}; text-align: start; }
     & th:last-child, & td:last-child { border-inline-end: none; }
     & tbody tr:last-child td { border-bottom: none; }
     /* #554: sticky to the bottom, mirroring \`.crisp-recordstable-sum\`. */

package/dist/styles.css

@@ -801,8 +801,13 @@
     & .crisp-datatable-cell-actions-row { display: flex; align-items: center; gap: var(--crisp-space-1-5); min-width: 0; width: 100%; }
     /* crisp/#601, G-050: measured LIVE (getComputedStyle on the name text, plain hover vs rest) that Attio's underline is unconditional, not a
        hover reveal -- identical at rest and on hover: text-decoration-color
-       is rgba(0,0,0,0.09), a 9% tint, not the name's own full-contrast text colour. The previous :hover-gated, full-contrast rule here was itself unmeasured and wrong in two ways at once. */
-    & .crisp-datatable-entity-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--crisp-fg-primary) 9%, transparent); }
+       is rgba(0,0,0,0.09), a 9% tint, not the name's own full-contrast text colour. The previous :hover-gated, full-contrast rule here was itself unmeasured and wrong in two ways at once. */ /* crisp#851 -- Attio's own entity/record names are measured at
+       font-weight 500, distinct from a plain-text primary column's 400 (table.recipe.ts's own `tbody th` default). This was never its own
+       explicit style -- it silently rode on a since-fixed header-rule leak
+       (#833/#835/#848) that happened to apply the same 500 to every
+       primary-column body cell regardless of type. Made explicit here so
+       fixing that leak doesn't also (wrongly) drop entity names to 400. */
+    & .crisp-datatable-entity-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: var(--crisp-weight-medium); text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--crisp-fg-primary) 9%, transparent); }
     & button.crisp-datatable-entity-name--link { margin: 0; padding: 0; border: none; background: none; font: inherit; color: inherit; letter-spacing: inherit; text-align: start; cursor: pointer; max-width: 100%; }
     /* crisp/#601, G-048: two 20px ghost icons, right-aligned in the primary column, revealed on ROW hover (the issue's own title says "row
        hover", and a live check confirmed hovering well past the name --
@@ -1902,6 +1907,18 @@
        row's own grid line. `thead th` simply never matches `tbody th[scope=row]` at all, so none of this reaches it; the base `& th, & td` rule above (36px, one border-bottom, full opacity via `& table`'s own color) applies to it like every other cell. */
     & thead th { position: sticky; top: 0; z-index: 2; height: var(--crisp-size-tableHeader); background: var(--crisp-bg-surface); border-top: 1px solid var(--crisp-border-subtle); font-size: var(--crisp-text-lg); font-weight: var(--crisp-weight-medium); letter-spacing: -0.14px; color: var(--crisp-fg-primary); user-select: none; }
     & td { color: var(--crisp-fg-primary); background: var(--crisp-bg-surface); }
+    /* crisp#851 -- a REGRESSION from #833/#835/#848's own fix: scoping the header rule above to `thead th` correctly stopped it leaking onto the primary column's body cell (a real `<th scope="row">` since
+       #779), but that same leaked rule's `font-weight: var(--crisp-weight-medium)` was the ONLY thing overriding the browser's own UA stylesheet default
+       for `<th>` (`font-weight: bold; text-align: center`) on that cell --
+       once the leak stopped, a plain-text primary column fell through to
+       bold+centred instead of matching its sibling `<td>`s (`400`/start,
+       Attio's own plain-text primary cell). `text-align` was already safe (the base `& th, & td` rule's own `text-align: start` above is
+       author-origin and always beats the UA stylesheet regardless of
+       specificity) but is restated here explicitly, defensively -- cheap,
+       and removes any doubt. `type: "entity"` primary columns are a
+       separate case (Attio's own entity/record names are 500, not 400) -- see `.crisp-datatable-entity-name`'s own new explicit weight in
+       datatable.recipe.ts, which wins here by class specificity. */
+    & tbody th { font-weight: var(--crisp-weight-regular); text-align: start; }
     & th:last-child, & td:last-child { border-inline-end: none; }
     & tbody tr:last-child td { border-bottom: none; }
     /* #554: sticky to the bottom, mirroring `.crisp-recordstable-sum`. */

package/dist/styles.layered.css

@@ -802,8 +802,13 @@
     & .crisp-datatable-cell-actions-row { display: flex; align-items: center; gap: var(--crisp-space-1-5); min-width: 0; width: 100%; }
     /* crisp/#601, G-050: measured LIVE (getComputedStyle on the name text, plain hover vs rest) that Attio's underline is unconditional, not a
        hover reveal -- identical at rest and on hover: text-decoration-color
-       is rgba(0,0,0,0.09), a 9% tint, not the name's own full-contrast text colour. The previous :hover-gated, full-contrast rule here was itself unmeasured and wrong in two ways at once. */
-    & .crisp-datatable-entity-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--crisp-fg-primary) 9%, transparent); }
+       is rgba(0,0,0,0.09), a 9% tint, not the name's own full-contrast text colour. The previous :hover-gated, full-contrast rule here was itself unmeasured and wrong in two ways at once. */ /* crisp#851 -- Attio's own entity/record names are measured at
+       font-weight 500, distinct from a plain-text primary column's 400 (table.recipe.ts's own `tbody th` default). This was never its own
+       explicit style -- it silently rode on a since-fixed header-rule leak
+       (#833/#835/#848) that happened to apply the same 500 to every
+       primary-column body cell regardless of type. Made explicit here so
+       fixing that leak doesn't also (wrongly) drop entity names to 400. */
+    & .crisp-datatable-entity-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: var(--crisp-weight-medium); text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--crisp-fg-primary) 9%, transparent); }
     & button.crisp-datatable-entity-name--link { margin: 0; padding: 0; border: none; background: none; font: inherit; color: inherit; letter-spacing: inherit; text-align: start; cursor: pointer; max-width: 100%; }
     /* crisp/#601, G-048: two 20px ghost icons, right-aligned in the primary column, revealed on ROW hover (the issue's own title says "row
        hover", and a live check confirmed hovering well past the name --
@@ -1903,6 +1908,18 @@
        row's own grid line. `thead th` simply never matches `tbody th[scope=row]` at all, so none of this reaches it; the base `& th, & td` rule above (36px, one border-bottom, full opacity via `& table`'s own color) applies to it like every other cell. */
     & thead th { position: sticky; top: 0; z-index: 2; height: var(--crisp-size-tableHeader); background: var(--crisp-bg-surface); border-top: 1px solid var(--crisp-border-subtle); font-size: var(--crisp-text-lg); font-weight: var(--crisp-weight-medium); letter-spacing: -0.14px; color: var(--crisp-fg-primary); user-select: none; }
     & td { color: var(--crisp-fg-primary); background: var(--crisp-bg-surface); }
+    /* crisp#851 -- a REGRESSION from #833/#835/#848's own fix: scoping the header rule above to `thead th` correctly stopped it leaking onto the primary column's body cell (a real `<th scope="row">` since
+       #779), but that same leaked rule's `font-weight: var(--crisp-weight-medium)` was the ONLY thing overriding the browser's own UA stylesheet default
+       for `<th>` (`font-weight: bold; text-align: center`) on that cell --
+       once the leak stopped, a plain-text primary column fell through to
+       bold+centred instead of matching its sibling `<td>`s (`400`/start,
+       Attio's own plain-text primary cell). `text-align` was already safe (the base `& th, & td` rule's own `text-align: start` above is
+       author-origin and always beats the UA stylesheet regardless of
+       specificity) but is restated here explicitly, defensively -- cheap,
+       and removes any doubt. `type: "entity"` primary columns are a
+       separate case (Attio's own entity/record names are 500, not 400) -- see `.crisp-datatable-entity-name`'s own new explicit weight in
+       datatable.recipe.ts, which wins here by class specificity. */
+    & tbody th { font-weight: var(--crisp-weight-regular); text-align: start; }
     & th:last-child, & td:last-child { border-inline-end: none; }
     & tbody tr:last-child td { border-bottom: none; }
     /* #554: sticky to the bottom, mirroring `.crisp-recordstable-sum`. */

package/dist/table.css

@@ -23,6 +23,18 @@
        row's own grid line. `thead th` simply never matches `tbody th[scope=row]` at all, so none of this reaches it; the base `& th, & td` rule above (36px, one border-bottom, full opacity via `& table`'s own color) applies to it like every other cell. */
     & thead th { position: sticky; top: 0; z-index: 2; height: var(--crisp-size-tableHeader); background: var(--crisp-bg-surface); border-top: 1px solid var(--crisp-border-subtle); font-size: var(--crisp-text-lg); font-weight: var(--crisp-weight-medium); letter-spacing: -0.14px; color: var(--crisp-fg-primary); user-select: none; }
     & td { color: var(--crisp-fg-primary); background: var(--crisp-bg-surface); }
+    /* crisp#851 -- a REGRESSION from #833/#835/#848's own fix: scoping the header rule above to `thead th` correctly stopped it leaking onto the primary column's body cell (a real `<th scope="row">` since
+       #779), but that same leaked rule's `font-weight: var(--crisp-weight-medium)` was the ONLY thing overriding the browser's own UA stylesheet default
+       for `<th>` (`font-weight: bold; text-align: center`) on that cell --
+       once the leak stopped, a plain-text primary column fell through to
+       bold+centred instead of matching its sibling `<td>`s (`400`/start,
+       Attio's own plain-text primary cell). `text-align` was already safe (the base `& th, & td` rule's own `text-align: start` above is
+       author-origin and always beats the UA stylesheet regardless of
+       specificity) but is restated here explicitly, defensively -- cheap,
+       and removes any doubt. `type: "entity"` primary columns are a
+       separate case (Attio's own entity/record names are 500, not 400) -- see `.crisp-datatable-entity-name`'s own new explicit weight in
+       datatable.recipe.ts, which wins here by class specificity. */
+    & tbody th { font-weight: var(--crisp-weight-regular); text-align: start; }
     & th:last-child, & td:last-child { border-inline-end: none; }
     & tbody tr:last-child td { border-bottom: none; }
     /* #554: sticky to the bottom, mirroring `.crisp-recordstable-sum`. */

package/dist/table.layered.css

@@ -24,6 +24,18 @@
        row's own grid line. `thead th` simply never matches `tbody th[scope=row]` at all, so none of this reaches it; the base `& th, & td` rule above (36px, one border-bottom, full opacity via `& table`'s own color) applies to it like every other cell. */
     & thead th { position: sticky; top: 0; z-index: 2; height: var(--crisp-size-tableHeader); background: var(--crisp-bg-surface); border-top: 1px solid var(--crisp-border-subtle); font-size: var(--crisp-text-lg); font-weight: var(--crisp-weight-medium); letter-spacing: -0.14px; color: var(--crisp-fg-primary); user-select: none; }
     & td { color: var(--crisp-fg-primary); background: var(--crisp-bg-surface); }
+    /* crisp#851 -- a REGRESSION from #833/#835/#848's own fix: scoping the header rule above to `thead th` correctly stopped it leaking onto the primary column's body cell (a real `<th scope="row">` since
+       #779), but that same leaked rule's `font-weight: var(--crisp-weight-medium)` was the ONLY thing overriding the browser's own UA stylesheet default
+       for `<th>` (`font-weight: bold; text-align: center`) on that cell --
+       once the leak stopped, a plain-text primary column fell through to
+       bold+centred instead of matching its sibling `<td>`s (`400`/start,
+       Attio's own plain-text primary cell). `text-align` was already safe (the base `& th, & td` rule's own `text-align: start` above is
+       author-origin and always beats the UA stylesheet regardless of
+       specificity) but is restated here explicitly, defensively -- cheap,
+       and removes any doubt. `type: "entity"` primary columns are a
+       separate case (Attio's own entity/record names are 500, not 400) -- see `.crisp-datatable-entity-name`'s own new explicit weight in
+       datatable.recipe.ts, which wins here by class specificity. */
+    & tbody th { font-weight: var(--crisp-weight-regular); text-align: start; }
     & th:last-child, & td:last-child { border-inline-end: none; }
     & tbody tr:last-child td { border-bottom: none; }
     /* #554: sticky to the bottom, mirroring `.crisp-recordstable-sum`. */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crisp-ui-kit/crisp",
-  "version": "0.55.4",
+  "version": "0.55.5",
   "description": "A lean React design system, measured pixel-for-pixel from Attio.",
   "license": "MIT",
   "type": "module",