CC-60: <Select/> Items Lack Padding

[ianpaschal]

Fixes CC-60

Summary by CodeRabbit

• Style
  • Refined Select component layout with adjusted padding and spacing adjustments for option items
  • Reduced icon sizing within select indicators
  • Improved size-aware styling for options to ensure consistent appearance across different component sizes

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: ASSERTIVE

Plan: Pro

Run ID: d003cfdc-4345-4d4c-a340-5ecad42c4bb0

📥 Commits

Reviewing files that changed from the base of the PR and between d826f94 and 5773f3f.

📒 Files selected for processing (3)

• src/components/Select/Select.module.scss
• src/components/Select/Select.tsx
• src/components/Select/stories/UserOption.module.scss

💤 Files with no reviewable changes (1)

• src/components/Select/stories/UserOption.module.scss

---

Walkthrough

The Select component was updated to support flexible sizing by adjusting option item styling and wiring the size property into style class name computation. Fixed min-height and explicit height constraints were removed from select items and story examples, replaced with explicit padding. The icon size within select item indicators was reduced from 1.25rem to 1rem. The component logic now passes the size value to getStyleClassNames for option items, enabling size-aware styling.

🚥 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 clearly and specifically identifies the main issue being fixed: missing padding in Select component items. It directly corresponds to the primary changes in Select.module.scss.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
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 docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch ian/cc-60-select-items-lack-padding

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 Stylelint (17.11.0)

src/components/Select/Select.module.scss

ConfigurationError: Could not find "stylelint-config-clean-order". Do you need to install the package or use the "configBasedir" option?
at getModulePath (file:///usr/local/lib/node_modules/stylelint/lib/utils/getModulePath.mjs:29:9)
at loadExtendedConfig (file:///usr/local/lib/node_modules/stylelint/lib/augmentConfig.mjs:285:21)
at extendConfig (file:///usr/local/lib/node_modules/stylelint/lib/augmentConfig.mjs:252:25)
at async augmentConfigBasic (file:///usr/local/lib/node_modules/stylelint/lib/augmentConfig.mjs:85:20)
at async augmentConfigFull (file:///usr/local/lib/node_modules/stylelint/lib/augmentConfig.mjs:138:24)
at async getConfigForFile (file:///usr/local/lib/node_modules/stylelint/lib/getConfigForFile.mjs:102:26)
at async resolveOptionValue (file:///usr/local/lib/node_modules/stylelint/lib/utils/resolveOptionValue.mjs:27:24)
at async standalone (file:///usr/local/lib/node_modules/stylelint/lib/standalone.mjs:127:22)

---

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