polishing

[planetabhi]

Summary by CodeRabbit

• Chores
  • Updated build tooling dev dependencies to newer minor versions for improved stability.
• Chores
  • Bumped spacing package version and normalized its package description.
• New Features
  • Introduced a base spacing unit and reworked spacing tokens to be derived from it, keeping existing semantic spacing values while enabling consistent, scalable spacing across the UI.

[coderabbitai]

Walkthrough

Bumped two devDependencies in the root package.json, bumped packages/spacings package version and normalized its description, and refactored spacing tokens in packages/spacings/src/_variables.scss to derive all spacing values from a new base --spacing CSS variable.

Changes

Cohort / File(s)	Summary
Root dev dependency bumps package.json	Updated devDependencies: @parcel/transformer-sass and parcel from ^2.14.4 → ^2.16.0.
Package metadata packages/spacings/package.json	Version bumped 0.1.5 → 0.1.6; description changed from Spacing Blocks → Spacing blocks.
Spacing tokens refactor packages/spacings/src/_variables.scss	Added --spacing: 0.125rem and replaced explicit spacing values with derived expressions using var(--spacing) and calc(var(--spacing) * N) for --spacing-01 … --spacing-18; --spacing-00 set to 0px.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

I nibble at the base unit seed,
tiny hops make spacing grow indeed.
Variables sprout, a tidy line,
rhythms uniform, margins fine.
A rabbit's joy — design in seed.

Pre-merge checks and finishing touches

❌ Failed checks (1 inconclusive)

Check name	Status	Explanation	Resolution
Title Check	❓ Inconclusive	The title "polishing" is too vague and does not convey the PR's main change; the diff shows a substantive refactor that introduces a base --spacing token and derives the spacing scale (plus package version/devDependency updates), so the title should describe that primary intent.	Please rename the PR to a concise, specific sentence that highlights the main change, for example: "Introduce base --spacing and derive spacing scale" or "Refactor spacing tokens to use --spacing (and bump parcel devDeps)".

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.

✨ Finishing touches

🧪 Generate unit tests

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feature

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (3)

packages/spacings/src/_variables.scss (3)

2-22: Namespace the base variable and add a safe fallback to avoid global collisions.

--spacing is very generic and lives in :root; easy to clash with app/global CSS. Recommend a namespaced base (keep --spacing as an alias for backward compatibility) and use a fallback in derived tokens so partial imports don’t break.

