{"version":3,"sources":["../src/components/gui/components/XGUIFilePicker.tsx"],"names":["React","Button","Stack","Close","compareProps","prevProps","nextProps","XGUITextField","field","currentValue","onChange","type","uploadFile","useXoraiaValue","bp","useBreakpoint","id","url","uploader","file","_previewUrl","_url","error","XDiv_default","e","XGUIFilePicker_default"],"mappings":"wJAAA,UAAYA,MAAW,QAOvB,OAAS,UAAAC,EAAQ,SAAAC,MAAa,gBAC9B,OAAS,SAAAC,MAAa,sBAItB,IAAMC,EAAe,CAACC,EAAgBC,IAE7BD,EAAU,eAAiBC,EAAU,aASxCC,EAAoD,OACxD,CAAC,CAAE,MAAAC,EAAO,aAAAC,EAAc,SAAAC,EAAU,KAAAC,EAAO,OAAQ,IAAM,CACrD,GAAM,CAAE,WAAAC,CAAW,EAAIC,EAAe,EAEhCC,EAAKC,EAAc,EAEnBC,EAAK,cAAcR,EAAM,OAEzBS,EAAMR,GAAgBD,EAAM,aAE5BU,EAAW,MAAOC,GAAe,CACrC,GAAI,CACF,IAAMC,EAAc,IAAI,gBAAgBD,CAAI,EAK5C,GAFAT,EAASU,EAAaZ,EAAM,KAAMM,CAAE,EAEhCF,EAAY,CACd,IAAMS,EAAO,MAAMT,EAAWO,EAAMR,CAAI,EAGxCD,EAASW,EAAMb,EAAM,KAAMM,CAAE,CAC/B,CACF,OAASQ,EAAP,CACA,QAAQ,MAAM,QAASA,CAAK,CAC9B,CACF,EAEA,OACE,gBAACC,EAAA,CAAK,UAAU,aAAa,IAAKf,EAAM,MACtC,gBAAC,SAAM,UAAU,mBAAmB,QAASQ,GAC1CR,EAAM,KACT,EACA,gBAACN,EAAA,CACC,UAAU,qBACV,UAAU,MACV,QAAS,EACT,GAAI,GAEHe,GACC,gBAACf,EAAA,CACC,GAAI,CACF,MAAO,GACP,OAAQ,GACR,WAAY,CACV,QAAS,OACT,aAAc,CAChB,CACF,EACA,UAAU,iBAEV,gBAAC,OACC,IAAKe,EACL,MAAO,GACP,OAAQ,GACR,MAAO,CAAE,UAAW,OAAQ,EAC5B,QAAQ,OACV,CACF,EAEF,gBAAChB,EAAA,CACC,QAAQ,WACR,UAAU,QACV,KAAK,QAEL,MAAM,UACN,UAAS,IAERgB,EAAM,UAAY,oBACnB,gBAAC,SACC,OAAM,GACN,OAAO,UACP,SAAU,GACV,KAAK,OACL,SAAU,MAAOO,GAAM,CACrB,GAAIA,EAAE,QAAUA,EAAE,OAAO,MAAO,CAC9B,IAAML,EAAOK,EAAE,OAAO,MAAM,GAExBL,GAAM,MAAMD,EAASC,CAAI,CAG/B,CACF,EACF,CACF,EACCF,GACC,gBAAChB,EAAA,CACC,UAAU,cACV,QAAQ,WACR,KAAK,QAEL,MAAM,QACN,GAAI,CACF,SAAU,GACV,gCAAiC,CAAE,MAAO,SAAU,CACtD,EACA,QAAS,IAAM,CAEf,GAEA,gBAACE,EAAA,CACC,UAAU,aACV,GAAI,CAAE,SAAU,UAAW,MAAO,SAAU,EAC9C,CACF,CAEJ,CAYF,CAEJ,EACAC,CACF,EAEOqB,EAAQlB","sourcesContent":["import * as React from \"react\";\nimport XDiv from \"../../core/XDiv\";\nimport {\n  IXGUIFieldBase,\n  TOnChange,\n} from \"../../../utils/interfaces/gui/fields.interfaces\";\n\nimport { Button, Stack } from \"@mui/material\";\nimport { Close } from \"@mui/icons-material\";\nimport { useXoraiaValue } from \"../../../hooks/useXoraia\";\nimport { useBreakpoint } from \"../../../hooks/useBreakpoint\";\n\nconst compareProps = (prevProps: any, nextProps: any) => {\n  // return isEqual(prevProps, nextProps);\n  return prevProps.currentValue === nextProps.currentValue;\n};\n\ninterface XGUITextFieldProps extends IXGUIFieldBase {\n  onChange: TOnChange<string>;\n  currentValue: string;\n  type: \"image\" | \"video\";\n}\n\nconst XGUITextField: React.FC<XGUITextFieldProps> = React.memo(\n  ({ field, currentValue, onChange, type = \"image\" }) => {\n    const { uploadFile } = useXoraiaValue();\n\n    const bp = useBreakpoint();\n\n    const id = `XGUI-FIELD-${field.name}`;\n\n    const url = currentValue ?? field.defaultValue;\n\n    const uploader = async (file: File) => {\n      try {\n        const _previewUrl = URL.createObjectURL(file);\n\n        // ADDING PREVIEW URL FIRST\n        onChange(_previewUrl, field.name, bp);\n\n        if (uploadFile) {\n          const _url = await uploadFile(file, type);\n\n          // THEN ADD THE FINAL URL\n          onChange(_url, field.name, bp);\n        }\n      } catch (error) {\n        console.error(\"ERROR\", error);\n      }\n    };\n\n    return (\n      <XDiv className=\"XGUI-Field\" key={field.name}>\n        <label className=\"XGUI-Field-Label\" htmlFor={id}>\n          {field.label}\n        </label>\n        <Stack\n          className=\"XGUI-Field-Control\"\n          direction=\"row\"\n          spacing={1}\n          ml={1}\n        >\n          {url && (\n            <Stack\n              sx={{\n                width: 30,\n                height: 30,\n                \"& > span\": {\n                  display: \"flex\",\n                  borderRadius: 1,\n                },\n              }}\n              className=\"preview-image\"\n            >\n              <img\n                src={url}\n                width={30}\n                height={30}\n                style={{ objectFit: \"cover\" }}\n                loading=\"lazy\"\n              />\n            </Stack>\n          )}\n          <Button\n            variant=\"outlined\"\n            component=\"label\"\n            size=\"small\"\n            // disabled={disabled}\n            color=\"primary\"\n            fullWidth\n          >\n            {url ? \"Changer\" : \"Choisir une image\"}\n            <input\n              hidden\n              accept=\"image/*\"\n              multiple={false}\n              type=\"file\"\n              onChange={async (e) => {\n                if (e.target && e.target.files) {\n                  const file = e.target.files[0];\n\n                  if (file) await uploader(file);\n\n                  // setUrl(_url);\n                }\n              }}\n            />\n          </Button>\n          {url && (\n            <Button\n              className=\"clear-image\"\n              variant=\"outlined\"\n              size=\"small\"\n              // disabled={disabled}\n              color=\"error\"\n              sx={{\n                minWidth: 30,\n                \"& .close-icon.MuiSvgIcon-root\": { color: \"inherit\" },\n              }}\n              onClick={() => {\n                // setUrl(null);\n              }}\n            >\n              <Close\n                className=\"close-icon\"\n                sx={{ fontSize: \"inherit\", color: \"inherit\" }}\n              />\n            </Button>\n          )}\n        </Stack>\n        {/* <input\n          id={id}\n          className=\"XGUI-Field-Input XGUI-Field-Control\"\n          placeholder={field.placeholder ?? field.label}\n          value={currentValue ?? field.defaultValue}\n          onChange={(e) => {\n            onChange(e.target.value, field.name);\n          }}\n          type={type}\n          min={0}\n        /> */}\n      </XDiv>\n    );\n  },\n  compareProps\n);\n\nexport default XGUITextField;\n"]}