[Ekhorn]

Description

This PR adds a radio-button like a card component intended to be used with or-vaadin-radio-group (as mobile friendly alternative).

Changelog

• Add or-vaadin-radio-card, a more mobile-friendly alternative to vaadin-radio-button for use in or-vaadin-radio-group. It shows the option as a card with an icon slot, reuses the Lumo radio styles and is styled through --or-radio-card-* properties.
• Add Storybook stories and docs for the radio group and the radio card
• Add a styling contract test that checks the theme and every exported component against how Vaadin applies styles
• Rewrite the styling section of ui/AGENTS.md: how Vaadin applies styles with and without @openremote/theme, the public API, and when to use properties, parts, Lumo modules, variants or a new component
• Require US English in code, comments and docs in the root AGENTS.md

Checklist

• 1. Acceptance criteria of the linked issue(s) are met
• 2. Tests are written and all tests pass
• 3. Changes are manually tested by you and the reviewer
• 4. Documentation is written or updated

[Ekhorn]

First check (static get styles) doesn't work yet.. the other check does. Didn't rebuild it works.

diff --git a/ui/component/or-vaadin-components/src/or-vaadin-checkbox.ts b/ui/component/or-vaadin-components/src/or-vaadin-checkbox.ts
index 9d5cee188..b6d7c51e1 100644
--- a/ui/component/or-vaadin-components/src/or-vaadin-checkbox.ts
+++ b/ui/component/or-vaadin-components/src/or-vaadin-checkbox.ts
@@ -22,4 +22,8 @@ import type { OrVaadinComponent } from "./util";
 import type { LitElement } from "lit";
 
 @customElement("or-vaadin-checkbox")
-export class OrVaadinCheckbox extends (Checkbox as new () => Checkbox & LitElement) implements OrVaadinComponent {}
+export class OrVaadinCheckbox extends (Checkbox as new () => Checkbox & LitElement) implements OrVaadinComponent {
+  static get styles() {
+    return [];
+  }
+}
diff --git a/ui/component/theme/src/components/or-vaadin-radio-group.css b/ui/component/theme/src/components/or-vaadin-radio-group.css
index 7d9a1d371..1e4d0a003 100644
--- a/ui/component/theme/src/components/or-vaadin-radio-group.css
+++ b/ui/component/theme/src/components/or-vaadin-radio-group.css
@@ -29,5 +29,5 @@ or-vaadin-radio-group:has(> or-vaadin-radio-card)::part(group-field) {
     lumo_mixins_group-field, lumo_mixins_field-label, lumo_mixins_field-required, lumo_mixins_field-error-message,
     lumo_mixins_field-helper, lumo_components_radio-group, lumo_mixins_field-internal;
   --_lumo-or-vaadin-radio-card-inject: 1;
-  --_lumo-or-vaadin-radio-card-inject-modules: lumo_mixins_checkable-field, lumo_components_radio-button;
+  --_lumo-or-vaadin-radio-card-inject-modules: lumo_mixins_checkable-field, lumo_components_radio-buton;
 }

[MartinaeyNL]

Can we find an alternative for these changes? Would be pity if we have to reference or-vaadin-radio-card in here.

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud