@xylabs/react-identicon 3.3.0 → 3.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/dist/browser/components/index.d.cts +1 -1
  2. package/dist/browser/components/index.d.cts.map +1 -1
  3. package/dist/browser/components/index.d.mts +1 -1
  4. package/dist/browser/components/index.d.mts.map +1 -1
  5. package/dist/browser/components/index.d.ts +1 -1
  6. package/dist/browser/components/index.d.ts.map +1 -1
  7. package/dist/browser/index.cjs.map +1 -1
  8. package/dist/browser/index.d.cts +1 -1
  9. package/dist/browser/index.d.cts.map +1 -1
  10. package/dist/browser/index.d.mts +1 -1
  11. package/dist/browser/index.d.mts.map +1 -1
  12. package/dist/browser/index.d.ts +1 -1
  13. package/dist/browser/index.d.ts.map +1 -1
  14. package/dist/neutral/components/index.d.cts +1 -1
  15. package/dist/neutral/components/index.d.cts.map +1 -1
  16. package/dist/neutral/components/index.d.mts +1 -1
  17. package/dist/neutral/components/index.d.mts.map +1 -1
  18. package/dist/neutral/components/index.d.ts +1 -1
  19. package/dist/neutral/components/index.d.ts.map +1 -1
  20. package/dist/neutral/index.cjs.map +1 -1
  21. package/dist/neutral/index.d.cts +1 -1
  22. package/dist/neutral/index.d.cts.map +1 -1
  23. package/dist/neutral/index.d.mts +1 -1
  24. package/dist/neutral/index.d.mts.map +1 -1
  25. package/dist/neutral/index.d.ts +1 -1
  26. package/dist/neutral/index.d.ts.map +1 -1
  27. package/dist/node/components/index.d.cts +1 -1
  28. package/dist/node/components/index.d.cts.map +1 -1
  29. package/dist/node/components/index.d.mts +1 -1
  30. package/dist/node/components/index.d.mts.map +1 -1
  31. package/dist/node/components/index.d.ts +1 -1
  32. package/dist/node/components/index.d.ts.map +1 -1
  33. package/dist/node/index.cjs.map +1 -1
  34. package/dist/node/index.d.cts +1 -1
  35. package/dist/node/index.d.cts.map +1 -1
  36. package/dist/node/index.d.mts +1 -1
  37. package/dist/node/index.d.mts.map +1 -1
  38. package/dist/node/index.d.ts +1 -1
  39. package/dist/node/index.d.ts.map +1 -1
  40. package/package.json +4 -4
  41. package/src/components/index.ts +1 -1
  42. package/src/index.ts +1 -1
