fix(bricks): add missing *-strong status swatches to variable-picker hex map

[jackgranatowski]

Summary

The five status *-strong tokens appeared as plain text in the Bricks variable-picker dropdown while every other variant for the same family (-subtle, -muted, the base family token) had a colored swatch.

Root cause: resolve_semantic_tokens() in class-color-resolver.php generated *-subtle and *-muted for status families but never *-strong — strong variants are explicitly computed tokens in CSS, not step aliases, so they needed their own generation code.

Fix: Adds a loop that mirrors the light-mode CSS formula:

/* CSS */
--sf-color-success-strong: oklch(from var(--sf-color-success-light) calc(l - 0.15) c h);
--sf-color-warning-strong: oklch(from var(--sf-color-warning-light) calc(l - 0.25) c h);
/* error / info / danger: calc(l - 0.10) */

// PHP approximation
$status_strong_offsets = array(
    'success' => 0.15,
    'warning' => 0.25,
    'error'   => 0.10,
    'info'    => 0.10,
    'danger'  => 0.10,
);
foreach ( $status_strong_offsets as $family => $l_offset ) {
    list( $sl, $sc, $sh ) = $sources[ $family ];
    $hex_map[ '--sf-color-' . $family . '-strong' ] = self::oklch_to_hex(
        max( 0.0, $sl - $l_offset ),
        $sc,
        $sh
    );
}

Resulting swatches (default palette):

Token	oklch approx
--sf-color-success-strong	oklch(0.330 0.17 150) — deep green
--sf-color-warning-strong	oklch(0.500 0.17 80) — dark amber
--sf-color-error-strong	oklch(0.520 0.20 35) — deep red-orange
--sf-color-info-strong	oklch(0.380 0.15 240) — dark blue
--sf-color-danger-strong	oklch(0.380 0.24 12) — deep red

All five produce clearly distinct, saturated swatches that are visually darker than the base family token — matching the "strong = emphasis/accessible contrast" semantic intent.

Test plan

• Open Bricks variable picker and scroll to the status families (danger, error, info, success, warning)
• Verify each *-strong entry now shows a colored swatch (deep/saturated, darker than the base family color)
• Confirm neighboring *-subtle and *-muted swatches are unchanged

https://claude.ai/code/session_01JLvpeyEzNZtgc7TVjVMhzu

---

Generated by Claude Code

Summary by CodeRabbit

• New Features
  • Added strong color variants for status color families (success, warning, error, info, danger) with automatically computed values based on existing light variants.

[coderabbitai]

Warning

Review limit reached

@jackgranatowski, we couldn't start this review because you've reached your PR review rate limit.

More reviews will be available in 40 minutes and 3 seconds. Learn how PR review limits work.

Your organization has run out of usage credits. Purchase more in the billing tab.

⌛ How to resolve this issue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available.

Please see our Fair Usage Limits Policy for further information.

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: a3bdd2e9-9f33-4c28-8ab2-c2ecf5df06d2

📥 Commits

Reviewing files that changed from the base of the PR and between 25e39be and c4a62dc.

📒 Files selected for processing (1)

• plugins/SLASHED-for-WP/integrations/bricks/includes/class-color-resolver.php

📝 Walkthrough

Walkthrough

The PR extends the color resolver to generate strong variants of status colors by computing new --sf-color-{family}-strong tokens from existing resolved colors, adjusting lightness by family-specific offsets while preserving hue and chroma.

Changes

Status Color Strong Variants

Layer / File(s)	Summary
Strong variant generation for status colors plugins/SLASHED-for-WP/integrations/bricks/includes/class-color-resolver.php	The resolve() method extends the hex color map with computed --sf-color-{family}-strong tokens for success, warning, error, info, and danger by deriving each strong variant from the family's resolved light color, reducing its lightness by a per-family offset while preserving chroma and hue; families without resolved sources are skipped.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Possibly related issues

• codeslash-dev/SLASHED#183: This PR's new --sf-color-{family}-strong color variants directly support the swatch localization feature that consumes status color tokens from the color resolver.

Possibly related PRs

• codeslash-dev/SLASHED#23: The main PR generates --sf-color-{family}-strong variants which directly support that PR's refactor to rename status tokens and switch validation state colors to use the *-strong variants.

• codeslash-dev/SLASHED#188: Both PRs modify class-color-resolver.php's color resolution logic for status families, with the main PR adding status strong variants while the other expands semantic swatch generation.

• codeslash-dev/SLASHED#97: Both PRs extend the resolve() output in class-color-resolver.php, with this PR adding "status strong" variants to the resolved hex color map.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately describes the main change: adding missing strong variant status color swatches to the variable picker's hex map in the Bricks integration.
Docstring Coverage	✅ Passed	Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

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

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch claude/color-swatches-ui-variables-lrdQ2

---

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.}