{"version":3,"file":"Canvas.mjs","sources":["../../../../../../packages/components/qrcode/src/Canvas.tsx"],"sourcesContent":["import type { CSSProperties } from 'vue';\nimport { computed, defineComponent, shallowRef, watch, watchEffect } from 'vue';\nimport {\n  DEFAULT_BGCOLOR,\n  DEFAULT_FGCOLOR,\n  DEFAULT_INCLUDEMARGIN,\n  DEFAULT_LEVEL,\n  DEFAULT_SIZE,\n  ERROR_LEVEL_MAP,\n} from './constant';\nimport { qrcodeCanvasProps } from './props';\nimport QrcodeGen from './qrcodegen';\nimport { excavateModules, generatePath, getImageSettings, getMarginSize, SUPPORTS_PATH2D } from './util';\n\nexport default defineComponent({\n  name: 'QRCodeCanvas',\n  inheritAttrs: false,\n  props: qrcodeCanvasProps(),\n  setup(props, { attrs, expose }) {\n    const imgSrc = computed(() => props.imageSettings?.src);\n    const _canvas = shallowRef<HTMLCanvasElement>(null);\n    const _image = shallowRef<HTMLImageElement>(null);\n    const isImgLoaded = shallowRef(false);\n    expose({\n      toDataURL: (type?: string, quality?: any) => {\n        return _canvas.value?.toDataURL(type, quality);\n      },\n    });\n    watchEffect(\n      () => {\n        const {\n          value,\n          size = DEFAULT_SIZE,\n          level = DEFAULT_LEVEL,\n          bgColor = DEFAULT_BGCOLOR,\n          fgColor = DEFAULT_FGCOLOR,\n          includeMargin = DEFAULT_INCLUDEMARGIN,\n          marginSize,\n          imageSettings,\n        } = props;\n        if (_canvas.value != null) {\n          const canvas = _canvas.value;\n\n          const ctx = canvas.getContext('2d');\n          if (!ctx)\n            return;\n\n          let cells = QrcodeGen.QrCode.encodeText(value, ERROR_LEVEL_MAP[level]).getModules();\n          const margin = getMarginSize(includeMargin, marginSize);\n          const numCells = cells.length + margin * 2;\n          const calculatedImageSettings = getImageSettings(cells, size, margin, imageSettings);\n\n          const image = _image.value;\n          const haveImageToRender\n            = isImgLoaded.value\n            && calculatedImageSettings != null\n            && image !== null\n            && image.complete\n            && image.naturalHeight !== 0\n            && image.naturalWidth !== 0;\n\n          if (haveImageToRender) {\n            if (calculatedImageSettings.excavation != null)\n              cells = excavateModules(cells, calculatedImageSettings.excavation);\n          }\n\n          // We're going to scale this so that the number of drawable units\n          // matches the number of cells. This avoids rounding issues, but does\n          // result in some potentially unwanted single pixel issues between\n          // blocks, only in environments that don't support Path2D.\n          const pixelRatio = window.devicePixelRatio || 1;\n          canvas.height = canvas.width = size * pixelRatio;\n          const scale = (size / numCells) * pixelRatio;\n          ctx.scale(scale, scale);\n\n          // Draw solid background, only paint dark modules.\n          ctx.fillStyle = bgColor;\n          ctx.fillRect(0, 0, numCells, numCells);\n\n          ctx.fillStyle = fgColor;\n          if (SUPPORTS_PATH2D) {\n            // $FlowFixMe: Path2D c'tor doesn't support args yet.\n            ctx.fill(new Path2D(generatePath(cells, margin)));\n          } else {\n            cells.forEach((row, rdx) => {\n              row.forEach((cell, cdx) => {\n                if (cell)\n                  ctx.fillRect(cdx + margin, rdx + margin, 1, 1);\n              });\n            });\n          }\n\n          if (haveImageToRender) {\n            ctx.drawImage(\n              image,\n              calculatedImageSettings.x + margin,\n              calculatedImageSettings.y + margin,\n              calculatedImageSettings.w,\n              calculatedImageSettings.h,\n            );\n          }\n        }\n      },\n      { flush: 'post' },\n    );\n    watch(imgSrc, () => {\n      isImgLoaded.value = false;\n    });\n\n    return () => {\n      const size = props.size ?? DEFAULT_SIZE;\n      const canvasStyle = { height: `${size}px`, width: `${size}px` };\n\n      let img = null;\n      if (imgSrc.value != null) {\n        img = (\n          <img\n            src={imgSrc.value}\n            key={imgSrc.value}\n            style={{ display: 'none' }}\n            onLoad={() => {\n              isImgLoaded.value = true;\n            }}\n            ref={_image}\n          />\n        );\n      }\n      return (\n        <>\n          <canvas {...attrs} style={[canvasStyle, attrs.style as CSSProperties]} ref={_canvas} />\n          {img}\n        </>\n      );\n    };\n  },\n});\n"],"names":["name","inheritAttrs","props","qrcodeCanvasProps","setup","attrs","expose","imgSrc","computed","imageSettings","src","_canvas","shallowRef","_image","isImgLoaded","toDataURL","type","quality","value","watchEffect","size","DEFAULT_SIZE","level","DEFAULT_LEVEL","bgColor","DEFAULT_BGCOLOR","fgColor","DEFAULT_FGCOLOR","includeMargin","DEFAULT_INCLUDEMARGIN","marginSize","canvas","ctx","getContext","cells","QrcodeGen","QrCode","encodeText","ERROR_LEVEL_MAP","getModules","margin","getMarginSize","numCells","length","calculatedImageSettings","getImageSettings","image","haveImageToRender","complete","naturalHeight","naturalWidth","excavation","excavateModules","pixelRatio","window","devicePixelRatio","height","width","scale","fillStyle","fillRect","SUPPORTS_PATH2D","fill","Path2D","generatePath","forEach","row","rdx","cell","cdx","drawImage","x","y","w","h","flush","watch","canvasStyle","img","_createVNode","display","onLoad","_Fragment","style"],"mappings":";;;;;;AAcA,mCAA+B,eAAA,CAAA;AAAA,EAC7BA,IAAM,EAAA,cAAA;AAAA,EACNC,YAAc,EAAA,KAAA;AAAA,EACdC,OAAOC,iBAAkB,EAAA;AAAA,EACzBC,MAAMF,KAAO,EAAA;AAAA,IAAEG,KAAAA;AAAAA,IAAOC,MAAAA;AAAAA,GAAU,EAAA;AAC9B,IAAMC,MAAAA,MAAAA,GAASC,SAAS,MAAA;;AAAMN,MAAAA,OAAAA,CAAAA,EAAAA,GAAAA,KAAAA,CAAMO,kBAANP,IAAqBQ,GAAAA,KAAAA,CAAAA,GAAAA,EAAAA,CAAAA,GAAAA,CAAAA;AAAAA,KAAG,CAAA,CAAA;AACtD,IAAMC,MAAAA,OAAAA,GAAUC,WAA8B,IAAI,CAAA,CAAA;AAClD,IAAMC,MAAAA,MAAAA,GAASD,WAA6B,IAAI,CAAA,CAAA;AAChD,IAAME,MAAAA,WAAAA,GAAcF,WAAW,KAAK,CAAA,CAAA;AACpCN,IAAO,MAAA,CAAA;AAAA,MACLS,SAAAA,EAAWA,CAACC,IAAAA,EAAeC,OAAkB,KAAA;;AAC3C,QAAA,OAAA,CAAON,EAAQO,GAAAA,OAAAA,CAAAA,KAAAA,KAARP,IAAeI,GAAAA,KAAAA,CAAAA,GAAAA,EAAAA,CAAAA,SAAAA,CAAUC,IAAMC,EAAAA,OAAAA,CAAAA,CAAAA;AAAAA,OACxC;AAAA,KACD,CAAA,CAAA;AACDE,IAAAA,WAAAA,CACE,MAAM;AACJ,MAAM,MAAA;AAAA,QACJD,KAAAA;AAAAA,QACAE,IAAOC,GAAAA,YAAAA;AAAAA,QACPC,KAAQC,GAAAA,aAAAA;AAAAA,QACRC,OAAUC,GAAAA,eAAAA;AAAAA,QACVC,OAAUC,GAAAA,eAAAA;AAAAA,QACVC,aAAgBC,GAAAA,qBAAAA;AAAAA,QAChBC,UAAAA;AAAAA,QACArB,aAAAA;AAAAA,OACEP,GAAAA,KAAAA,CAAAA;AACJ,MAAIS,IAAAA,OAAAA,CAAQO,SAAS,IAAM,EAAA;AACzB,QAAA,MAAMa,SAASpB,OAAQO,CAAAA,KAAAA,CAAAA;AAEvB,QAAMc,MAAAA,GAAAA,GAAMD,MAAOE,CAAAA,UAAAA,CAAW,IAAI,CAAA,CAAA;AAClC,QAAA,IAAI,CAACD,GAAAA;AACH,UAAA,OAAA;AAEF,QAAIE,IAAAA,KAAAA,GAAQC,UAAUC,MAAOC,CAAAA,UAAAA,CAAWnB,OAAOoB,eAAgBhB,CAAAA,KAAK,CAAC,CAAA,CAAEiB,UAAW,EAAA,CAAA;AAClF,QAAMC,MAAAA,MAAAA,GAASC,aAAcb,CAAAA,aAAAA,EAAeE,UAAU,CAAA,CAAA;AACtD,QAAMY,MAAAA,QAAAA,GAAWR,KAAMS,CAAAA,MAAAA,GAASH,MAAS,GAAA,CAAA,CAAA;AACzC,QAAA,MAAMI,uBAA0BC,GAAAA,gBAAAA,CAAiBX,KAAOd,EAAAA,IAAAA,EAAMoB,QAAQ/B,aAAa,CAAA,CAAA;AAEnF,QAAA,MAAMqC,QAAQjC,MAAOK,CAAAA,KAAAA,CAAAA;AACrB,QAAA,MAAM6B,iBACFjC,GAAAA,WAAAA,CAAYI,KACX0B,IAAAA,uBAAAA,IAA2B,IAC3BE,IAAAA,KAAAA,KAAU,IACVA,IAAAA,KAAAA,CAAME,QACNF,IAAAA,KAAAA,CAAMG,aAAkB,KAAA,CAAA,IACxBH,MAAMI,YAAiB,KAAA,CAAA,CAAA;AAE5B,QAAA,IAAIH,iBAAmB,EAAA;AACrB,UAAA,IAAIH,wBAAwBO,UAAc,IAAA,IAAA;AACxCjB,YAAQkB,KAAAA,GAAAA,eAAAA,CAAgBlB,KAAOU,EAAAA,uBAAAA,CAAwBO,UAAU,CAAA,CAAA;AAAA,SACrE;AAMA,QAAME,MAAAA,UAAAA,GAAaC,OAAOC,gBAAoB,IAAA,CAAA,CAAA;AAC9CxB,QAAOyB,MAAAA,CAAAA,MAAAA,GAASzB,MAAO0B,CAAAA,KAAAA,GAAQrC,IAAOiC,GAAAA,UAAAA,CAAAA;AACtC,QAAMK,MAAAA,KAAAA,GAAStC,OAAOsB,QAAYW,GAAAA,UAAAA,CAAAA;AAClCrB,QAAI0B,GAAAA,CAAAA,KAAAA,CAAMA,OAAOA,KAAK,CAAA,CAAA;AAGtB1B,QAAAA,GAAAA,CAAI2B,SAAYnC,GAAAA,OAAAA,CAAAA;AAChBQ,QAAAA,GAAAA,CAAI4B,QAAS,CAAA,CAAA,EAAG,CAAGlB,EAAAA,QAAAA,EAAUA,QAAQ,CAAA,CAAA;AAErCV,QAAAA,GAAAA,CAAI2B,SAAYjC,GAAAA,OAAAA,CAAAA;AAChB,QAAA,IAAImC,eAAiB,EAAA;AAEnB7B,UAAAA,GAAAA,CAAI8B,KAAK,IAAIC,MAAAA,CAAOC,aAAa9B,KAAOM,EAAAA,MAAM,CAAC,CAAC,CAAA,CAAA;AAAA,SAC3C,MAAA;AACLN,UAAM+B,KAAAA,CAAAA,OAAAA,CAAQ,CAACC,GAAAA,EAAKC,GAAQ,KAAA;AAC1BD,YAAID,GAAAA,CAAAA,OAAAA,CAAQ,CAACG,IAAAA,EAAMC,GAAQ,KAAA;AACzB,cAAID,IAAAA,IAAAA;AACFpC,gBAAAA,GAAAA,CAAI4B,SAASS,GAAM7B,GAAAA,MAAAA,EAAQ2B,GAAM3B,GAAAA,MAAAA,EAAQ,GAAG,CAAC,CAAA,CAAA;AAAA,aAChD,CAAA,CAAA;AAAA,WACF,CAAA,CAAA;AAAA,SACH;AAEA,QAAA,IAAIO,iBAAmB,EAAA;AACrBf,UAAIsC,GAAAA,CAAAA,SAAAA,CACFxB,KACAF,EAAAA,uBAAAA,CAAwB2B,CAAI/B,GAAAA,MAAAA,EAC5BI,uBAAwB4B,CAAAA,CAAAA,GAAIhC,MAC5BI,EAAAA,uBAAAA,CAAwB6B,CACxB7B,EAAAA,uBAAAA,CAAwB8B,CAC1B,CAAA,CAAA;AAAA,SACF;AAAA,OACF;AAAA,KAEF,EAAA;AAAA,MAAEC,KAAO,EAAA,MAAA;AAAA,KACX,CAAA,CAAA;AACAC,IAAAA,KAAAA,CAAMrE,QAAQ,MAAM;AAClBO,MAAAA,WAAAA,CAAYI,KAAQ,GAAA,KAAA,CAAA;AAAA,KACrB,CAAA,CAAA;AAED,IAAA,OAAO,MAAM;;AACX,MAAME,MAAAA,IAAAA,GAAAA,CAAOlB,EAAMkB,GAAAA,KAAAA,CAAAA,IAAAA,KAANlB,IAAcmB,GAAAA,EAAAA,GAAAA,YAAAA,CAAAA;AAC3B,MAAA,MAAMwD,WAAc,GAAA;AAAA,QAAErB,MAAAA,EAAS,GAAEpC,IAAK,CAAA,EAAA,CAAA;AAAA,QAAKqC,KAAAA,EAAQ,GAAErC,IAAK,CAAA,EAAA,CAAA;AAAA,OAAI,CAAA;AAE9D,MAAA,IAAI0D,GAAM,GAAA,IAAA,CAAA;AACV,MAAIvE,IAAAA,MAAAA,CAAOW,SAAS,IAAM,EAAA;AACxB4D,QAAAA,GAAAA,GAAGC,YAAA,KAAA,EAAA;AAAA,UAAA,OAEMxE,MAAOW,CAAAA,KAAAA;AAAAA,UAAK,OACZX,MAAOW,CAAAA,KAAAA;AAAAA,UAAK,OACV,EAAA;AAAA,YAAE8D,OAAS,EAAA,MAAA;AAAA,WAAO;AAAA,UAAC,UAClBC,MAAM;AACZnE,YAAAA,WAAAA,CAAYI,KAAQ,GAAA,IAAA,CAAA;AAAA,WACtB;AAAA,UAAC,KACIL,EAAAA,MAAAA;AAAAA,WAER,IAAA,CAAA,CAAA;AAAA,OACH;AACA,MAAA,OAAAkE,WAAAG,CAAAA,QAAAA,EAAA,IAAA,EAAA,CAAAH,YAAA,QAAA,EAAA;AAAA,QAAA,GAEgB1E,KAAAA;AAAAA,QAAK,OAAS,EAAA,CAACwE,WAAaxE,EAAAA,KAAAA,CAAM8E,KAAK,CAAA;AAAA,QAAkB,KAAOxE,EAAAA,OAAAA;AAAAA,OAAO,EAAA,IAAA,CAClFmE,EAAAA,GAAG,CAAA,CAAA,CAAA;AAAA,KAGV,CAAA;AAAA,GACF;AACF,CAAC,CAAA;;;;"}