@@ -1,2 +1,2 @@
1
- export * from './Identicon';
1
+ export * from './Identicon.jsx';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './Identicon';
1
+ export * from './Identicon.jsx';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './Identicon';
1
+ export * from './Identicon.jsx';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.ts","../../src/components/Identicon.tsx"],"sourcesContent":["export * from './components'\n","import { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport md5 from 'md5'\nimport React, { useEffect, useRef } from 'react'\n\nconst range = (n: number, in_min: number, in_max: number, out_min: number, out_max: number) => {\n return ((n - in_min) * (out_max - out_min)) / (in_max - in_min) + out_min\n}\n\nexport interface IdenticonProps extends FlexBoxProps {\n bg?: string\n className?: string\n count?: number\n fg?: string\n iconPadding?: number\n palette?: string[]\n size?: number\n value?: string\n}\n\nconst updateCanvas = (canvas: React.RefObject<HTMLCanvasElement>, props: IdenticonProps) => {\n const { value = '', size = 400, bg = 'transparent', count = 5, palette, iconPadding = 0 } = props\n let { fg } = props\n const hash = md5(value)\n const block = Math.floor(size / count)\n const hashColor = hash.slice(0, 6)\n\n const current = canvas.current\n\n if (!current) {\n return\n }\n\n if (palette && palette.length > 0) {\n const index = Math.floor(range(Number.parseInt(hash.slice(-3), 16), 0, 4095, 0, palette.length))\n fg = palette[index]\n }\n\n current.width = block * count + iconPadding\n current.height = block * count + iconPadding\n const arr = [...hash].map((el) => {\n const parsedEl = Number.parseInt(el, 16)\n return parsedEl < 8 ? 0 : 1\n })\n\n const map = []\n\n map[0] = map[4] = arr.slice(0, 5)\n map[1] = map[3] = arr.slice(5, 10)\n map[2] = arr.slice(10, 15)\n\n const ctx = current.getContext('2d')\n if (ctx) {\n ctx.imageSmoothingEnabled = false\n ctx.clearRect(0, 0, current.width, current.height)\n\n for (const [i, row] of map.entries()) {\n for (const [j, el] of row.entries()) {\n if (el) {\n ctx.fillStyle = fg ?? '#' + hashColor\n ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)\n } else {\n ctx.fillStyle = bg\n ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)\n }\n }\n }\n }\n}\n\nexport const Identicon: React.FC<IdenticonProps> = ({\n size = 400,\n className = 'identicon',\n bg,\n count,\n fg,\n iconPadding,\n palette,\n value,\n ...props\n}) => {\n const canvas = useRef<HTMLCanvasElement>(null)\n\n useEffect(() => {\n updateCanvas(canvas, { bg, className, count, fg, iconPadding, palette, size, value })\n })\n\n return (\n <FlexRow {...props}>\n {value ?\n <canvas className={className} ref={canvas} style={{ height: size, width: size }} />\n : null}\n </FlexRow>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,2BAAsC;AACtC,iBAAgB;AAChB,mBAAyC;AAuFjC;AArFR,IAAM,QAAQ,CAAC,GAAW,QAAgB,QAAgB,SAAiB,YAAoB;AAC7F,UAAS,IAAI,WAAW,UAAU,YAAa,SAAS,UAAU;AACpE;AAaA,IAAM,eAAe,CAAC,QAA4C,UAA0B;AAC1F,QAAM,EAAE,QAAQ,IAAI,OAAO,KAAK,KAAK,eAAe,QAAQ,GAAG,SAAS,cAAc,EAAE,IAAI;AAC5F,MAAI,EAAE,GAAG,IAAI;AACb,QAAM,WAAO,WAAAA,SAAI,KAAK;AACtB,QAAM,QAAQ,KAAK,MAAM,OAAO,KAAK;AACrC,QAAM,YAAY,KAAK,MAAM,GAAG,CAAC;AAEjC,QAAM,UAAU,OAAO;AAEvB,MAAI,CAAC,SAAS;AACZ;AAAA,EACF;AAEA,MAAI,WAAW,QAAQ,SAAS,GAAG;AACjC,UAAM,QAAQ,KAAK,MAAM,MAAM,OAAO,SAAS,KAAK,MAAM,EAAE,GAAG,EAAE,GAAG,GAAG,MAAM,GAAG,QAAQ,MAAM,CAAC;AAC/F,SAAK,QAAQ,KAAK;AAAA,EACpB;AAEA,UAAQ,QAAQ,QAAQ,QAAQ;AAChC,UAAQ,SAAS,QAAQ,QAAQ;AACjC,QAAM,MAAM,CAAC,GAAG,IAAI,EAAE,IAAI,CAAC,OAAO;AAChC,UAAM,WAAW,OAAO,SAAS,IAAI,EAAE;AACvC,WAAO,WAAW,IAAI,IAAI;AAAA,EAC5B,CAAC;AAED,QAAM,MAAM,CAAC;AAEb,MAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,MAAM,GAAG,CAAC;AAChC,MAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,MAAM,GAAG,EAAE;AACjC,MAAI,CAAC,IAAI,IAAI,MAAM,IAAI,EAAE;AAEzB,QAAM,MAAM,QAAQ,WAAW,IAAI;AACnC,MAAI,KAAK;AACP,QAAI,wBAAwB;AAC5B,QAAI,UAAU,GAAG,GAAG,QAAQ,OAAO,QAAQ,MAAM;AAEjD,eAAW,CAAC,GAAG,GAAG,KAAK,IAAI,QAAQ,GAAG;AACpC,iBAAW,CAAC,GAAG,EAAE,KAAK,IAAI,QAAQ,GAAG;AACnC,YAAI,IAAI;AACN,cAAI,YAAY,MAAM,MAAM;AAC5B,cAAI,SAAS,QAAQ,IAAI,aAAa,QAAQ,IAAI,aAAa,QAAQ,aAAa,QAAQ,WAAW;AAAA,QACzG,OAAO;AACL,cAAI,YAAY;AAChB,cAAI,SAAS,QAAQ,IAAI,aAAa,QAAQ,IAAI,aAAa,QAAQ,aAAa,QAAQ,WAAW;AAAA,QACzG;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAEO,IAAM,YAAsC,CAAC;AAAA,EAClD,OAAO;AAAA,EACP,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,aAAS,qBAA0B,IAAI;AAE7C,8BAAU,MAAM;AACd,iBAAa,QAAQ,EAAE,IAAI,WAAW,OAAO,IAAI,aAAa,SAAS,MAAM,MAAM,CAAC;AAAA,EACtF,CAAC;AAED,SACE,4CAAC,gCAAS,GAAG,OACV,kBACC,4CAAC,YAAO,WAAsB,KAAK,QAAQ,OAAO,EAAE,QAAQ,MAAM,OAAO,KAAK,GAAG,IACjF,MACJ;AAEJ;","names":["md5"]}
1
+ {"version":3,"sources":["../../src/index.ts","../../src/components/Identicon.tsx"],"sourcesContent":["export * from './components/index.js'\n","import { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport md5 from 'md5'\nimport React, { useEffect, useRef } from 'react'\n\nconst range = (n: number, in_min: number, in_max: number, out_min: number, out_max: number) => {\n return ((n - in_min) * (out_max - out_min)) / (in_max - in_min) + out_min\n}\n\nexport interface IdenticonProps extends FlexBoxProps {\n bg?: string\n className?: string\n count?: number\n fg?: string\n iconPadding?: number\n palette?: string[]\n size?: number\n value?: string\n}\n\nconst updateCanvas = (canvas: React.RefObject<HTMLCanvasElement>, props: IdenticonProps) => {\n const { value = '', size = 400, bg = 'transparent', count = 5, palette, iconPadding = 0 } = props\n let { fg } = props\n const hash = md5(value)\n const block = Math.floor(size / count)\n const hashColor = hash.slice(0, 6)\n\n const current = canvas.current\n\n if (!current) {\n return\n }\n\n if (palette && palette.length > 0) {\n const index = Math.floor(range(Number.parseInt(hash.slice(-3), 16), 0, 4095, 0, palette.length))\n fg = palette[index]\n }\n\n current.width = block * count + iconPadding\n current.height = block * count + iconPadding\n const arr = [...hash].map((el) => {\n const parsedEl = Number.parseInt(el, 16)\n return parsedEl < 8 ? 0 : 1\n })\n\n const map = []\n\n map[0] = map[4] = arr.slice(0, 5)\n map[1] = map[3] = arr.slice(5, 10)\n map[2] = arr.slice(10, 15)\n\n const ctx = current.getContext('2d')\n if (ctx) {\n ctx.imageSmoothingEnabled = false\n ctx.clearRect(0, 0, current.width, current.height)\n\n for (const [i, row] of map.entries()) {\n for (const [j, el] of row.entries()) {\n if (el) {\n ctx.fillStyle = fg ?? '#' + hashColor\n ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)\n } else {\n ctx.fillStyle = bg\n ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)\n }\n }\n }\n }\n}\n\nexport const Identicon: React.FC<IdenticonProps> = ({\n size = 400,\n className = 'identicon',\n bg,\n count,\n fg,\n iconPadding,\n palette,\n value,\n ...props\n}) => {\n const canvas = useRef<HTMLCanvasElement>(null)\n\n useEffect(() => {\n updateCanvas(canvas, { bg, className, count, fg, iconPadding, palette, size, value })\n })\n\n return (\n <FlexRow {...props}>\n {value ?\n <canvas className={className} ref={canvas} style={{ height: size, width: size }} />\n : null}\n </FlexRow>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,2BAAsC;AACtC,iBAAgB;AAChB,mBAAyC;AAuFjC;AArFR,IAAM,QAAQ,CAAC,GAAW,QAAgB,QAAgB,SAAiB,YAAoB;AAC7F,UAAS,IAAI,WAAW,UAAU,YAAa,SAAS,UAAU;AACpE;AAaA,IAAM,eAAe,CAAC,QAA4C,UAA0B;AAC1F,QAAM,EAAE,QAAQ,IAAI,OAAO,KAAK,KAAK,eAAe,QAAQ,GAAG,SAAS,cAAc,EAAE,IAAI;AAC5F,MAAI,EAAE,GAAG,IAAI;AACb,QAAM,WAAO,WAAAA,SAAI,KAAK;AACtB,QAAM,QAAQ,KAAK,MAAM,OAAO,KAAK;AACrC,QAAM,YAAY,KAAK,MAAM,GAAG,CAAC;AAEjC,QAAM,UAAU,OAAO;AAEvB,MAAI,CAAC,SAAS;AACZ;AAAA,EACF;AAEA,MAAI,WAAW,QAAQ,SAAS,GAAG;AACjC,UAAM,QAAQ,KAAK,MAAM,MAAM,OAAO,SAAS,KAAK,MAAM,EAAE,GAAG,EAAE,GAAG,GAAG,MAAM,GAAG,QAAQ,MAAM,CAAC;AAC/F,SAAK,QAAQ,KAAK;AAAA,EACpB;AAEA,UAAQ,QAAQ,QAAQ,QAAQ;AAChC,UAAQ,SAAS,QAAQ,QAAQ;AACjC,QAAM,MAAM,CAAC,GAAG,IAAI,EAAE,IAAI,CAAC,OAAO;AAChC,UAAM,WAAW,OAAO,SAAS,IAAI,EAAE;AACvC,WAAO,WAAW,IAAI,IAAI;AAAA,EAC5B,CAAC;AAED,QAAM,MAAM,CAAC;AAEb,MAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,MAAM,GAAG,CAAC;AAChC,MAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,MAAM,GAAG,EAAE;AACjC,MAAI,CAAC,IAAI,IAAI,MAAM,IAAI,EAAE;AAEzB,QAAM,MAAM,QAAQ,WAAW,IAAI;AACnC,MAAI,KAAK;AACP,QAAI,wBAAwB;AAC5B,QAAI,UAAU,GAAG,GAAG,QAAQ,OAAO,QAAQ,MAAM;AAEjD,eAAW,CAAC,GAAG,GAAG,KAAK,IAAI,QAAQ,GAAG;AACpC,iBAAW,CAAC,GAAG,EAAE,KAAK,IAAI,QAAQ,GAAG;AACnC,YAAI,IAAI;AACN,cAAI,YAAY,MAAM,MAAM;AAC5B,cAAI,SAAS,QAAQ,IAAI,aAAa,QAAQ,IAAI,aAAa,QAAQ,aAAa,QAAQ,WAAW;AAAA,QACzG,OAAO;AACL,cAAI,YAAY;AAChB,cAAI,SAAS,QAAQ,IAAI,aAAa,QAAQ,IAAI,aAAa,QAAQ,aAAa,QAAQ,WAAW;AAAA,QACzG;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAEO,IAAM,YAAsC,CAAC;AAAA,EAClD,OAAO;AAAA,EACP,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,aAAS,qBAA0B,IAAI;AAE7C,8BAAU,MAAM;AACd,iBAAa,QAAQ,EAAE,IAAI,WAAW,OAAO,IAAI,aAAa,SAAS,MAAM,MAAM,CAAC;AAAA,EACtF,CAAC;AAED,SACE,4CAAC,gCAAS,GAAG,OACV,kBACC,4CAAC,YAAO,WAAsB,KAAK,QAAQ,OAAO,EAAE,QAAQ,MAAM,OAAO,KAAK,GAAG,IACjF,MACJ;AAEJ;","names":["md5"]}
@@ -1,2 +1,2 @@
1
- export * from './components';
1
+ export * from './components/index.js';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './components';
1
+ export * from './components/index.js';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './components';
1
+ export * from './components/index.js';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './Identicon';
1
+ export * from './Identicon.jsx';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './Identicon';
1
+ export * from './Identicon.jsx';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './Identicon';
1
+ export * from './Identicon.jsx';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.ts","../../src/components/Identicon.tsx"],"sourcesContent":["export * from './components'\n","import { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport md5 from 'md5'\nimport React, { useEffect, useRef } from 'react'\n\nconst range = (n: number, in_min: number, in_max: number, out_min: number, out_max: number) => {\n return ((n - in_min) * (out_max - out_min)) / (in_max - in_min) + out_min\n}\n\nexport interface IdenticonProps extends FlexBoxProps {\n bg?: string\n className?: string\n count?: number\n fg?: string\n iconPadding?: number\n palette?: string[]\n size?: number\n value?: string\n}\n\nconst updateCanvas = (canvas: React.RefObject<HTMLCanvasElement>, props: IdenticonProps) => {\n const { value = '', size = 400, bg = 'transparent', count = 5, palette, iconPadding = 0 } = props\n let { fg } = props\n const hash = md5(value)\n const block = Math.floor(size / count)\n const hashColor = hash.slice(0, 6)\n\n const current = canvas.current\n\n if (!current) {\n return\n }\n\n if (palette && palette.length > 0) {\n const index = Math.floor(range(Number.parseInt(hash.slice(-3), 16), 0, 4095, 0, palette.length))\n fg = palette[index]\n }\n\n current.width = block * count + iconPadding\n current.height = block * count + iconPadding\n const arr = [...hash].map((el) => {\n const parsedEl = Number.parseInt(el, 16)\n return parsedEl < 8 ? 0 : 1\n })\n\n const map = []\n\n map[0] = map[4] = arr.slice(0, 5)\n map[1] = map[3] = arr.slice(5, 10)\n map[2] = arr.slice(10, 15)\n\n const ctx = current.getContext('2d')\n if (ctx) {\n ctx.imageSmoothingEnabled = false\n ctx.clearRect(0, 0, current.width, current.height)\n\n for (const [i, row] of map.entries()) {\n for (const [j, el] of row.entries()) {\n if (el) {\n ctx.fillStyle = fg ?? '#' + hashColor\n ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)\n } else {\n ctx.fillStyle = bg\n ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)\n }\n }\n }\n }\n}\n\nexport const Identicon: React.FC<IdenticonProps> = ({\n size = 400,\n className = 'identicon',\n bg,\n count,\n fg,\n iconPadding,\n palette,\n value,\n ...props\n}) => {\n const canvas = useRef<HTMLCanvasElement>(null)\n\n useEffect(() => {\n updateCanvas(canvas, { bg, className, count, fg, iconPadding, palette, size, value })\n })\n\n return (\n <FlexRow {...props}>\n {value ?\n <canvas className={className} ref={canvas} style={{ height: size, width: size }} />\n : null}\n </FlexRow>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,2BAAsC;AACtC,iBAAgB;AAChB,mBAAyC;AAuFjC;AArFR,IAAM,QAAQ,CAAC,GAAW,QAAgB,QAAgB,SAAiB,YAAoB;AAC7F,UAAS,IAAI,WAAW,UAAU,YAAa,SAAS,UAAU;AACpE;AAaA,IAAM,eAAe,CAAC,QAA4C,UAA0B;AAC1F,QAAM,EAAE,QAAQ,IAAI,OAAO,KAAK,KAAK,eAAe,QAAQ,GAAG,SAAS,cAAc,EAAE,IAAI;AAC5F,MAAI,EAAE,GAAG,IAAI;AACb,QAAM,WAAO,WAAAA,SAAI,KAAK;AACtB,QAAM,QAAQ,KAAK,MAAM,OAAO,KAAK;AACrC,QAAM,YAAY,KAAK,MAAM,GAAG,CAAC;AAEjC,QAAM,UAAU,OAAO;AAEvB,MAAI,CAAC,SAAS;AACZ;AAAA,EACF;AAEA,MAAI,WAAW,QAAQ,SAAS,GAAG;AACjC,UAAM,QAAQ,KAAK,MAAM,MAAM,OAAO,SAAS,KAAK,MAAM,EAAE,GAAG,EAAE,GAAG,GAAG,MAAM,GAAG,QAAQ,MAAM,CAAC;AAC/F,SAAK,QAAQ,KAAK;AAAA,EACpB;AAEA,UAAQ,QAAQ,QAAQ,QAAQ;AAChC,UAAQ,SAAS,QAAQ,QAAQ;AACjC,QAAM,MAAM,CAAC,GAAG,IAAI,EAAE,IAAI,CAAC,OAAO;AAChC,UAAM,WAAW,OAAO,SAAS,IAAI,EAAE;AACvC,WAAO,WAAW,IAAI,IAAI;AAAA,EAC5B,CAAC;AAED,QAAM,MAAM,CAAC;AAEb,MAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,MAAM,GAAG,CAAC;AAChC,MAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,MAAM,GAAG,EAAE;AACjC,MAAI,CAAC,IAAI,IAAI,MAAM,IAAI,EAAE;AAEzB,QAAM,MAAM,QAAQ,WAAW,IAAI;AACnC,MAAI,KAAK;AACP,QAAI,wBAAwB;AAC5B,QAAI,UAAU,GAAG,GAAG,QAAQ,OAAO,QAAQ,MAAM;AAEjD,eAAW,CAAC,GAAG,GAAG,KAAK,IAAI,QAAQ,GAAG;AACpC,iBAAW,CAAC,GAAG,EAAE,KAAK,IAAI,QAAQ,GAAG;AACnC,YAAI,IAAI;AACN,cAAI,YAAY,MAAM,MAAM;AAC5B,cAAI,SAAS,QAAQ,IAAI,aAAa,QAAQ,IAAI,aAAa,QAAQ,aAAa,QAAQ,WAAW;AAAA,QACzG,OAAO;AACL,cAAI,YAAY;AAChB,cAAI,SAAS,QAAQ,IAAI,aAAa,QAAQ,IAAI,aAAa,QAAQ,aAAa,QAAQ,WAAW;AAAA,QACzG;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAEO,IAAM,YAAsC,CAAC;AAAA,EAClD,OAAO;AAAA,EACP,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,aAAS,qBAA0B,IAAI;AAE7C,8BAAU,MAAM;AACd,iBAAa,QAAQ,EAAE,IAAI,WAAW,OAAO,IAAI,aAAa,SAAS,MAAM,MAAM,CAAC;AAAA,EACtF,CAAC;AAED,SACE,4CAAC,gCAAS,GAAG,OACV,kBACC,4CAAC,YAAO,WAAsB,KAAK,QAAQ,OAAO,EAAE,QAAQ,MAAM,OAAO,KAAK,GAAG,IACjF,MACJ;AAEJ;","names":["md5"]}
1
+ {"version":3,"sources":["../../src/index.ts","../../src/components/Identicon.tsx"],"sourcesContent":["export * from './components/index.js'\n","import { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport md5 from 'md5'\nimport React, { useEffect, useRef } from 'react'\n\nconst range = (n: number, in_min: number, in_max: number, out_min: number, out_max: number) => {\n return ((n - in_min) * (out_max - out_min)) / (in_max - in_min) + out_min\n}\n\nexport interface IdenticonProps extends FlexBoxProps {\n bg?: string\n className?: string\n count?: number\n fg?: string\n iconPadding?: number\n palette?: string[]\n size?: number\n value?: string\n}\n\nconst updateCanvas = (canvas: React.RefObject<HTMLCanvasElement>, props: IdenticonProps) => {\n const { value = '', size = 400, bg = 'transparent', count = 5, palette, iconPadding = 0 } = props\n let { fg } = props\n const hash = md5(value)\n const block = Math.floor(size / count)\n const hashColor = hash.slice(0, 6)\n\n const current = canvas.current\n\n if (!current) {\n return\n }\n\n if (palette && palette.length > 0) {\n const index = Math.floor(range(Number.parseInt(hash.slice(-3), 16), 0, 4095, 0, palette.length))\n fg = palette[index]\n }\n\n current.width = block * count + iconPadding\n current.height = block * count + iconPadding\n const arr = [...hash].map((el) => {\n const parsedEl = Number.parseInt(el, 16)\n return parsedEl < 8 ? 0 : 1\n })\n\n const map = []\n\n map[0] = map[4] = arr.slice(0, 5)\n map[1] = map[3] = arr.slice(5, 10)\n map[2] = arr.slice(10, 15)\n\n const ctx = current.getContext('2d')\n if (ctx) {\n ctx.imageSmoothingEnabled = false\n ctx.clearRect(0, 0, current.width, current.height)\n\n for (const [i, row] of map.entries()) {\n for (const [j, el] of row.entries()) {\n if (el) {\n ctx.fillStyle = fg ?? '#' + hashColor\n ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)\n } else {\n ctx.fillStyle = bg\n ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)\n }\n }\n }\n }\n}\n\nexport const Identicon: React.FC<IdenticonProps> = ({\n size = 400,\n className = 'identicon',\n bg,\n count,\n fg,\n iconPadding,\n palette,\n value,\n ...props\n}) => {\n const canvas = useRef<HTMLCanvasElement>(null)\n\n useEffect(() => {\n updateCanvas(canvas, { bg, className, count, fg, iconPadding, palette, size, value })\n })\n\n return (\n <FlexRow {...props}>\n {value ?\n <canvas className={className} ref={canvas} style={{ height: size, width: size }} />\n : null}\n </FlexRow>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,2BAAsC;AACtC,iBAAgB;AAChB,mBAAyC;AAuFjC;AArFR,IAAM,QAAQ,CAAC,GAAW,QAAgB,QAAgB,SAAiB,YAAoB;AAC7F,UAAS,IAAI,WAAW,UAAU,YAAa,SAAS,UAAU;AACpE;AAaA,IAAM,eAAe,CAAC,QAA4C,UAA0B;AAC1F,QAAM,EAAE,QAAQ,IAAI,OAAO,KAAK,KAAK,eAAe,QAAQ,GAAG,SAAS,cAAc,EAAE,IAAI;AAC5F,MAAI,EAAE,GAAG,IAAI;AACb,QAAM,WAAO,WAAAA,SAAI,KAAK;AACtB,QAAM,QAAQ,KAAK,MAAM,OAAO,KAAK;AACrC,QAAM,YAAY,KAAK,MAAM,GAAG,CAAC;AAEjC,QAAM,UAAU,OAAO;AAEvB,MAAI,CAAC,SAAS;AACZ;AAAA,EACF;AAEA,MAAI,WAAW,QAAQ,SAAS,GAAG;AACjC,UAAM,QAAQ,KAAK,MAAM,MAAM,OAAO,SAAS,KAAK,MAAM,EAAE,GAAG,EAAE,GAAG,GAAG,MAAM,GAAG,QAAQ,MAAM,CAAC;AAC/F,SAAK,QAAQ,KAAK;AAAA,EACpB;AAEA,UAAQ,QAAQ,QAAQ,QAAQ;AAChC,UAAQ,SAAS,QAAQ,QAAQ;AACjC,QAAM,MAAM,CAAC,GAAG,IAAI,EAAE,IAAI,CAAC,OAAO;AAChC,UAAM,WAAW,OAAO,SAAS,IAAI,EAAE;AACvC,WAAO,WAAW,IAAI,IAAI;AAAA,EAC5B,CAAC;AAED,QAAM,MAAM,CAAC;AAEb,MAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,MAAM,GAAG,CAAC;AAChC,MAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,MAAM,GAAG,EAAE;AACjC,MAAI,CAAC,IAAI,IAAI,MAAM,IAAI,EAAE;AAEzB,QAAM,MAAM,QAAQ,WAAW,IAAI;AACnC,MAAI,KAAK;AACP,QAAI,wBAAwB;AAC5B,QAAI,UAAU,GAAG,GAAG,QAAQ,OAAO,QAAQ,MAAM;AAEjD,eAAW,CAAC,GAAG,GAAG,KAAK,IAAI,QAAQ,GAAG;AACpC,iBAAW,CAAC,GAAG,EAAE,KAAK,IAAI,QAAQ,GAAG;AACnC,YAAI,IAAI;AACN,cAAI,YAAY,MAAM,MAAM;AAC5B,cAAI,SAAS,QAAQ,IAAI,aAAa,QAAQ,IAAI,aAAa,QAAQ,aAAa,QAAQ,WAAW;AAAA,QACzG,OAAO;AACL,cAAI,YAAY;AAChB,cAAI,SAAS,QAAQ,IAAI,aAAa,QAAQ,IAAI,aAAa,QAAQ,aAAa,QAAQ,WAAW;AAAA,QACzG;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAEO,IAAM,YAAsC,CAAC;AAAA,EAClD,OAAO;AAAA,EACP,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,aAAS,qBAA0B,IAAI;AAE7C,8BAAU,MAAM;AACd,iBAAa,QAAQ,EAAE,IAAI,WAAW,OAAO,IAAI,aAAa,SAAS,MAAM,MAAM,CAAC;AAAA,EACtF,CAAC;AAED,SACE,4CAAC,gCAAS,GAAG,OACV,kBACC,4CAAC,YAAO,WAAsB,KAAK,QAAQ,OAAO,EAAE,QAAQ,MAAM,OAAO,KAAK,GAAG,IACjF,MACJ;AAEJ;","names":["md5"]}
@@ -1,2 +1,2 @@
1
- export * from './components';
1
+ export * from './components/index.js';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './components';
1
+ export * from './components/index.js';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './components';
1
+ export * from './components/index.js';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './Identicon';
1
+ export * from './Identicon.jsx';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './Identicon';
1
+ export * from './Identicon.jsx';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './Identicon';
1
+ export * from './Identicon.jsx';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.ts","../../src/components/Identicon.tsx"],"sourcesContent":["export * from './components'\n","import { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport md5 from 'md5'\nimport React, { useEffect, useRef } from 'react'\n\nconst range = (n: number, in_min: number, in_max: number, out_min: number, out_max: number) => {\n return ((n - in_min) * (out_max - out_min)) / (in_max - in_min) + out_min\n}\n\nexport interface IdenticonProps extends FlexBoxProps {\n bg?: string\n className?: string\n count?: number\n fg?: string\n iconPadding?: number\n palette?: string[]\n size?: number\n value?: string\n}\n\nconst updateCanvas = (canvas: React.RefObject<HTMLCanvasElement>, props: IdenticonProps) => {\n const { value = '', size = 400, bg = 'transparent', count = 5, palette, iconPadding = 0 } = props\n let { fg } = props\n const hash = md5(value)\n const block = Math.floor(size / count)\n const hashColor = hash.slice(0, 6)\n\n const current = canvas.current\n\n if (!current) {\n return\n }\n\n if (palette && palette.length > 0) {\n const index = Math.floor(range(Number.parseInt(hash.slice(-3), 16), 0, 4095, 0, palette.length))\n fg = palette[index]\n }\n\n current.width = block * count + iconPadding\n current.height = block * count + iconPadding\n const arr = [...hash].map((el) => {\n const parsedEl = Number.parseInt(el, 16)\n return parsedEl < 8 ? 0 : 1\n })\n\n const map = []\n\n map[0] = map[4] = arr.slice(0, 5)\n map[1] = map[3] = arr.slice(5, 10)\n map[2] = arr.slice(10, 15)\n\n const ctx = current.getContext('2d')\n if (ctx) {\n ctx.imageSmoothingEnabled = false\n ctx.clearRect(0, 0, current.width, current.height)\n\n for (const [i, row] of map.entries()) {\n for (const [j, el] of row.entries()) {\n if (el) {\n ctx.fillStyle = fg ?? '#' + hashColor\n ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)\n } else {\n ctx.fillStyle = bg\n ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)\n }\n }\n }\n }\n}\n\nexport const Identicon: React.FC<IdenticonProps> = ({\n size = 400,\n className = 'identicon',\n bg,\n count,\n fg,\n iconPadding,\n palette,\n value,\n ...props\n}) => {\n const canvas = useRef<HTMLCanvasElement>(null)\n\n useEffect(() => {\n updateCanvas(canvas, { bg, className, count, fg, iconPadding, palette, size, value })\n })\n\n return (\n <FlexRow {...props}>\n {value ?\n <canvas className={className} ref={canvas} style={{ height: size, width: size }} />\n : null}\n </FlexRow>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,2BAAsC;AACtC,iBAAgB;AAChB,mBAAyC;AAuFjC;AArFR,IAAM,QAAQ,CAAC,GAAW,QAAgB,QAAgB,SAAiB,YAAoB;AAC7F,UAAS,IAAI,WAAW,UAAU,YAAa,SAAS,UAAU;AACpE;AAaA,IAAM,eAAe,CAAC,QAA4C,UAA0B;AAC1F,QAAM,EAAE,QAAQ,IAAI,OAAO,KAAK,KAAK,eAAe,QAAQ,GAAG,SAAS,cAAc,EAAE,IAAI;AAC5F,MAAI,EAAE,GAAG,IAAI;AACb,QAAM,WAAO,WAAAA,SAAI,KAAK;AACtB,QAAM,QAAQ,KAAK,MAAM,OAAO,KAAK;AACrC,QAAM,YAAY,KAAK,MAAM,GAAG,CAAC;AAEjC,QAAM,UAAU,OAAO;AAEvB,MAAI,CAAC,SAAS;AACZ;AAAA,EACF;AAEA,MAAI,WAAW,QAAQ,SAAS,GAAG;AACjC,UAAM,QAAQ,KAAK,MAAM,MAAM,OAAO,SAAS,KAAK,MAAM,EAAE,GAAG,EAAE,GAAG,GAAG,MAAM,GAAG,QAAQ,MAAM,CAAC;AAC/F,SAAK,QAAQ,KAAK;AAAA,EACpB;AAEA,UAAQ,QAAQ,QAAQ,QAAQ;AAChC,UAAQ,SAAS,QAAQ,QAAQ;AACjC,QAAM,MAAM,CAAC,GAAG,IAAI,EAAE,IAAI,CAAC,OAAO;AAChC,UAAM,WAAW,OAAO,SAAS,IAAI,EAAE;AACvC,WAAO,WAAW,IAAI,IAAI;AAAA,EAC5B,CAAC;AAED,QAAM,MAAM,CAAC;AAEb,MAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,MAAM,GAAG,CAAC;AAChC,MAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,MAAM,GAAG,EAAE;AACjC,MAAI,CAAC,IAAI,IAAI,MAAM,IAAI,EAAE;AAEzB,QAAM,MAAM,QAAQ,WAAW,IAAI;AACnC,MAAI,KAAK;AACP,QAAI,wBAAwB;AAC5B,QAAI,UAAU,GAAG,GAAG,QAAQ,OAAO,QAAQ,MAAM;AAEjD,eAAW,CAAC,GAAG,GAAG,KAAK,IAAI,QAAQ,GAAG;AACpC,iBAAW,CAAC,GAAG,EAAE,KAAK,IAAI,QAAQ,GAAG;AACnC,YAAI,IAAI;AACN,cAAI,YAAY,MAAM,MAAM;AAC5B,cAAI,SAAS,QAAQ,IAAI,aAAa,QAAQ,IAAI,aAAa,QAAQ,aAAa,QAAQ,WAAW;AAAA,QACzG,OAAO;AACL,cAAI,YAAY;AAChB,cAAI,SAAS,QAAQ,IAAI,aAAa,QAAQ,IAAI,aAAa,QAAQ,aAAa,QAAQ,WAAW;AAAA,QACzG;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAEO,IAAM,YAAsC,CAAC;AAAA,EAClD,OAAO;AAAA,EACP,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,aAAS,qBAA0B,IAAI;AAE7C,8BAAU,MAAM;AACd,iBAAa,QAAQ,EAAE,IAAI,WAAW,OAAO,IAAI,aAAa,SAAS,MAAM,MAAM,CAAC;AAAA,EACtF,CAAC;AAED,SACE,4CAAC,gCAAS,GAAG,OACV,kBACC,4CAAC,YAAO,WAAsB,KAAK,QAAQ,OAAO,EAAE,QAAQ,MAAM,OAAO,KAAK,GAAG,IACjF,MACJ;AAEJ;","names":["md5"]}
1
+ {"version":3,"sources":["../../src/index.ts","../../src/components/Identicon.tsx"],"sourcesContent":["export * from './components/index.js'\n","import { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport md5 from 'md5'\nimport React, { useEffect, useRef } from 'react'\n\nconst range = (n: number, in_min: number, in_max: number, out_min: number, out_max: number) => {\n return ((n - in_min) * (out_max - out_min)) / (in_max - in_min) + out_min\n}\n\nexport interface IdenticonProps extends FlexBoxProps {\n bg?: string\n className?: string\n count?: number\n fg?: string\n iconPadding?: number\n palette?: string[]\n size?: number\n value?: string\n}\n\nconst updateCanvas = (canvas: React.RefObject<HTMLCanvasElement>, props: IdenticonProps) => {\n const { value = '', size = 400, bg = 'transparent', count = 5, palette, iconPadding = 0 } = props\n let { fg } = props\n const hash = md5(value)\n const block = Math.floor(size / count)\n const hashColor = hash.slice(0, 6)\n\n const current = canvas.current\n\n if (!current) {\n return\n }\n\n if (palette && palette.length > 0) {\n const index = Math.floor(range(Number.parseInt(hash.slice(-3), 16), 0, 4095, 0, palette.length))\n fg = palette[index]\n }\n\n current.width = block * count + iconPadding\n current.height = block * count + iconPadding\n const arr = [...hash].map((el) => {\n const parsedEl = Number.parseInt(el, 16)\n return parsedEl < 8 ? 0 : 1\n })\n\n const map = []\n\n map[0] = map[4] = arr.slice(0, 5)\n map[1] = map[3] = arr.slice(5, 10)\n map[2] = arr.slice(10, 15)\n\n const ctx = current.getContext('2d')\n if (ctx) {\n ctx.imageSmoothingEnabled = false\n ctx.clearRect(0, 0, current.width, current.height)\n\n for (const [i, row] of map.entries()) {\n for (const [j, el] of row.entries()) {\n if (el) {\n ctx.fillStyle = fg ?? '#' + hashColor\n ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)\n } else {\n ctx.fillStyle = bg\n ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)\n }\n }\n }\n }\n}\n\nexport const Identicon: React.FC<IdenticonProps> = ({\n size = 400,\n className = 'identicon',\n bg,\n count,\n fg,\n iconPadding,\n palette,\n value,\n ...props\n}) => {\n const canvas = useRef<HTMLCanvasElement>(null)\n\n useEffect(() => {\n updateCanvas(canvas, { bg, className, count, fg, iconPadding, palette, size, value })\n })\n\n return (\n <FlexRow {...props}>\n {value ?\n <canvas className={className} ref={canvas} style={{ height: size, width: size }} />\n : null}\n </FlexRow>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,2BAAsC;AACtC,iBAAgB;AAChB,mBAAyC;AAuFjC;AArFR,IAAM,QAAQ,CAAC,GAAW,QAAgB,QAAgB,SAAiB,YAAoB;AAC7F,UAAS,IAAI,WAAW,UAAU,YAAa,SAAS,UAAU;AACpE;AAaA,IAAM,eAAe,CAAC,QAA4C,UAA0B;AAC1F,QAAM,EAAE,QAAQ,IAAI,OAAO,KAAK,KAAK,eAAe,QAAQ,GAAG,SAAS,cAAc,EAAE,IAAI;AAC5F,MAAI,EAAE,GAAG,IAAI;AACb,QAAM,WAAO,WAAAA,SAAI,KAAK;AACtB,QAAM,QAAQ,KAAK,MAAM,OAAO,KAAK;AACrC,QAAM,YAAY,KAAK,MAAM,GAAG,CAAC;AAEjC,QAAM,UAAU,OAAO;AAEvB,MAAI,CAAC,SAAS;AACZ;AAAA,EACF;AAEA,MAAI,WAAW,QAAQ,SAAS,GAAG;AACjC,UAAM,QAAQ,KAAK,MAAM,MAAM,OAAO,SAAS,KAAK,MAAM,EAAE,GAAG,EAAE,GAAG,GAAG,MAAM,GAAG,QAAQ,MAAM,CAAC;AAC/F,SAAK,QAAQ,KAAK;AAAA,EACpB;AAEA,UAAQ,QAAQ,QAAQ,QAAQ;AAChC,UAAQ,SAAS,QAAQ,QAAQ;AACjC,QAAM,MAAM,CAAC,GAAG,IAAI,EAAE,IAAI,CAAC,OAAO;AAChC,UAAM,WAAW,OAAO,SAAS,IAAI,EAAE;AACvC,WAAO,WAAW,IAAI,IAAI;AAAA,EAC5B,CAAC;AAED,QAAM,MAAM,CAAC;AAEb,MAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,MAAM,GAAG,CAAC;AAChC,MAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,MAAM,GAAG,EAAE;AACjC,MAAI,CAAC,IAAI,IAAI,MAAM,IAAI,EAAE;AAEzB,QAAM,MAAM,QAAQ,WAAW,IAAI;AACnC,MAAI,KAAK;AACP,QAAI,wBAAwB;AAC5B,QAAI,UAAU,GAAG,GAAG,QAAQ,OAAO,QAAQ,MAAM;AAEjD,eAAW,CAAC,GAAG,GAAG,KAAK,IAAI,QAAQ,GAAG;AACpC,iBAAW,CAAC,GAAG,EAAE,KAAK,IAAI,QAAQ,GAAG;AACnC,YAAI,IAAI;AACN,cAAI,YAAY,MAAM,MAAM;AAC5B,cAAI,SAAS,QAAQ,IAAI,aAAa,QAAQ,IAAI,aAAa,QAAQ,aAAa,QAAQ,WAAW;AAAA,QACzG,OAAO;AACL,cAAI,YAAY;AAChB,cAAI,SAAS,QAAQ,IAAI,aAAa,QAAQ,IAAI,aAAa,QAAQ,aAAa,QAAQ,WAAW;AAAA,QACzG;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAEO,IAAM,YAAsC,CAAC;AAAA,EAClD,OAAO;AAAA,EACP,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,aAAS,qBAA0B,IAAI;AAE7C,8BAAU,MAAM;AACd,iBAAa,QAAQ,EAAE,IAAI,WAAW,OAAO,IAAI,aAAa,SAAS,MAAM,MAAM,CAAC;AAAA,EACtF,CAAC;AAED,SACE,4CAAC,gCAAS,GAAG,OACV,kBACC,4CAAC,YAAO,WAAsB,KAAK,QAAQ,OAAO,EAAE,QAAQ,MAAM,OAAO,KAAK,GAAG,IACjF,MACJ;AAEJ;","names":["md5"]}
@@ -1,2 +1,2 @@
1
- export * from './components';
1
+ export * from './components/index.js';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './components';
1
+ export * from './components/index.js';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
@@ -1,2 +1,2 @@
1
- export * from './components';
1
+ export * from './components/index.js';
2
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
package/package.json CHANGED
@@ -13,15 +13,15 @@
13
13
  "packages/*"
14
14
  ],
15
15
  "dependencies": {
16
- "@xylabs/react-flexbox": "^3.3.0",
16
+ "@xylabs/react-flexbox": "^3.4.1",
17
17
  "md5": "^2.3.0"
18
18
  },
19
19
  "description": "Common React library for all XY Labs projects that use React",
20
20
  "devDependencies": {
21
21
  "@types/md5": "^2.3.5",
22
22
  "@types/react": "^18.3.3",
23
- "@xylabs/ts-scripts-yarn3": "^3.11.12",
24
- "@xylabs/tsconfig-react": "^3.11.12",
23
+ "@xylabs/ts-scripts-yarn3": "^3.12.1",
24
+ "@xylabs/tsconfig-react": "^3.12.1",
25
25
  "react": "^18.3.1",
26
26
  "typescript": "^5.5.3"
27
27
  },
@@ -73,6 +73,6 @@
73
73
  "url": "https://github.com/xylabs/sdk-react.git"
74
74
  },
75
75
  "sideEffects": false,
76
- "version": "3.3.0",
76
+ "version": "3.4.1",
77
77
  "type": "module"
78
78
  }
@@ -1 +1 @@
1
- export * from './Identicon'
1
+ export * from './Identicon.jsx'
package/src/index.ts CHANGED
@@ -1 +1 @@
1
- export * from './components'
1
+ export * from './components/index.js'