@metamask/design-system-react/dist/components/temp-components/Jazzicon/Jazzicon.cjs.map

Design system react ui components

{"version":3,"file":"Jazzicon.cjs","sourceRoot":"","sources":["../../../../src/components/temp-components/Jazzicon/Jazzicon.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,yEAGwC;AACxC,kEAA0C;AAC1C,+CAAiD;AAEjD,0DAAkD;AAIlD;;;GAGG;AACH,MAAM,SAAS,GAAmC,EAAE,CAAC;AAE9C,MAAM,QAAQ,GAAG,CAAC,EACvB,OAAO,EACP,IAAI,GAAG,EAAE,EACT,SAAS,EACT,GAAG,KAAK,EACM,EAAE,EAAE;IAClB,MAAM,YAAY,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAElD,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE;YACzB,OAAO,GAAG,EAAE;gBACV,8CAA8C;YAChD,CAAC,CAAC;SACH;QAED,6BAA6B;QAC7B,OAAO,YAAY,CAAC,OAAO,CAAC,UAAU,EAAE;YACtC,YAAY,CAAC,OAAO,CAAC,WAAW,CAAC,YAAY,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;SACnE;QAED,kBAAkB;QAClB,MAAM,QAAQ,GAAG,GAAG,OAAO,CAAC,WAAW,EAAE,IAAI,IAAI,EAAE,CAAC;QACpD,IAAI,SAAS,CAAC,QAAQ,CAAC,EAAE;YACvB,iCAAiC;YACjC,MAAM,KAAK,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC,SAAS,CAAC,IAAI,CAAmB,CAAC;YACpE,YAAY,CAAC,OAAO,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;YACxC,OAAO,GAAG,EAAE;gBACV,IAAI,YAAY,CAAC,OAAO,EAAE;oBACxB,OAAO,YAAY,CAAC,OAAO,CAAC,UAAU,EAAE;wBACtC,YAAY,CAAC,OAAO,CAAC,WAAW,CAAC,YAAY,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;qBACnE;iBACF;YACH,CAAC,CAAC;SACH;QAED,4DAA4D;QAC5D,MAAM,cAAc,GAAG,IAAA,4CAAqB,EAAC,OAAO,CAAC,CAAC;QAEtD,oDAAoD;QACpD,MAAM,IAAI,GAAG,IAAA,uCAAgB,EAAC,cAAc,CAAC,CAAC;QAE9C,kBAAkB;QAClB,MAAM,OAAO,GAAG,IAAA,kBAAQ,EAAC,IAAI,EAAE,IAAI,CAAmB,CAAC;QAEvD,WAAW;QACX,SAAS,CAAC,QAAQ,CAAC,GAAG,OAAyB,CAAC;QAEhD,uBAAuB;QACvB,IAAI,YAAY,CAAC,OAAO,EAAE;YACxB,YAAY,CAAC,OAAO,CAAC,WAAW,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;SAC3D;QAED,UAAU;QACV,OAAO,GAAG,EAAE;YACV,IAAI,YAAY,CAAC,OAAO,EAAE;gBACxB,OAAO,YAAY,CAAC,OAAO,CAAC,UAAU,EAAE;oBACtC,YAAY,CAAC,OAAO,CAAC,WAAW,CAAC,YAAY,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;iBACnE;aACF;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC;IAEpB,OAAO,CACL,uCACE,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAA,kBAAO,EAAC,4BAA4B,EAAE,SAAS,CAAC,KACvD,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC;AArEW,QAAA,QAAQ,YAqEnB;AAEF,gBAAQ,CAAC,WAAW,GAAG,UAAU,CAAC","sourcesContent":["import {\n  extractAccountAddress,\n  generateIconSeed,\n} from '@metamask/design-system-shared';\nimport jazzicon from '@metamask/jazzicon';\nimport React, { useEffect, useRef } from 'react';\n\nimport { twMerge } from '../../../utils/tw-merge';\n\nimport type { JazziconProps } from './Jazzicon.types';\n\n/**\n * Cache for storing generated SVG elements by `address:diameter` so\n * we don't regenerate them repeatedly.\n */\nconst iconCache: Record<string, HTMLDivElement> = {};\n\nexport const Jazzicon = ({\n  address,\n  size = 32,\n  className,\n  ...props\n}: JazziconProps) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (!containerRef.current) {\n      return () => {\n        // No cleanup needed if container ref was null\n      };\n    }\n\n    // Clear any existing content\n    while (containerRef.current.firstChild) {\n      containerRef.current.removeChild(containerRef.current.firstChild);\n    }\n\n    // Check the cache\n    const cacheKey = `${address.toLowerCase()}:${size}`;\n    if (iconCache[cacheKey]) {\n      // If cached, just append a clone\n      const clone = iconCache[cacheKey].cloneNode(true) as HTMLDivElement;\n      containerRef.current.appendChild(clone);\n      return () => {\n        if (containerRef.current) {\n          while (containerRef.current.firstChild) {\n            containerRef.current.removeChild(containerRef.current.firstChild);\n          }\n        }\n      };\n    }\n\n    // Extract the account address from CAIP-10 format if needed\n    const accountAddress = extractAccountAddress(address);\n\n    // Generate appropriate seed based on address format\n    const seed = generateIconSeed(accountAddress);\n\n    // Create Jazzicon\n    const newIcon = jazzicon(size, seed) as HTMLDivElement;\n\n    // Cache it\n    iconCache[cacheKey] = newIcon as HTMLDivElement;\n\n    // Append a fresh clone\n    if (containerRef.current) {\n      containerRef.current.appendChild(newIcon.cloneNode(true));\n    }\n\n    // Cleanup\n    return () => {\n      if (containerRef.current) {\n        while (containerRef.current.firstChild) {\n          containerRef.current.removeChild(containerRef.current.firstChild);\n        }\n      }\n    };\n  }, [address, size]);\n\n  return (\n    <div\n      ref={containerRef}\n      className={twMerge('flex [&>div]:!rounded-none', className)}\n      {...props}\n    />\n  );\n};\n\nJazzicon.displayName = 'Jazzicon';\n"]}