Checkbox#

import { component, render } from 'sigx';
import { Checkbox } from '@sigx/daisyui';

const Demo = component(() => {
    return () => (
        <Checkbox checked />
    );
});

render(<Demo />, "#sandbox");

import { component, render } from 'sigx';
import { Checkbox, Col } from '@sigx/daisyui';

const Demo = component(() => {
    return () => (
        <Col gap="2">
            <Checkbox label="Remember me" />
            <Checkbox label="Accept terms" checked />
        </Col>
    );
});

render(<Demo />, "#sandbox");

import { component, render } from 'sigx';
import { Checkbox, Row } from '@sigx/daisyui';

const Demo = component(() => {
    return () => (
        <Row gap="2" wrap>
            <Checkbox checked />
            <Checkbox color="primary" checked />
            <Checkbox color="secondary" checked />
            <Checkbox color="accent" checked />
            <Checkbox color="neutral" checked />
            <Checkbox color="info" checked />
            <Checkbox color="success" checked />
            <Checkbox color="warning" checked />
            <Checkbox color="error" checked />
        </Row>
    );
});

render(<Demo />, "#sandbox");

import { component, render } from 'sigx';
import { Checkbox, Row } from '@sigx/daisyui';

const Demo = component(() => {
    return () => (
        <Row gap="2" items="center" wrap>
            <Checkbox size="xs" checked />
            <Checkbox size="sm" checked />
            <Checkbox size="md" checked />
            <Checkbox size="lg" checked />
            <Checkbox size="xl" checked />
        </Row>
    );
});

render(<Demo />, "#sandbox");

import { component, render } from 'sigx';
import { Checkbox, Row } from '@sigx/daisyui';

const Demo = component(() => {
    return () => (
        <Row gap="4">
            <Checkbox disabled />
            <Checkbox disabled checked />
        </Row>
    );
});

render(<Demo />, "#sandbox");

import { component, render } from 'sigx';
import { Checkbox } from '@sigx/daisyui';

const Demo = component(() => {
    return () => (
        <Checkbox indeterminate />
    );
});

render(<Demo />, "#sandbox");