Apply:

 :root {
-  --spacing: 0.125rem;
+  /* Namespaced base + legacy alias */
+  --ds-spacing: 0.125rem;
+  --spacing: var(--ds-spacing);
   
-  --spacing-00: 0px;                         /* 0rem */
-  --spacing-01: var(--spacing);              /* 0.125rem */
-  --spacing-02: calc(var(--spacing) * 2);    /* 0.25rem */
-  --spacing-03: calc(var(--spacing) * 3);    /* 0.375rem */
-  --spacing-04: calc(var(--spacing) * 4);    /* 0.5rem */
-  --spacing-05: calc(var(--spacing) * 6);    /* 0.75rem */
-  --spacing-06: calc(var(--spacing) * 8);    /* 1rem */
-  --spacing-07: calc(var(--spacing) * 10);   /* 1.25rem */
-  --spacing-08: calc(var(--spacing) * 12);   /* 1.5rem */
-  --spacing-09: calc(var(--spacing) * 16);   /* 2rem */
-  --spacing-10: calc(var(--spacing) * 20);   /* 2.5rem */
-  --spacing-11: calc(var(--spacing) * 24);   /* 3rem */
-  --spacing-12: calc(var(--spacing) * 28);   /* 3.5rem */
-  --spacing-13: calc(var(--spacing) * 32);   /* 4rem */
-  --spacing-14: calc(var(--spacing) * 36);   /* 4.5rem */
-  --spacing-15: calc(var(--spacing) * 40);   /* 5rem */
-  --spacing-16: calc(var(--spacing) * 48);   /* 6rem */
-  --spacing-17: calc(var(--spacing) * 60);   /* 7.5rem */
-  --spacing-18: calc(var(--spacing) * 80);   /* 10rem */
+  --spacing-00: 0px;                                       /* 0rem */
+  --spacing-01: var(--ds-spacing, 0.125rem);               /* 0.125rem */
+  --spacing-02: calc(var(--ds-spacing, 0.125rem) * 2);     /* 0.25rem */
+  --spacing-03: calc(var(--ds-spacing, 0.125rem) * 3);     /* 0.375rem */
+  --spacing-04: calc(var(--ds-spacing, 0.125rem) * 4);     /* 0.5rem */
+  --spacing-05: calc(var(--ds-spacing, 0.125rem) * 6);     /* 0.75rem */
+  --spacing-06: calc(var(--ds-spacing, 0.125rem) * 8);     /* 1rem */
+  --spacing-07: calc(var(--ds-spacing, 0.125rem) * 10);    /* 1.25rem */
+  --spacing-08: calc(var(--ds-spacing, 0.125rem) * 12);    /* 1.5rem */
+  --spacing-09: calc(var(--ds-spacing, 0.125rem) * 16);    /* 2rem */
+  --spacing-10: calc(var(--ds-spacing, 0.125rem) * 20);    /* 2.5rem */
+  --spacing-11: calc(var(--ds-spacing, 0.125rem) * 24);    /* 3rem */
+  --spacing-12: calc(var(--ds-spacing, 0.125rem) * 28);    /* 3.5rem */
+  --spacing-13: calc(var(--ds-spacing, 0.125rem) * 32);    /* 4rem */
+  --spacing-14: calc(var(--ds-spacing, 0.125rem) * 36);    /* 4.5rem */
+  --spacing-15: calc(var(--ds-spacing, 0.125rem) * 40);    /* 5rem */
+  --spacing-16: calc(var(--ds-spacing, 0.125rem) * 48);    /* 6rem */
+  --spacing-17: calc(var(--ds-spacing, 0.125rem) * 60);    /* 7.5rem */
+  --spacing-18: calc(var(--ds-spacing, 0.125rem) * 80);    /* 10rem */
 }

---

4-4: Nit: Use unitless zero.

Prefer 0 over 0px.

-  --spacing-00: 0px;                         /* 0rem */
+  --spacing-00: 0;                           /* 0rem */

---

5-22: Optional: Generate tokens via SCSS to reduce drift.

A tiny map + loop keeps scale definitions and comments in sync if the base changes.

$spacing-mults: (
);

:root {
  --ds-spacing: 0.125rem;
  --spacing: var(--ds-spacing);
  --spacing-00: 0;

  @each $k, $m in $spacing-mults {
    --spacing-#{$k}: calc(var(--ds-spacing, 0.125rem) * #{$m}); /* #{0.125rem * $m} */
  }
}

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 1ed0031 and 9892a32.

⛔ Files ignored due to path filters (4)

• packages/spacings/bun.lock is excluded by !**/*.lock
• packages/spacings/dist/index.css is excluded by !**/dist/**
• packages/spacings/dist/index.css.map is excluded by !**/dist/**, !**/*.map
• packages/spacings/pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (2)

• packages/spacings/package.json (1 hunks)
• packages/spacings/src/_variables.scss (1 hunks)

✅ Files skipped from review due to trivial changes (1)

• packages/spacings/package.json

🔇 Additional comments (2)

packages/spacings/src/_variables.scss (2)

2-22: Solid tokenization; scale is consistent and math checks out.

Deriving the whole scale from a single base is a good move; comments match the computed rem values.

---

2-2: No repo-wide collisions for --spacing found.
Searched tracked files (git ls-files → ripgrep) for --spacing and the declaration pattern --spacing\s*:; no matches.