@crisp-ui-kit/crisp 0.7.2 → 0.7.4

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

@@ -87,6 +87,5 @@ const config = defineRecipe({
 });
 export const wheelpickerRecipe = Object.assign(resolveRecipe(config), {
     config,
-    meta: { medium: { height: "220px", itemHeight: "44px" } },
 });
 export default config;

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

@@ -22,6 +22,5 @@ const config = defineRecipe({
 });
 export const appshellRecipe = Object.assign(resolveRecipe(config), {
     config,
-    meta: { sidebar: { defaultWidth: "275px" } },
 });
 export default config;

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

@@ -34,11 +34,5 @@ const config = defineRecipe({
 });
 export const commandRecipe = Object.assign(resolveRecipe(config), {
     config,
-    meta: {
-        content: {
-            maxWidth: "720px",
-            borderRadius: "16px",
-        },
-    },
 });
 export default config;

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

@@ -21,13 +21,5 @@ const config = defineRecipe({
 });
 export const navitemRecipe = Object.assign(resolveRecipe(config), {
     config,
-    meta: {
-        row: {
-            height: "28px",
-            borderRadius: "9px",
-            fontSize: "14px",
-            fontWeight: "500",
-        },
-    },
 });
 export default config;

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

@@ -43,6 +43,5 @@ const config = defineRecipe({
 });
 export const recordpanelRecipe = Object.assign(resolveRecipe(config), {
     config,
-    meta: { panel: { width: "420px" } },
 });
 export default config;

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

@@ -94,11 +94,21 @@ ${toolbarChromeBody("recordstable")}
     & .recordstable-col-check { width: 40px; min-width: 40px; padding: 0; }
     & .recordstable-check-inner { display: flex; align-items: center; justify-content: center; height: 100%; }
     & .recordstable-col-check, & .recordstable-col-entity { position: sticky; z-index: 3; background: ${c.bgSurface}; }
-    & .recordstable-col-check { left: 0; }
-    & .recordstable-col-entity { left: 40px; clip-path: inset(0 -38px 0 0); transition: box-shadow .2s ease; }
+    /* The sticky pin is a LOGICAL offset: with physical \`left\` these columns
+       were not pinned at all under RTL -- scrolled, they left the viewport
+       entirely (measured: viewport 13..773, check column at x=1333). Nothing in
+       JS measures these, so converting them is safe; the two properties below
+       that have no logical form get an explicit RTL rule rather than being
+       left to point the wrong way. */
+    & .recordstable-col-check { inset-inline-start: 0; }
+    & .recordstable-col-entity { inset-inline-start: 40px; clip-path: inset(0 -38px 0 0); transition: box-shadow .2s ease; }
+    [dir="rtl"] & .recordstable-col-entity { clip-path: inset(0 0 0 -38px); }
     & thead .recordstable-col-check, & thead .recordstable-col-entity { z-index: 4; }
     /* soft shadow on the sticky column edge once the grid is scrolled horizontally */
     & .recordstable-scroll[data-scrolled] .recordstable-col-entity { box-shadow: 6px 0 16px 4px rgba(0,0,0,0.12); }
+    /* 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:
        a full-bleed overlay at #9b69ff 4% (== bgPurple), composited OVER
        whatever row-state background the cell already has, which is why it
@@ -139,11 +149,5 @@ ${toolbarChromeBody("recordstable")}
 });
 export const recordstableRecipe = Object.assign(resolveRecipe(config), {
     config,
-    meta: {
-        row: {
-            height: "36px",
-            gridLine: "1px",
-        },
-    },
 });
 export default config;

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

@@ -34,10 +34,5 @@ const config = defineRecipe({
 });
 export const sidebarRecipe = Object.assign(resolveRecipe(config), {
     config,
-    meta: {
-        container: {
-            width: "275px",
-        },
-    },
 });
 export default config;

package/dist/esm/tokens/scale.js

@@ -43,8 +43,12 @@ export const size = {
     tableRow: "36px", // data-grid row height
     tableHeader: "40px", // data-grid header row height
     header: "48px", // workspace-switcher header height
-    calendarCell: "48px", // calendar day cell / header rhythm (seed x12)
-    calendarPill: "42px", // round day highlight inside a calendar cell
+    // Attio's date picker, measured: 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
 // collapse onto 11/12/13/14/16 (lg = 14px is the default body/label size);

package/dist/native/tokens.js

@@ -198,8 +198,8 @@ export const tokens = {
     "tableRow": 36,
     "tableHeader": 40,
     "header": 48,
-    "calendarCell": 48,
-    "calendarPill": 42
+    "calendarCell": 34,
+    "calendarPill": 32
   },
   "text": {
     "xs": 11,

package/dist/recordstable.css

@@ -149,11 +149,21 @@
     & .recordstable-col-check { width: 40px; min-width: 40px; padding: 0; }
     & .recordstable-check-inner { display: flex; align-items: center; justify-content: center; height: 100%; }
     & .recordstable-col-check, & .recordstable-col-entity { position: sticky; z-index: 3; background: var(--bg-surface); }
-    & .recordstable-col-check { left: 0; }
-    & .recordstable-col-entity { left: 40px; clip-path: inset(0 -38px 0 0); transition: box-shadow .2s ease; }
+    /* The sticky pin is a LOGICAL offset: with physical `left` these columns
+       were not pinned at all under RTL -- scrolled, they left the viewport
+       entirely (measured: viewport 13..773, check column at x=1333). Nothing in
+       JS measures these, so converting them is safe; the two properties below
+       that have no logical form get an explicit RTL rule rather than being
+       left to point the wrong way. */
+    & .recordstable-col-check { inset-inline-start: 0; }
+    & .recordstable-col-entity { inset-inline-start: 40px; clip-path: inset(0 -38px 0 0); transition: box-shadow .2s ease; }
+    [dir="rtl"] & .recordstable-col-entity { clip-path: inset(0 0 0 -38px); }
     & thead .recordstable-col-check, & thead .recordstable-col-entity { z-index: 4; }
     /* soft shadow on the sticky column edge once the grid is scrolled horizontally */
     & .recordstable-scroll[data-scrolled] .recordstable-col-entity { box-shadow: 6px 0 16px 4px rgba(0,0,0,0.12); }
+    /* 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:
        a full-bleed overlay at #9b69ff 4% (== bgPurple), composited OVER
        whatever row-state background the cell already has, which is why it