rx.checkbox("Basic Checkbox")

class CheckboxBasicState(rx.State):
    checked: bool = False

    @rx.event
    def set_checked(self, value: bool):
        self.checked = value


rx.vstack(
    rx.heading(CheckboxBasicState.checked.to_string(), size="5"),
    rx.checkbox("Click me", on_change=CheckboxBasicState.set_checked),
)

class CheckboxControlState(rx.State):
    apples: bool = True
    pears: bool = False

    @rx.event
    def set_apples(self, value: bool):
        self.apples = value

    @rx.event
    def set_pears(self, value: bool):
        self.pears = value

    @rx.event
    def set_all(self, value: bool):
        self.apples = value
        self.pears = value


rx.vstack(
    rx.checkbox(
        "All fruits",
        checked=CheckboxControlState.apples & CheckboxControlState.pears,
        on_change=CheckboxControlState.set_all,
    ),
    rx.checkbox("Apples", checked=CheckboxControlState.apples, on_change=CheckboxControlState.set_apples, margin_left="1.5em"),
    rx.checkbox("Pears", checked=CheckboxControlState.pears, on_change=CheckboxControlState.set_pears, margin_left="1.5em"),
    rx.hstack(
        rx.button("Check all", on_click=CheckboxControlState.set_all(True), size="1", variant="soft"),
        rx.button("Clear", on_click=CheckboxControlState.set_all(False), size="1", variant="soft", color_scheme="gray"),
    ),
)

rx.flex(
    rx.checkbox("Starts checked", default_checked=True),
    rx.checkbox("Starts empty"),
    rx.checkbox("Locked on", default_checked=True, disabled=True),
    spacing="4",
    wrap="wrap",
)

class CheckboxFormState(rx.State):
    form_data: dict = {}

    @rx.event
    def handle_submit(self, form_data: dict):
        self.form_data = form_data


rx.card(
    rx.vstack(
        rx.form.root(
            rx.vstack(
                rx.checkbox("Accept terms and conditions", name="terms", required=True),
                rx.checkbox("Send me news", name="news", value="yes"),
                rx.button("Submit", type="submit"),
            ),
            on_submit=CheckboxFormState.handle_submit,
            reset_on_submit=True,
        ),
        rx.divider(),
        rx.hstack(rx.text("Results:", weight="bold"), rx.badge(CheckboxFormState.form_data.to_string())),
    ),
)

class CheckboxSignupState(rx.State):
    agreed: bool = False
    done: bool = False

    @rx.event
    def set_agreed(self, value: bool):
        self.agreed = value
        self.done = False

    @rx.event
    def sign_up(self):
        self.done = True


rx.card(
    rx.vstack(
        rx.checkbox(
            "I agree to the Terms of Service",
            checked=CheckboxSignupState.agreed,
            on_change=CheckboxSignupState.set_agreed,
        ),
        rx.button("Sign up", on_click=CheckboxSignupState.sign_up, disabled=~CheckboxSignupState.agreed),
        rx.cond(CheckboxSignupState.done, rx.badge("Welcome aboard!", color_scheme="green")),
        spacing="3",
    ),
)