feat: built in border-continuous

[Brentlok]

#430

Summary by CodeRabbit

• New Features

  • Added border-continuous CSS utility class for styling elements with continuous border curves.

• Tests

  • Added test coverage for the new border-continuous utility to ensure proper functionality.

[coderabbitai]

📝 Walkthrough

Walkthrough

This PR refactors the CSS generation pipeline from dynamically calling generator functions to pre-computed static constants, and introduces a new extra-utilities system. Generator functions for variants and insets are now internal, with their outputs exposed as exported CSS constants. A new extraUtilities module is added to support additional CSS utilities like border-continuous, with helper functions for property name conversion.

Changes

Cohort / File(s)	Summary
CSS Generation Refactoring packages/uniwind/src/css/index.ts, packages/uniwind/src/css/variants.ts, packages/uniwind/src/css/insets.ts	Converted dynamic generator function calls to static pre-computed CSS constants (VARIANTS_CSS, INSETS_CSS). Generator functions remain internal; only the computed CSS strings are exported.
Extra Utilities Feature packages/uniwind/src/css/extraUtilities.ts	New module introducing generateExtraUtilities function with toKebabCase helper and EXTRA_UTILITIES_MAP configuration. Exports EXTRA_UTILITIES_CSS containing @utility blocks for border-continuous.
Constant Rename packages/uniwind/src/css/overwrite.ts	Renamed exported constant from overwrite to OVERWRITE_CSS for consistency with the new naming convention.
Stylesheet Update packages/uniwind/uniwind.css	Added @utility border-continuous { border-curve: continuous; } CSS rule.
Test Coverage packages/uniwind/tests/native/styles-parsing/borders.test.tsx	Added test case for border-continuous utility verifying borderCurve property equals 'continuous'.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~22 minutes

Possibly related PRs

• feat: more built in safe area utilities #280: Modifies packages/uniwind/src/css/insets.ts with related CSS generation refactoring.

Poem

🐰 Static CSS now flows so clear,
No more functions running here—
Constants computed, swift and bright,
Border-continuous looks just right! ✨

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The pull request title 'feat: built in border-continuous' clearly and concisely describes the main change: adding a new built-in CSS utility for border-continuous styling across the codebase.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

• 📝 Generate docstrings (stacked PR)
• 📝 Generate docstrings (commit on current branch)

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feat/border-continuous

Tip

Try Coding Plans. Let us write the prompt for your AI agent so you can ship faster (with fewer bugs).
Share your feedback on Discord.

---

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]

🧹 Nitpick comments (1)

packages/uniwind/src/css/extraUtilities.ts (1)

3-3: Minor note on toKebabCase edge cases.

The current implementation handles simple camelCase well (e.g., borderCurve → border-curve). However, it doesn't handle consecutive uppercase letters correctly (e.g., borderXYZ would become border-x-y-z instead of potentially border-xyz). This is fine for the current use cases, but worth noting if more complex property names are added later.

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@packages/uniwind/src/css/extraUtilities.ts` at line 3, The toKebabCase
function currently splits every uppercase letter individually (e.g., borderXYZ →
border-x-y-z); update toKebabCase to treat consecutive uppercase letters as a
single group so runs like "XYZ" become "-xyz" rather than "-x-y-z", and ensure a
leading hyphen is not left if the input starts with an uppercase letter; locate
the toKebabCase arrow function and replace its regex logic to group consecutive
uppercase characters, lowercase the whole group, prepend a single hyphen, and
trim any leading hyphen from the final result.

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Nitpick comments:
In `@packages/uniwind/src/css/extraUtilities.ts`:
- Line 3: The toKebabCase function currently splits every uppercase letter
individually (e.g., borderXYZ → border-x-y-z); update toKebabCase to treat
consecutive uppercase letters as a single group so runs like "XYZ" become "-xyz"
rather than "-x-y-z", and ensure a leading hyphen is not left if the input
starts with an uppercase letter; locate the toKebabCase arrow function and
replace its regex logic to group consecutive uppercase characters, lowercase the
whole group, prepend a single hyphen, and trim any leading hyphen from the final
result.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 0c1f5776-7287-4beb-a0dc-a8c9006afd41

📥 Commits

Reviewing files that changed from the base of the PR and between 718e798 and af51287.

📒 Files selected for processing (7)

• packages/uniwind/src/css/extraUtilities.ts
• packages/uniwind/src/css/index.ts
• packages/uniwind/src/css/insets.ts
• packages/uniwind/src/css/overwrite.ts
• packages/uniwind/src/css/variants.ts
• packages/uniwind/tests/native/styles-parsing/borders.test.tsx
• packages/uniwind/uniwind.css

[github-actions]

🚀 This pull request is included in v1.6.0. See Release v1.6.0 for release notes.