@radix-ui/themes/dist/esm/components/checkbox-cards.js

[](https://radix-ui.com/themes)

"use client";import*as o from"react";import p from"classnames";import{createContextScope as f}from"@radix-ui/react-context";import*as i from"./checkbox-group.primitive.js";import{createCheckboxGroupScope as h}from"./checkbox-group.primitive.js";import{checkboxCardsRootPropDefs as l}from"./checkbox-cards.props.js";import{baseCheckboxPropDefs as u}from"./base-checkbox.props.js";import{extractProps as x}from"../helpers/index.js";import{marginPropDefs as R}from"../props/index.js";import{Grid as y}from"./grid.js";import{ThickCheckIcon as I}from"./icons.js";const d="CheckboxCards",[G]=f(d,[h]),n=h(),[v,N]=G(d),b=o.forwardRef((e,s)=>{const{__scopeCheckboxCards:r,className:c,color:a,...C}=x(e,l,R),t=n(r);return o.createElement(v,{scope:r,size:e.size,highContrast:e.highContrast},o.createElement(y,{asChild:!0},o.createElement(i.Root,{...t,"data-accent-color":a,...C,ref:s,className:p("rt-CheckboxCardsRoot",c)})))});b.displayName="CheckboxCards.Root";const k=o.forwardRef(({__scopeCheckboxCards:e,children:s,className:r,style:c,...a},C)=>{const t=N("CheckboxCardsItem",e),m=n(e),{className:P}=x({size:t?.size,variant:"surface",highContrast:t?.highContrast},u);return o.createElement("label",{className:p("rt-BaseCard","rt-CheckboxCardsItem",r),style:c},s,o.createElement(i.Item,{...m,...a,ref:C,className:p("rt-reset","rt-BaseCheckboxRoot","rt-CheckboxCardCheckbox",P)},o.createElement(i.Indicator,{...m,asChild:!0,className:"rt-BaseCheckboxIndicator"},o.createElement(I,null))))});k.displayName="CheckboxCards.Item";export{k as Item,b as Root};
//# sourceMappingURL=checkbox-cards.js.map