{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/VqaHB3gIRuIUtWjo3LNk/7APsVvTxh9wM4MAEGPy4/Checkbox.js"],
  "sourcesContent": ["import{jsx as _jsx}from\"react/jsx-runtime\";import{useState,useEffect}from\"react\";import{addPropertyControls,ControlType,motion,RenderTarget}from\"framer\";import{colorTokentoValue}from\"https://framer.com/m/framer/default-utils.js@^0.45.0\";async function handleActions(callbacks){for(const cb of callbacks){if(!cb)continue;const value=await cb();if(value===false)break;}}/**\n * CHECKBOX\n *\n * @framerIntrinsicWidth 20\n * @framerIntrinsicHeight 20\n *\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n */ export function Checkbox(props){let{activeBackground,onToggle,onCheck,onUncheck,isChecked,radius,topLeft,topRight,bottomRight,bottomLeft,isMixed,checkSize,color,inactiveBackground,inactiveBorder,activeBorder,hasBorder,borderWidth,transition,backgroundTransition,initialAnimation,disabled,joinType,strokeWidth}=props;const[checked,setChecked]=useState(isChecked);const borderRadius=isMixed?`${topLeft}px ${topRight}px ${bottomRight}px ${bottomLeft}px`:`${radius}px`;useEffect(()=>{setChecked(isChecked);},[isChecked]);initialAnimation=RenderTarget.current()!==RenderTarget.preview?false:initialAnimation;const inactiveBorderStyle=`${borderWidth}px solid ${colorTokentoValue(inactiveBorder)}`;const activeBorderStyle=`${borderWidth}px solid ${colorTokentoValue(activeBorder)}`;const animationBuffer=15;const pathLength=8.5;return(/*#__PURE__*/ _jsx(\"div\",{style:containerStyle,\"data-framer-highlight\":!disabled,children:/*#__PURE__*/ _jsx(motion.div,{// @ts-ignore\nstyle:{...checkboxStyle,borderRadius},initial:initialAnimation?{background:checked?colorTokentoValue(inactiveBackground):colorTokentoValue(activeBackground)}:false,animate:{background:checked?colorTokentoValue(activeBackground):colorTokentoValue(inactiveBackground),border:hasBorder?checked?activeBorderStyle:inactiveBorderStyle:\"none\"},transition:backgroundTransition,onTap:()=>{if(disabled)return;handleActions([()=>onToggle&&onToggle(!checked),onCheck,onUncheck,()=>setChecked(!checked),]);},children:/*#__PURE__*/ _jsx(\"svg\",{viewBox:\"0 0 12 12\",style:{margin:1,width:`${checkSize}%`,height:`${checkSize}%`},children:/*#__PURE__*/ _jsx(motion.path,{d:\"M3 6l2 2 4-4\",fill:\"transparent\",strokeWidth:strokeWidth,stroke:color,strokeLinecap:\"round\",strokeLinejoin:joinType,strokeDasharray:pathLength+animationBuffer,transition:transition,initial:{strokeDashoffset:initialAnimation?checked?pathLength+animationBuffer:animationBuffer:checked?animationBuffer:pathLength+animationBuffer},// initial={false}\nanimate:{strokeDashoffset:checked?animationBuffer:pathLength+animationBuffer+3}})})})}));}Checkbox.defaultProps={height:20,width:20,text:\"Get started!\",activeBackground:\"#0099ff\",activeBorder:\"#0066FF\",inactiveBackground:\"#EBEBEB\",inactiveBorder:\"#a5a5a5\",hasBorder:false,radius:5,isChecked:true,borderWidth:1,strokeWidth:1.5,joinType:\"round\",checkSize:100,color:\"white\",initialAnimation:false,disabled:false,transition:{duration:0.15,ease:[0.12,0.23,0.5,1],type:\"tween\"},backgroundTransition:{duration:0.15,ease:[0.12,0.23,0.5,1],type:\"tween\"}};// Learn more: https://framer.com/api/property-controls/\naddPropertyControls(Checkbox,{isChecked:{title:\"Checked\",type:ControlType.Boolean,defaultValue:true,enabledTitle:\"Yes\",disabledTitle:\"No\"},disabled:{title:\"Disabled\",type:ControlType.Boolean,enabledTitle:\"Yes\",disabledTitle:\"No\"},hasBorder:{title:\"Border\",type:ControlType.Boolean,enabledTitle:\"Yes\",disabledTitle:\"No\"},borderWidth:{title:\"Width\",type:ControlType.Number,defaultValue:Checkbox.defaultProps.borderWidth,hidden:({hasBorder})=>!hasBorder},activeBorder:{title:\"Active\",type:ControlType.Color,defaultValue:Checkbox.defaultProps.activeBackground,hidden:({hasBorder})=>!hasBorder},inactiveBorder:{title:\"Inactive\",type:ControlType.Color,defaultValue:Checkbox.defaultProps.inactiveBackground,hidden:({hasBorder})=>!hasBorder},activeBackground:{title:\"Active\",type:ControlType.Color,defaultValue:Checkbox.defaultProps.activeBackground},inactiveBackground:{title:\"Inactive\",type:ControlType.Color,defaultValue:Checkbox.defaultProps.inactiveBackground},color:{title:\"Check\",type:ControlType.Color,defaultValue:Checkbox.defaultProps.color},checkSize:{title:\"Check Size\",type:ControlType.Number,unit:\"%\",min:0,max:100,defaultValue:Checkbox.defaultProps.checkSize},joinType:{title:\"Corner\",type:ControlType.Enum,displaySegmentedControl:true,options:[\"miter\",\"round\"],optionTitles:[\"Square\",\"Round\"]},strokeWidth:{title:\"Thickness\",type:ControlType.Number,min:1,max:5,step:0.5,displayStepper:true},radius:{title:\"Radius\",type:ControlType.FusedNumber,defaultValue:Checkbox.defaultProps.radius,toggleKey:\"isMixed\",toggleTitles:[\"Radius\",\"Radius per corner\"],valueKeys:[\"topLeft\",\"topRight\",\"bottomRight\",\"bottomLeft\"],valueLabels:[\"TL\",\"TR\",\"BR\",\"BL\"],min:0},transition:{title:\"Check\",type:ControlType.Transition,defaultValue:Checkbox.defaultProps.transition},backgroundTransition:{title:\"Fill\",type:ControlType.Transition,defaultValue:Checkbox.defaultProps.transition},initialAnimation:{title:\"On Load\",type:ControlType.Boolean,enabledTitle:\"Animate\",disabledTitle:\"Instant\"},onToggle:{type:ControlType.EventHandler},onCheck:{type:ControlType.EventHandler},onUncheck:{type:ControlType.EventHandler}});const containerStyle={display:\"flex\",justifyContent:\"center\",alignItems:\"center\",height:\"100%\",width:\"100%\",position:\"absolute\",left:0,right:0,top:0,bottom:0};const checkboxStyle={width:\"100%\",height:\"100%\",borderRadius:6,display:\"flex\",justifyContent:\"center\",alignItems:\"center\",cursor:\"pointer\",WebkitTapHighlightColor:\"rgba(0, 0, 0, 0)\"};\nexport const __FramerMetadata__ = {\"exports\":{\"Checkbox\":{\"type\":\"reactComponent\",\"name\":\"Checkbox\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"fixed\",\"framerIntrinsicWidth\":\"20\",\"framerIntrinsicHeight\":\"20\",\"framerSupportedLayoutHeight\":\"fixed\",\"framerContractVersion\":\"1\"}},\"CheckboxProps\":{\"type\":\"tsType\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Checkbox.map"],
  "mappings": "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",
  "names": ["handleActions", "callbacks", "cb", "Checkbox", "props", "activeBackground", "onToggle", "onCheck", "onUncheck", "isChecked", "radius", "topLeft", "topRight", "bottomRight", "bottomLeft", "isMixed", "checkSize", "color", "inactiveBackground", "inactiveBorder", "activeBorder", "hasBorder", "borderWidth", "transition", "backgroundTransition", "initialAnimation", "disabled", "joinType", "strokeWidth", "checked", "setChecked", "ye", "borderRadius", "ue", "RenderTarget", "inactiveBorderStyle", "colorTokentoValue", "activeBorderStyle", "animationBuffer", "pathLength", "p", "containerStyle", "motion", "checkboxStyle", "addPropertyControls", "ControlType"]
}
