Fix: truncate text overflow for tags

[IgorSusmelj]

What has changed and why?

Before

or

After

If you hover long enough we also show the title (so users still see the full tag name):

How has it been tested?

• Manual in the GUI as this is only as HTML class change

Did you update CHANGELOG.md?

• Yes
• Not needed (internal change)

Summary by CodeRabbit

• Bug Fixes
  • Long tags in the left-side menu are now truncated instead of overflowing.
  • Checkbox labels now fit more reliably within their available space and display full text on hover.

[coderabbitai]

📝 Walkthrough

Walkthrough

Checkbox layout and label styles now constrain, truncate, and expose the full text of long left-side menu tags. The changelog records this fix.

Changes

Tag label overflow

Layer / File(s)	Summary
Constrain and truncate checkbox labels lightly_studio_view/src/lib/components/Form/Checkbox/Checkbox.svelte, CHANGELOG.md	Checkbox wrappers now constrain flex sizing, while labels truncate long text and bind the full label to title; the changelog documents the fix.

Estimated code review effort: 1 (Trivial) | ~5 minutes

Possibly related PRs

• lightly-ai/lightly-studio#1278: Adds related truncation and full-name tooltip behavior for long display labels.

Suggested reviewers: horatiualmasan

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly matches the main change: truncating long tag text overflow.
Description check	✅ Passed	The description covers the change, testing, and changelog update in the required template sections.
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.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch igor-lig-9934-handle-overflow-for-tags

---

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

[lightly-fast-track-bot]

❌ Fast Track: checks did not pass

Failed guardrails: frontend/complexity (Guardrail threw: Cannot find module 'eslint'
Require stack:

• /home/runner/work/lightly-studio/lightly-studio/lightly_studio_view/package.json), frontend/coverage ( [FAIL] lightly_studio_view/src/lib/components/Form/Checkbox/Checkbox.svelte: no test file found)

Guardrail	Result	Message
dummy	✅	Always passes.
frontend/complexity	❌	Guardrail threw: Cannot find module 'eslint' Require stack: - /home/runner/work/lightly-studio/lightly-studio/lightly_studio_view/package.json
backend/complexity	✅	0 file(s) checked.
backend/coverage	✅	0 file(s) checked.
diff-size	✅	PR adds 6 line(s) (limit: 215).
frontend/coverage	❌	[FAIL] lightly_studio_view/src/lib/components/Form/Checkbox/Checkbox.svelte: no test file found

_{Reflects 3a14adc.}

[IgorSusmelj]

/review

[coderabbitai]

🧹 Nitpick comments (1)

lightly_studio_view/src/lib/components/Form/Checkbox/Checkbox.svelte (1)

23-37: 📐 Maintainability & Code Quality | 🔵 Trivial

Run the frontend validation suite before merge.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@lightly_studio_view/src/lib/components/Form/Checkbox/Checkbox.svelte` around
lines 23 - 37, Run the frontend validation suite for the Checkbox component
changes, including the project’s formatting, linting, type-checking, and
relevant tests, and resolve any failures before merging.

Source: Path instructions

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Nitpick comments:
In `@lightly_studio_view/src/lib/components/Form/Checkbox/Checkbox.svelte`:
- Around line 23-37: Run the frontend validation suite for the Checkbox
component changes, including the project’s formatting, linting, type-checking,
and relevant tests, and resolve any failures before merging.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: d182a813-a97e-4f5e-948a-34e52c510d28

📥 Commits

Reviewing files that changed from the base of the PR and between 75bcf91 and 8b22ca7.

📒 Files selected for processing (2)

• CHANGELOG.md
• lightly_studio_view/src/lib/components/Form/Checkbox/Checkbox.svelte