{"ast":null,"code":"var _jsxFileName = \"/Users/mahdi/Documents/work/programming/barnameNegar/arbaeenWebApp/src/components/BoxNextToEachOther/index.js\",\n    _s = $RefreshSig$();\n\nimport React, { useState } from \"react\";\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\n\nconst BoxNextToEachOther = _ref => {\n  _s();\n\n  let {\n    cards,\n    selected\n  } = _ref;\n  const [active, setActive] = useState([]);\n  return /*#__PURE__*/_jsxDEV(\"div\", {\n    className: \"w-fit flex flex-wrap justify-center items-center gap-x-4 md:gap-y-\",\n    children: cards.map((card, index) => /*#__PURE__*/_jsxDEV(\"div\", {\n      className: `relative max-w-[224px] max-h-[210px] w-44 h-44 flex flex-col items-center justify-center text-2xl border border-secondary rounded-md cursor-pointer\n           ${active.includes(card) ? \"bg-secondary\" : \"bg-surface\"}\n\n          `,\n      onClick: () => setActive(active.includes(card) ? active.filter(item => item != card) : [...active, card]),\n      children: [console.log(setActive), /*#__PURE__*/_jsxDEV(\"h2\", {\n        className: `font-bold \n            ${active.includes(card) ? \"text-primaryText\" : \"text-primary\"}\n            `,\n        children: card.title\n      }, void 0, false, {\n        fileName: _jsxFileName,\n        lineNumber: 24,\n        columnNumber: 11\n      }, this), active.includes(card) && /*#__PURE__*/_jsxDEV(\"div\", {\n        className: \"absolute left-3 top-3\",\n        children: /*#__PURE__*/_jsxDEV(\"img\", {\n          src: selected,\n          alt: \"selected-icon\",\n          className: \"w-7\"\n        }, void 0, false, {\n          fileName: _jsxFileName,\n          lineNumber: 33,\n          columnNumber: 15\n        }, this)\n      }, void 0, false, {\n        fileName: _jsxFileName,\n        lineNumber: 32,\n        columnNumber: 13\n      }, this)]\n    }, index, true, {\n      fileName: _jsxFileName,\n      lineNumber: 9,\n      columnNumber: 9\n    }, this))\n  }, void 0, false, {\n    fileName: _jsxFileName,\n    lineNumber: 7,\n    columnNumber: 5\n  }, this);\n};\n\n_s(BoxNextToEachOther, \"G4F9vzmefQ/ZV3KLn4PVxUKPNr0=\");\n\n_c = BoxNextToEachOther;\nexport default BoxNextToEachOther;\nBoxNextToEachOther.defaultProps = {\n  selected: \"images/blue-thick-icon.svg\",\n  cards: [{\n    title: \"زائر\"\n  }, {\n    title: \"خادم\"\n  }, {\n    title: \"ایرانی\"\n  }, {\n    title: \"غیر ایرانی\"\n  }]\n};\n\nvar _c;\n\n$RefreshReg$(_c, \"BoxNextToEachOther\");","map":{"version":3,"names":["React","useState","BoxNextToEachOther","cards","selected","active","setActive","map","card","index","includes","filter","item","console","log","title","defaultProps"],"sources":["/Users/mahdi/Documents/work/programming/barnameNegar/arbaeenWebApp/src/components/BoxNextToEachOther/index.js"],"sourcesContent":["import React, { useState } from \"react\";\n\nconst BoxNextToEachOther = ({ cards, selected }) => {\n  const [active, setActive] = useState([]);\n\n  return (\n    <div className=\"w-fit flex flex-wrap justify-center items-center gap-x-4 md:gap-y-\">\n      {cards.map((card, index) => (\n        <div\n          key={index}\n          className={`relative max-w-[224px] max-h-[210px] w-44 h-44 flex flex-col items-center justify-center text-2xl border border-secondary rounded-md cursor-pointer\n           ${active.includes(card) ? \"bg-secondary\" : \"bg-surface\"}\n\n          `}\n          onClick={() =>\n            setActive(\n              active.includes(card)\n                ? active.filter((item) => item != card)\n                : [...active, card]\n            )\n          }\n        >\n          {console.log(setActive)}\n          <h2\n            className={`font-bold \n            ${active.includes(card) ? \"text-primaryText\" : \"text-primary\"}\n            `}\n          >\n            {card.title}\n          </h2>\n          {active.includes(card) && (\n            <div className=\"absolute left-3 top-3\">\n              <img src={selected} alt=\"selected-icon\" className=\"w-7\" />\n            </div>\n          )}\n        </div>\n      ))}\n    </div>\n  );\n};\n\nexport default BoxNextToEachOther;\n\nBoxNextToEachOther.defaultProps = {\n  selected: \"images/blue-thick-icon.svg\",\n\n  cards: [\n    {\n      title: \"زائر\",\n    },\n    {\n      title: \"خادم\",\n    },\n    {\n      title: \"ایرانی\",\n    },\n    {\n      title: \"غیر ایرانی\",\n    },\n  ],\n};\n"],"mappings":";;;AAAA,OAAOA,KAAP,IAAgBC,QAAhB,QAAgC,OAAhC;;;AAEA,MAAMC,kBAAkB,GAAG,QAAyB;EAAA;;EAAA,IAAxB;IAAEC,KAAF;IAASC;EAAT,CAAwB;EAClD,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsBL,QAAQ,CAAC,EAAD,CAApC;EAEA,oBACE;IAAK,SAAS,EAAC,oEAAf;IAAA,UACGE,KAAK,CAACI,GAAN,CAAU,CAACC,IAAD,EAAOC,KAAP,kBACT;MAEE,SAAS,EAAG;AACtB,aAAaJ,MAAM,CAACK,QAAP,CAAgBF,IAAhB,IAAwB,cAAxB,GAAyC,YAAa;AACnE;AACA,WALQ;MAME,OAAO,EAAE,MACPF,SAAS,CACPD,MAAM,CAACK,QAAP,CAAgBF,IAAhB,IACIH,MAAM,CAACM,MAAP,CAAeC,IAAD,IAAUA,IAAI,IAAIJ,IAAhC,CADJ,GAEI,CAAC,GAAGH,MAAJ,EAAYG,IAAZ,CAHG,CAPb;MAAA,WAcGK,OAAO,CAACC,GAAR,CAAYR,SAAZ,CAdH,eAeE;QACE,SAAS,EAAG;AACxB,cAAcD,MAAM,CAACK,QAAP,CAAgBF,IAAhB,IAAwB,kBAAxB,GAA6C,cAAe;AAC1E,aAHU;QAAA,UAKGA,IAAI,CAACO;MALR;QAAA;QAAA;QAAA;MAAA,QAfF,EAsBGV,MAAM,CAACK,QAAP,CAAgBF,IAAhB,kBACC;QAAK,SAAS,EAAC,uBAAf;QAAA,uBACE;UAAK,GAAG,EAAEJ,QAAV;UAAoB,GAAG,EAAC,eAAxB;UAAwC,SAAS,EAAC;QAAlD;UAAA;UAAA;UAAA;QAAA;MADF;QAAA;QAAA;QAAA;MAAA,QAvBJ;IAAA,GACOK,KADP;MAAA;MAAA;MAAA;IAAA,QADD;EADH;IAAA;IAAA;IAAA;EAAA,QADF;AAkCD,CArCD;;GAAMP,kB;;KAAAA,kB;AAuCN,eAAeA,kBAAf;AAEAA,kBAAkB,CAACc,YAAnB,GAAkC;EAChCZ,QAAQ,EAAE,4BADsB;EAGhCD,KAAK,EAAE,CACL;IACEY,KAAK,EAAE;EADT,CADK,EAIL;IACEA,KAAK,EAAE;EADT,CAJK,EAOL;IACEA,KAAK,EAAE;EADT,CAPK,EAUL;IACEA,KAAK,EAAE;EADT,CAVK;AAHyB,CAAlC"},"metadata":{},"sourceType":"module"}