Single Checkbox

[AlineNap]

Omschrijving

Dit wordt een nieuw component met prefix lux. Deze zullen wij mogelijk terugleveren aan NLDS.

Utrecht-checkbox kan gebruikt worden om dit component mee op te bouwen. Zie: #319

• Figma
• React component utrecht
• Component op NLDS

Definition of ready

• Code check op community component gedaan door lux devs
• Stijling check op community component gedaan door Aline
• Plan voor missende features of bugs van het community component beschreven in het ticket
• Component tokens zijn beschikbaar
• Ticket doorgenomen met Vlad & Mark

Definition of done

Component

• Component is beschikbaar in de index
• Design tokens worden gebruikt

Storybook

• Playground story
• States en properties stories
• Korte beschrijving van het component
  • Wat doet het
  • Basis van het component (bijv Utrecht)
  • Aanpassingen en/of uitbreidingen
  • Relatie met andere componenten (bijv. Form field label en Form field)

Tests

• Het component rendert
• Aanpassingen en/of uitbreidingen werken (zie ook Testing components)
• Visual regression test (door LUX)

Links

• Component:
• Figma NLDS: https://www.figma.com/design/jzxqJv4PtgHJdmOJwY6lYg/NLDS---Bibliotheek---LUX-tokens?node-id=15754-15136
• Community component:
  • CSS:
  • React:
  • Code:

[AlineNap]

Vragen uit stijlingcheck

Deze vragen beantwoorden in: #319 (comment)

• Filled variant van utrecht-checkbox is nu nog niet mogelijk met design tokens op utrecht. Dit mogen we toevoegen op utrecht code. Jullie hebben eerder met Robbert gesproken over hoe dit component verbeterd kan worden. Graag issue maken op utrecht repo. Update: zie issue op utrecht repo, devs graag aanvullen.
• Doen we tussenoplossing voor Mijn Aansluitingen? En wat is die oplossing dan?

[AlineNap]

Wat is de reden dat dit een apart component is in code? Single checkbox? Kan iemand mij dat uitleggen? Dan kan ik er ook een discussie voor starten zodat de help wantend stappen doorlopen kunnen worden.
---> antwoord in comment hieronder.

Verder Vertelde Robbert mij dat hij dit pas ook heeft toegevoegd aan utrecht, dus wellicht kunnen we die hergebruiken?
En ik weet dat MO er ook 1 heeft, wellicht kunnen we die code gebruiken?

[AlineNap]

De single checkbox is niet de form-field-checkbox-option component omdat:

• Andere appearance, stijling;
• Mogelijkheid tot foutmelding op 1 checkbox (dit veld is verplicht);
  • --> Form-field component met een checkbox-group van 1 checkbox is geen optie omdat? Zijn er andere redenen dan geen label in het design?
• Geen form-field-label in het design.
  • --> Wat als je het label verwijderd of hide in dit geval? Kan dat, heeft dat accessibility issues? Wat zijn redenen vanuit HTML/code om dat niet te doen?