{"version":3,"file":"ASCIIButton.grWD7iTO.mjs","names":["useState","useRef"],"sources":["https:/framerusercontent.com/modules/ugT2L7zfAxmyAYe4sHgs/wwh0Uycw7dGISa4nheK1/ASCIIButton.js"],"sourcesContent":["// ASCII-style button with customizable border, text, and styling options\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";import{useState,useEffect,useRef,startTransition}from\"react\";/**\n * @framerSupportedLayoutWidth auto\n * @framerSupportedLayoutHeight auto\n */export default function ASCIIButton(props){const{label=\"hello world\",backgroundColor=\"#000000\",textColor=\"#00FF00\",insideBorderColor=\"#00FF00\",insideBorderWidth=2,insideBorderDashLength=5,size=\"normal\",paddingVertical=12,paddingHorizontal=24,hoverEffect=true,hoverBackgroundColor=\"#00FF00\",hoverTextColor=\"#000000\",linkType=\"url\",link,uploadedFile,openInNewTab=false,typewriterSpeed=50,onClick,style,buttonWidth=\"fit\"}=props;// Determine the effective href based on link type\nconst href=linkType===\"upload\"&&uploadedFile?uploadedFile:linkType===\"url\"&&link?link:undefined;const ButtonElement=href?\"a\":\"button\";const linkProps=href?{href,target:openInNewTab?\"_blank\":\"_self\",rel:openInNewTab?\"noopener noreferrer\":undefined}:{};const[isHovered,setIsHovered]=useState(false);const[visibleChars,setVisibleChars]=useState(label.length);const intervalRef=useRef(null);useEffect(()=>{if(isHovered&&hoverEffect){setVisibleChars(0);let currentIndex=0;if(typeof window!==\"undefined\"){intervalRef.current=window.setInterval(()=>{currentIndex++;if(currentIndex<=label.length){startTransition(()=>setVisibleChars(currentIndex));}else{if(intervalRef.current!==null){clearInterval(intervalRef.current);intervalRef.current=null;}}},typewriterSpeed);}}else{if(intervalRef.current!==null){clearInterval(intervalRef.current);intervalRef.current=null;}startTransition(()=>setVisibleChars(label.length));}return()=>{if(intervalRef.current!==null){clearInterval(intervalRef.current);intervalRef.current=null;}};},[isHovered,hoverEffect,label,typewriterSpeed]);const wrapperStyle={position:\"relative\",display:\"inline-block\",width:buttonWidth===\"full\"?\"100%\":\"max-content\",...style};const buttonStyle={backgroundColor:isHovered&&hoverEffect?hoverBackgroundColor:backgroundColor,color:isHovered&&hoverEffect?hoverTextColor:textColor,border:\"none\",paddingTop:(size===\"small\"?10:14)+insideBorderWidth,paddingBottom:(size===\"small\"?10:14)+insideBorderWidth,paddingLeft:(size===\"small\"?16:24)+insideBorderWidth,paddingRight:(size===\"small\"?16:24)+insideBorderWidth,cursor:\"pointer\",transition:hoverEffect?\"background-color 0.2s ease, color 0.2s ease\":\"none\",userSelect:\"none\",display:\"inline-block\",width:buttonWidth===\"full\"?\"100%\":\"auto\",position:\"relative\",minWidth:buttonWidth===\"full\"?0:\"max-content\",textDecoration:\"none\",fontFamily:\"Arimo, sans-serif\",fontWeight:700,fontSize:size===\"small\"?\"14px\":\"18px\",lineHeight:\"1em\",textAlign:\"center\"};const innerBorderContainerStyle={position:\"absolute\",top:insideBorderWidth,left:insideBorderWidth,right:insideBorderWidth,bottom:insideBorderWidth,pointerEvents:\"none\",overflow:\"visible\"};// Generate dither effect for left and right borders\nconst generateDitherBorder=isLeft=>{const segments=20// Number of segments for the gradient effect\n;let pathData=\"\";const topOffset=-insideBorderWidth*.5// Start slightly above to connect with top border\n;for(let i=0;i<segments;i++){const yStart=topOffset+i/segments*(100-topOffset);const yEnd=topOffset+(i+1)/segments*(100-topOffset);const segmentHeight=(100-topOffset)/segments;// Dash size increases from bottom to top (1px at bottom, larger at top)\n// i=0 is top, i=segments-1 is bottom\n// We want bottom (high i) to have small dashes, top (low i) to have large dashes\nconst progress=(segments-1-i)/(segments-1)// 1 at top, 0 at bottom\n;const dashSize=1+progress*(insideBorderDashLength-1);const gapSize=5;const totalPattern=dashSize+gapSize;// Calculate how many dashes fit in this segment\nconst dashCount=Math.ceil(segmentHeight/totalPattern);for(let j=0;j<dashCount;j++){const dashY=yStart+j*totalPattern;const dashEndY=Math.min(dashY+dashSize,yEnd,100);if(dashY<100){const x=isLeft?0:100;pathData+=`M ${x} ${dashY} L ${x} ${dashEndY} `;}}}return pathData;};return /*#__PURE__*/_jsx(\"div\",{style:wrapperStyle,children:/*#__PURE__*/_jsxs(ButtonElement,{style:buttonStyle,onClick:onClick,...linkProps,onMouseEnter:()=>{if(hoverEffect){startTransition(()=>setIsHovered(true));}},onMouseLeave:()=>{if(hoverEffect){startTransition(()=>setIsHovered(false));}},children:[/*#__PURE__*/_jsx(\"div\",{style:innerBorderContainerStyle,children:/*#__PURE__*/_jsxs(\"svg\",{width:\"100%\",height:\"100%\",viewBox:\"0 0 100 100\",preserveAspectRatio:\"none\",style:{position:\"absolute\",top:0,left:0,width:\"100%\",height:\"100%\",overflow:\"visible\"},children:[/*#__PURE__*/_jsx(\"line\",{x1:\"0\",y1:\"0\",x2:\"100\",y2:\"0\",stroke:insideBorderColor,strokeWidth:insideBorderWidth,vectorEffect:\"non-scaling-stroke\"}),/*#__PURE__*/_jsx(\"line\",{x1:\"0\",y1:\"100\",x2:\"100\",y2:\"100\",stroke:insideBorderColor,strokeWidth:1,strokeDasharray:\"0.5,3\",strokeLinecap:\"square\",vectorEffect:\"non-scaling-stroke\"}),/*#__PURE__*/_jsx(\"path\",{d:generateDitherBorder(true),stroke:insideBorderColor,strokeWidth:insideBorderWidth,fill:\"none\",vectorEffect:\"non-scaling-stroke\",strokeLinecap:\"butt\"}),/*#__PURE__*/_jsx(\"path\",{d:generateDitherBorder(false),stroke:insideBorderColor,strokeWidth:insideBorderWidth,fill:\"none\",vectorEffect:\"non-scaling-stroke\",strokeLinecap:\"butt\"})]})}),label.split(\"\").map((char,index)=>/*#__PURE__*/_jsx(\"span\",{style:{visibility:index<visibleChars?\"visible\":\"hidden\"},children:char},index))]})});}addPropertyControls(ASCIIButton,{label:{type:ControlType.String,title:\"Label\",defaultValue:\"hello world\"},buttonWidth:{type:ControlType.Enum,title:\"Width\",options:[\"fit\",\"full\"],optionTitles:[\"Fit Content\",\"Full Width\"],defaultValue:\"fit\",displaySegmentedControl:true},linkType:{type:ControlType.Enum,title:\"Link Type\",options:[\"url\",\"upload\"],optionTitles:[\"URL\",\"Upload\"],defaultValue:\"url\",displaySegmentedControl:true},link:{type:ControlType.Link,title:\"Link URL\",hidden:({linkType})=>linkType!==\"url\"},// Rename fileLink control to match the uploadedFile prop in ASCIIButtonProps\nuploadedFile:{type:ControlType.File,title:\"Upload File\",allowedFileTypes:[\"jpg\",\"jpeg\",\"png\",\"gif\",\"webp\",\"svg\",\"pdf\",\"doc\",\"docx\",\"txt\"],hidden:({linkType})=>linkType!==\"upload\"},openInNewTab:{type:ControlType.Boolean,title:\"New Tab\",defaultValue:false,enabledTitle:\"Yes\",disabledTitle:\"No\",hidden:({linkType,link})=>linkType===\"url\"&&!link},backgroundColor:{type:ControlType.Color,title:\"Background\",defaultValue:\"#000000\"},textColor:{type:ControlType.Color,title:\"Text Color\",defaultValue:\"#00FF00\"},insideBorderColor:{type:ControlType.Color,title:\"Inside Border Color\",defaultValue:\"#00FF00\"},insideBorderWidth:{type:ControlType.Number,title:\"Inside Border Width\",defaultValue:2,min:1,max:10,step:1,unit:\"px\"},insideBorderDashLength:{type:ControlType.Number,title:\"Inside Dash Length\",defaultValue:5,min:1,max:50,step:1,unit:\"px\"},size:{type:ControlType.Enum,title:\"Size\",options:[\"small\",\"normal\"],optionTitles:[\"Small\",\"Normal\"],defaultValue:\"normal\",displaySegmentedControl:true},paddingVertical:{type:ControlType.Number,title:\"Padding Y\",defaultValue:12,min:0,max:50,step:1,unit:\"px\",hidden:()=>true},paddingHorizontal:{type:ControlType.Number,title:\"Padding X\",defaultValue:24,min:0,max:100,step:1,unit:\"px\",hidden:()=>true},hoverEffect:{type:ControlType.Boolean,title:\"Hover Effect\",defaultValue:true,enabledTitle:\"On\",disabledTitle:\"Off\"},hoverBackgroundColor:{type:ControlType.Color,title:\"Hover BG\",defaultValue:\"#00FF00\",hidden:({hoverEffect})=>!hoverEffect},hoverTextColor:{type:ControlType.Color,title:\"Hover Text\",defaultValue:\"#000000\",hidden:({hoverEffect})=>!hoverEffect},typewriterSpeed:{type:ControlType.Number,title:\"Typewriter Speed\",defaultValue:50,min:10,max:200,step:10,unit:\"ms\",hidden:({hoverEffect})=>!hoverEffect}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ASCIIButton\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"auto\",\"framerSupportedLayoutHeight\":\"auto\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ASCIIButton.map"],"mappings":"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"}