{"version":3,"file":"ImageTile.CWte_Hi9.mjs","names":[],"sources":["https:/framerusercontent.com/modules/TAc9xYSkqXO77GVxy3XW/qUuxtswqPRl0qp76ZO78/ImageTile.js"],"sourcesContent":["// Image tile component with diagonal line pattern and customizable line color\nimport{jsx as _jsx}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";/**\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight fixed\n */export default function ImageTile(props){const{lineColor=\"#000000\",lineWidth=2,lineSpacing=40,backgroundColor=\"#FFFFFF\",patternDirection=\"diagonal\"}=props;// Properly encode the color for use in SVG\nconst encodedLineColor=lineColor.replace(\"#\",\"%23\");// Define line coordinates based on direction\nconst lines=patternDirection===\"diagonal\"?[{x1:0,y1:0,x2:lineSpacing,y2:lineSpacing},{x1:-lineSpacing,y1:0,x2:0,y2:lineSpacing},{x1:lineSpacing,y1:0,x2:lineSpacing*2,y2:lineSpacing}]:[{x1:0,y1:lineSpacing,x2:lineSpacing,y2:0},{x1:-lineSpacing,y1:lineSpacing,x2:0,y2:0},{x1:lineSpacing,y1:lineSpacing,x2:lineSpacing*2,y2:0}];const svgPattern=`\n        <svg width=\"100%\" height=\"100%\" xmlns=\"http://www.w3.org/2000/svg\">\n            <defs>\n                <pattern id=\"diagonalLines\" x=\"0\" y=\"0\" width=\"${lineSpacing}\" height=\"${lineSpacing}\" patternUnits=\"userSpaceOnUse\">\n                    ${lines.map(line=>`<line x1=\"${line.x1}\" y1=\"${line.y1}\" x2=\"${line.x2}\" y2=\"${line.y2}\" \n                              stroke=\"${encodedLineColor}\" \n                              stroke-width=\"${lineWidth}\" \n                              stroke-linecap=\"square\"/>`).join(\"\")}\n                </pattern>\n            </defs>\n            <rect width=\"100%\" height=\"100%\" fill=\"url(#diagonalLines)\"/>\n        </svg>\n    `;const encodedSvg=encodeURIComponent(svgPattern);return /*#__PURE__*/_jsx(\"div\",{style:{width:\"100%\",height:\"100%\",backgroundColor:backgroundColor,backgroundImage:`url(\"data:image/svg+xml,${encodedSvg}\")`,backgroundSize:`${lineSpacing}px ${lineSpacing}px`,backgroundRepeat:\"repeat\",position:\"relative\",overflow:\"hidden\"}});}addPropertyControls(ImageTile,{lineColor:{type:ControlType.Color,title:\"Line Color\",defaultValue:\"#000000\"},lineWidth:{type:ControlType.Number,title:\"Line Width\",defaultValue:2,min:1,max:10,step:.5,unit:\"px\"},lineSpacing:{type:ControlType.Number,title:\"Line Spacing\",defaultValue:40,min:10,max:100,step:5,unit:\"px\"},patternDirection:{type:ControlType.Enum,title:\"Direction\",options:[\"diagonal\",\"reverseDiagonal\"],optionTitles:[\"↗\",\"↘\"],defaultValue:\"diagonal\",displaySegmentedControl:true},backgroundColor:{type:ControlType.Color,title:\"Background\",defaultValue:\"#FFFFFF\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ImageTile\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutHeight\":\"fixed\",\"framerSupportedLayoutWidth\":\"fixed\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ImageTile.map"],"mappings":"4JAIG,SAAwB,EAAU,EAAM,CAAC,GAAK,CAAC,YAAU,UAAU,YAAU,EAAE,cAAY,GAAG,kBAAgB,UAAU,mBAAiB,YAAY,EAClJ,EAAiB,EAAU,QAAQ,IAAI,KAAK,EACwR,EAAW;;;iEAGpR,EAAY,YAAY,EAAY;uBAHzF,IAAmB,WAAW,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAY,GAAG,CAAW,EAAE,CAAC,GAAG,CAAC,EAAY,GAAG,EAAE,GAAG,EAAE,GAAG,CAAW,EAAE,CAAC,GAAG,EAAY,GAAG,EAAE,GAAG,EAAY,EAAE,GAAG,CAAW,CAAC,EAAE,CAAC,CAAC,GAAG,EAAE,GAAG,EAAY,GAAG,EAAY,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAY,GAAG,EAAY,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC,GAAG,EAAY,GAAG,EAAY,GAAG,EAAY,EAAE,GAAG,CAAC,CAAC,EAAA,CAItS,IAAI,GAAM,aAAa,EAAK,GAAG,QAAQ,EAAK,GAAG,QAAQ,EAAK,GAAG,QAAQ,EAAK,GAAG;wCACnE,EAAiB;8CACX,EAAU;wDACA,CAAC,CAAC,KAAK,EAAE,EAAE;;;;;MAKb,OAAoB,EAAK,MAAM,CAAC,MAAM,CAAC,MAAM,OAAO,OAAO,OAAuB,kBAAgB,gBAAgB,2BAAjJ,mBAAmB,CAAkK,EAAE,IAAI,eAAe,GAAG,EAAY,KAAK,EAAY,IAAI,iBAAiB,SAAS,SAAS,WAAW,SAAS,QAAQ,CAAC,CAAC,CAAE,iBAjB9R,IAAoD,EAiB2O,EAAoB,EAAU,CAAC,UAAU,CAAC,KAAK,EAAY,MAAM,MAAM,aAAa,aAAa,SAAS,EAAE,UAAU,CAAC,KAAK,EAAY,OAAO,MAAM,aAAa,aAAa,EAAE,IAAI,EAAE,IAAI,GAAG,KAAK,GAAG,KAAK,IAAI,EAAE,YAAY,CAAC,KAAK,EAAY,OAAO,MAAM,eAAe,aAAa,GAAG,IAAI,GAAG,IAAI,IAAI,KAAK,EAAE,KAAK,IAAI,EAAE,iBAAiB,CAAC,KAAK,EAAY,KAAK,MAAM,YAAY,QAAQ,CAAC,WAAW,iBAAiB,EAAE,aAAa,CAAC,IAAI,GAAG,EAAE,aAAa,WAAW,wBAAwB,EAAI,EAAE,gBAAgB,CAAC,KAAK,EAAY,MAAM,MAAM,aAAa,aAAa,SAAS,CAAC,CAAC"}