[AlexAndBear]

Description

In the tiles view, the selection checkbox sits inside the tile's link. Its clickable area was only the checkbox plus a bit of padding, and that area gave no visual feedback. So a click that missed the checkbox by a few pixels opened the file or folder instead of selecting it.

This is a real problem in everyday use:

• Selecting several items is the main reason to aim at that corner. When you pick many tiles in a row, one near miss takes you into a folder or opens a file in an editor or viewer. You lose your place, and you may lose the selection too.
• Clicks just outside the checkbox followed the link even though the handler stopped them. The click handler only stopped propagation, so the router ignored the click, but the browser still followed the tile's href. A near miss meant a full page load instead of a selection.
• Small tiles and touch make it worse. At the smallest tile size the checkbox is tiny next to the tile. On touchpads and touchscreens, landing a click exactly on a 20px box is hard.
• No hover feedback. Nothing showed where "select" ended and "open" began, so you couldn't aim with confidence.

What changes

• The checkbox now sits in a 44×44 selection zone in the top-left corner of the tile. The zone's top-left corner follows the tile's own corner radius, and its bottom-right corner is rounded.
• On hover, the zone shows a light neutral grey (bg-role-on-surface/10). The grey is slightly see-through, so it should also work on thumbnails, selected tiles and in dark mode.
• A click anywhere in the zone selects the tile and never opens it. For clicks on the zone's padding, preventDefault() stops the tile link from being followed. Clicks on the checkbox itself are left alone on purpose. Cancelling those would make the browser untick the box after the selection has been saved.
• The zone is sized to fit the smallest tile size without covering the preview icon or the name row.

Screenshots

Hovering the checkbox corner of a tile:

Before	After

Before, nothing marks the clickable area, and a near miss opens the item. After, the 44×44 zone lights up on hover, and any click inside it only selects.

Related Issue

• Fixes: no issue, UX enhancement

How Has This Been Tested?

• test environment: local OpenCloud dev setup (https://host.docker.internal:9201), Chrome on macOS, tiles view
• test case 1: clicking the checkbox selects the tile and ticks the box; clicking it again deselects and unticks it
• test case 2: clicking the corners of the zone, away from the checkbox, selects the tile; the file or folder is not opened and the URL does not change
• test case 3: hovering the zone shows the grey corner highlight
• test case 4: at the smallest tile size (tiles-size=1), the zone fits the tile and does not overlap the preview icon or the name
• test case 5: pnpm test:unit --run packages/web-pkg/tests/unit/components/FilesList/ResourceTiles.spec.ts passes; ESLint and Prettier are clean for the changed file

Types of changes

• Bugfix
• Enhancement (a change that doesn't break existing code or deployments)
• Breaking change (a modification that affects current functionality)
• Technical debt (addressing code that needs refactoring or improvements)
• Tests (adding or improving tests)
• Documentation (updates or additions to documentation)
• Maintenance (like dependency updates or tooling adjustments)

[kulmann]

Huge UX / A11y improvement! Nice!