Checkbox Card

A control that can be toggled on or off.
Properties
disabled
checked
hideCheckbox
Example
Source Code
Installation
"use client";

import React from "react";
import { CheckboxCard } from "@/subframe/components/CheckboxCard";

function CheckboxCardExample() {
  return (
    <CheckboxCard disabled={false} hideCheckbox={false}>
      <div className="flex flex-col items-start">
        <span className="text-body-bold font-body-bold text-default-font">
          Enable notifications
        </span>
        <span className="text-caption font-caption text-subtext-color">
          Be in the loop anytime something happens.
        </span>
      </div>
    </CheckboxCard>
  );
}

export default CheckboxCardExample;

Props

Checkbox Card
Prop
Type
Default
Additional info
disabled
boolean
false
hideCheckbox
boolean
false
children
React.ReactNode
onCheckedChange
(open: boolean) => void
Handler called when opened or closed.

Examples

Basics

Use checked and onCheckedChange props to control the checked state.