Recurring Meeting Collapsible (frontend)

[tunile943]

Branches: atoms/spinner-input + molecules/recurring-meeting

Task at Hand

atoms/spinner-input

1. View the High Fidelity for the Spinner Input. Reference:

2. Implement input spinner with the below props:

   interface InputSpinnerProps {
   label?: string;
   value: number;  // Default value of the spinner
   min?: number; 
   max?: number;
   step?: number; 
   onChange: (value: number) => void; 
   underlineOnFocus?: boolean;
   disabled?: boolean;
   readOnly?: boolean;
   error?: string; 
   }

3. Confirm that your code and pull request follow the Pull Request Checklist.

   Acceptance Criteria

   • [x] Create reusable atomic component which can be used in different contexts.
   • [x] The component is styled properly per High-Fidelity.

molecules/recurring-meeting

1. View the High Fidelity for the Recurring Meeting collapsible. Reference:

2. Implement the collapsible with the following specification:

   • "This meeting is recurring." should be a checkbox atom. When it is checked, it says "This meeting is recurring". When it's not, it should say "This meeting is not recurring".
   • When "This meeting is recurring", the frequency inputs should pop up. When "This meeting is not recurring", none of the below frequency inputs should pop up.
   • "Every 1 week" should be an input spinner and a dropdown
   • "On S M T W T F S" should be a group of button
   • "Ends" should be a radio group

3. Confirm that your code and pull request follow the Pull Request Checklist.

   Acceptance Criteria

   • [ ] Confirm that design matches Design System (and as described above).

Notes

• No need to connect to backend yet, that will be for another ticket.