Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Form Field (Single) Checkbox #302

Open
4 of 13 tasks
AlineNap opened this issue Oct 14, 2024 · 5 comments · May be fixed by #341
Open
4 of 13 tasks

Form Field (Single) Checkbox #302

AlineNap opened this issue Oct 14, 2024 · 5 comments · May be fixed by #341
Assignees
@MrSkippy
Labels
complete dod Complete the D.o.D. of the issue new component Adding a new component to the library react Issue involving a ReactJS component

Comments

@AlineNap
Copy link
Contributor

AlineNap commented Oct 14, 2024 •
edited by MrSkippy
Loading

Omschrijving

Dit is een nieuw component. Het lijkt op de de andere Form Field X componenten, het heeft een label, maar deze wordt door type="checkbox" ipv boven het input-element naast het element, een description en error.

Het input-element is <LuxCheckbox />. #319
Het container-element is <LuxFormField /> #232
Zie FormFieldTextbox voor een voorbeeld, maar gebruik type checkbox.

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 ontwikkelaars

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
@AlineNap AlineNap converted this from a draft issue Oct 14, 2024
@AlineNap
Copy link
Contributor Author

AlineNap commented Oct 14, 2024 •
edited
Loading

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 AlineNap mentioned this issue Oct 14, 2024
Draft
3 tasks
@AlineNap AlineNap self-assigned this Oct 15, 2024
@AlineNap
Copy link
Contributor Author

AlineNap commented Oct 21, 2024 •
edited
Loading

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
Copy link
Contributor Author

AlineNap commented Oct 22, 2024 •
edited
Loading

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?

@MrSkippy MrSkippy changed the title Single Checkbox Form Field Single Checkbox Nov 4, 2024
@AlineNap AlineNap removed their assignment Nov 4, 2024
@MrSkippy MrSkippy added new component Adding a new component to the library react Issue involving a ReactJS component labels Nov 4, 2024
@MrSkippy MrSkippy changed the title Form Field Single Checkbox Form Field (Single) Checkbox Nov 4, 2024
@MrSkippy
Copy link
Contributor

MrSkippy commented Nov 4, 2024 •
edited
Loading

Utrecht heeft ondertussen het <FormFieldCheckbox />-component:
React Storybook
React Code

Dit is wat dit component ook doet. Maar ivm eigen subcomponents, maken we het zoals FormFieldTextbox

@MrSkippy MrSkippy self-assigned this Nov 19, 2024
@MrSkippy MrSkippy added the complete dod Complete the D.o.D. of the issue label Nov 19, 2024
@MrSkippy
Copy link
Contributor

https://codefornl.slack.com/archives/C01DAT4TRPF/p1731927537013499?thread_ts=1731924213.609639&cid=C01DAT4TRPF

@MrSkippy MrSkippy linked a pull request Nov 21, 2024 that will close this issue
feat(react): Added FormField Checkbox #341
Open
3 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@MrSkippy MrSkippy

Labels
complete dod Complete the D.o.D. of the issue new component Adding a new component to the library react Issue involving a ReactJS component
Projects
Lux React Components
Status: In progress
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

feat(react): Added FormField Checkbox nl-design-system/lux
2 participants
@MrSkippy @AlineNap