@dicebear/pixel-art-neutral 5.0.0-alpha.0 → 5.0.0-alpha.12

package/lib/colors/glasses.d.ts

@@ -0,0 +1,2 @@
+import type { ColorGroup } from '../types.js';
+export declare const glasses: ColorGroup;

package/lib/colors/glasses.js

@@ -0,0 +1,8 @@
+export const glasses = {
+    green01: 'rgba(95, 112, 92, 1)',
+    blue01: 'rgba(67, 103, 125, 1)',
+    red01: 'rgba(160, 75, 93, 1)',
+    black01: 'rgba(75, 75, 75, 1)',
+    black02: 'rgba(50, 50, 50, 1)',
+    black03: 'rgba(25, 25, 25, 1)',
+};

package/lib/colors/hair.d.ts

@@ -0,0 +1,2 @@
+import type { ColorGroup } from '../types.js';
+export declare const hair: ColorGroup;

package/lib/colors/hair.js

@@ -0,0 +1,12 @@
+export const hair = {
+    variant01: 'rgba(202, 177, 136, 1)',
+    variant02: 'rgba(167, 137, 97, 1)',
+    variant03: 'rgba(131, 98, 59, 1)',
+    variant04: 'rgba(96, 58, 20, 1)',
+    variant05: 'rgba(96, 48, 21, 1)',
+    variant06: 'rgba(97, 38, 22, 1)',
+    variant07: 'rgba(97, 28, 23, 1)',
+    variant08: 'rgba(78, 26, 19, 1)',
+    variant09: 'rgba(59, 23, 14, 1)',
+    variant10: 'rgba(40, 21, 10, 1)',
+};

package/lib/colors/index.d.ts

@@ -0,0 +1,4 @@
+export { skin } from './skin.js';
+export { hair } from './hair.js';
+export { mouth } from './mouth.js';
+export { glasses } from './glasses.js';

package/lib/colors/index.js

@@ -0,0 +1,4 @@
+export { skin } from './skin.js';
+export { hair } from './hair.js';
+export { mouth } from './mouth.js';
+export { glasses } from './glasses.js';

package/lib/colors/mouth.d.ts

@@ -0,0 +1,2 @@
+import type { ColorGroup } from '../types.js';
+export declare const mouth: ColorGroup;

package/lib/colors/mouth.js

@@ -0,0 +1,6 @@
+export const mouth = {
+    variant01: 'rgba(210, 153, 133, 1)',
+    variant02: 'rgba(201, 130, 118, 1)',
+    variant03: 'rgba(227, 93, 106, 1)',
+    variant04: 'rgba(222, 15, 13, 1)',
+};

package/lib/colors/skin.d.ts

@@ -0,0 +1,2 @@
+import type { ColorGroup } from '../types.js';
+export declare const skin: ColorGroup;

package/lib/colors/skin.js

@@ -0,0 +1,10 @@
+export const skin = {
+    variant01: 'rgba(255, 219, 172, 1)',
+    variant02: 'rgba(245, 207, 160, 1)',
+    variant03: 'rgba(234, 195, 147, 1)',
+    variant04: 'rgba(224, 182, 135, 1)',
+    variant05: 'rgba(203, 158, 110, 1)',
+    variant06: 'rgba(182, 134, 85, 1)',
+    variant07: 'rgba(162, 109, 61, 1)',
+    variant08: 'rgba(141, 85, 36, 1)',
+};

package/lib/components/eyebrows.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentGroup } from '../types.js';
+export declare const eyebrows: ComponentGroup;

package/lib/components/eyebrows.js

@@ -0,0 +1,15 @@
+export const eyebrows = {
+    variant13: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M8 4v1H7v1H5V5h2V4h1Zm4 0h1v1h2v1h-2V5h-1V4Z" fill="${colors.hair.value}"/><path d="M8 4v1H7v1H5V5h2V4h1Zm4 0h1v1h2v1h-2V5h-1V4Z" fill="#000" fill-opacity=".1"/></g>`,
+    variant12: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M6 5h3v2H8V6H6V5Zm5 0h3v1h-2v1h-1V5Z" fill="${colors.hair.value}"/><path d="M6 5h3v2H8V6H6V5Zm5 0h3v1h-2v1h-1V5Z" fill="#000" fill-opacity=".1"/></g>`,
+    variant11: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M5 5h3v1h1v1H8V6H5V5Zm10 0h-3v1h-1v1h1V6h3V5Z" fill="${colors.hair.value}"/><path d="M5 5h3v1h1v1H8V6H5V5Zm10 0h-3v1h-1v1h1V6h3V5Z" fill="#000" fill-opacity=".1"/></g>`,
+    variant10: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M6 5H4v2h1V6h1V5Zm8 0h2v2h-1V6h-1V5Z" fill="${colors.hair.value}"/><path d="M6 5H4v2h1V6h1V5Zm8 0h2v2h-1V6h-1V5Z" fill="#000" fill-opacity=".1"/></g>`,
+    variant09: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M5 6h2v1H5V6Zm8 0h2v1h-2V6Z" fill="${colors.hair.value}"/><path d="M5 6h2v1H5V6Zm8 0h2v1h-2V6Z" fill="#000" fill-opacity=".1"/></g>`,
+    variant08: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M6 5h1v1h1v1H5V6h1V5Zm7 0h1v1h1v1h-3V6h1V5Z" fill="${colors.hair.value}"/><path d="M6 5h1v1h1v1H5V6h1V5Zm7 0h1v1h1v1h-3V6h1V5Z" fill="#000" fill-opacity=".1"/></g>`,
+    variant07: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M6 5h2v1h1v1H8V6H6V5Zm8 0h-2v1h-1v1h1V6h2V5Z" fill="${colors.hair.value}"/><path d="M6 5h2v1h1v1H8V6H6V5Zm8 0h-2v1h-1v1h1V6h2V5Z" fill="#000" fill-opacity=".1"/></g>`,
+    variant06: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M12 7V6h1V5h1v1h1v1h-1V6h-1v1h-1ZM5 7V6h1V5h1v1h1v1H7V6H6v1H5Z" fill="${colors.hair.value}"/><path d="M12 7V6h1V5h1v1h1v1h-1V6h-1v1h-1ZM5 7V6h1V5h1v1h1v1H7V6H6v1H5Z" fill="#000" fill-opacity=".1"/></g>`,
+    variant05: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M7 5v1H5v1H4V6h1V5h2Zm6 0h2v1h1v1h-1V6h-2V5Z" fill="${colors.hair.value}"/><path d="M7 5v1H5v1H4V6h1V5h2Zm6 0h2v1h1v1h-1V6h-2V5Z" fill="#000" fill-opacity=".1"/></g>`,
+    variant04: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M4 7V5h3v1H5v1H4Zm12-2v2h-1V6h-2V5h3Z" fill="${colors.hair.value}"/><path d="M4 7V5h3v1H5v1H4Zm12-2v2h-1V6h-2V5h3Z" fill="#000" fill-opacity=".1"/></g>`,
+    variant03: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M7 5h1v1h1v1H8V6H7V5Zm6 0v1h-1v1h-1V6h1V5h1Z" fill="${colors.hair.value}"/><path d="M7 5h1v1h1v1H8V6H7V5Zm6 0v1h-1v1h-1V6h1V5h1Z" fill="#000" fill-opacity=".1"/></g>`,
+    variant02: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M4 7V6h1V5h1v1H5v1H4Zm10-2h1v1h1v1h-1V6h-1V5Z" fill="${colors.hair.value}"/><path d="M4 7V6h1V5h1v1H5v1H4Zm10-2h1v1h1v1h-1V6h-1V5Z" fill="#000" fill-opacity=".1"/></g>`,
+    variant01: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M7 5v1H5v1H4V6h1V5h2Zm7 0v1h-2v1h-1V6h1V5h2Z" fill="${colors.hair.value}"/><path d="M7 5v1H5v1H4V6h1V5h2Zm7 0v1h-2v1h-1V6h1V5h2Z" fill="#000" fill-opacity=".1"/></g>`,
+};

package/lib/components/eyes.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentGroup } from '../types.js';
+export declare const eyes: ComponentGroup;

package/lib/components/eyes.js

@@ -0,0 +1,15 @@
+export const eyes = {
+    variant13: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M5 9V7h3v2H5Zm7-2h3v2h-3V7Z" fill="#fff"/><path d="M7 8v1h1V8H7Zm7 0h1v1h-1V8Z" fill="#000"/></g>`,
+    variant12: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M5 7h3v2H5V7Zm7 0h3v2h-3V7Z" fill="#fff"/><path d="M6 8h1v1H6V8Zm7 1V8h1v1h-1Z" fill="#000"/></g>`,
+    variant11: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M5 7h3v2H5V7Zm7 0h3v2h-3V7Z" fill="#fff"/><path d="M7 8h1v1H7V8Zm5 0h1v1h-1V8Z" fill="#000"/></g>`,
+    variant10: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M6 7h1v1h1v1H6V7Zm6 0h1v1h1v1h-2V7Z" fill="#fff"/><path d="M6 8h1v1H6V8Zm6 0h1v1h-1V8Z" fill="#000"/></g>`,
+    variant09: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M5 8h2v1H5V8Zm7 0h2v1h-2V8Z" fill="#fff"/><path d="M7 8h1v1H7V8Zm7 0h1v1h-1V8Z" fill="#000"/></g>`,
+    variant08: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M6 8h1v1H6V8Zm7 0h1v1h-1V8Z" fill="#fff"/><path d="M7 8h1v1H7V8Zm5 0h1v1h-1V8Z" fill="#000"/></g>`,
+    variant07: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M5 7v1h3V7H5Zm7 0h3v1h-3V7Z" fill="#fff"/><path d="M5 9V8h1V7h1v1h1v1H5Zm7 0V8h1V7h1v1h1v1h-3Z" fill="#000"/><path d="M5 9V8h1V7h1v1h1v1H7V8H6v1H5Zm7 0V8h1V7h1v1h1v1h-1V8h-1v1h-1Z" fill="#fff" fill-opacity=".5"/></g>`,
+    variant06: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M5 8h3v1H5V8Zm7 0h3v1h-3V8Z" fill="#fff"/><path d="M6 8h1v1H6V8Zm7 0h1v1h-1V8Z" fill="#000"/></g>`,
+    variant05: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M5 7h3v2H5V7Zm7 0h3v2h-3V7Z" fill="#fff"/><path d="M5 8h2v1H5V8Zm7 0h2v1h-2V8Z" fill="#000"/></g>`,
+    variant04: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M5 7h3v3H5V7Zm7 0h3v3h-3V7Z" fill="#fff"/><path d="M6 8h1v1H6V8Zm7 0h1v1h-1V8Z" fill="#000"/></g>`,
+    variant03: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M5 7h3v3H5V7Zm7 0h3v3h-3V7Z" fill="#fff"/><path d="M6 7h2v2H6V7Zm7 0h2v2h-2V7Z" fill="#000"/><path d="M6 7v1h1v1h1V8H7V7H6Zm7 0v1h1v1h1V8h-1V7h-1Z" fill="#fff" fill-opacity=".4"/><path d="M7 7v1h1V7H7Zm7 0h1v1h-1V7Z" fill="#fff" fill-opacity=".7"/></g>`,
+    variant02: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M5 7h3v3H5V7Zm7 0h3v3h-3V7Z" fill="#fff"/><path d="M5 8h2v1H5V8Zm7 0h2v1h-2V8Z" fill="#000"/><path d="M5 8h1v1H5V8Zm7 0h1v1h-1V8Z" fill="#fff" fill-opacity=".7"/></g>`,
+    variant01: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M6 7h1v2H5V8h1V7Zm7 0h1v2h-2V8h1V7Z" fill="#fff"/><path d="M7 7v1H6v1h2V7H7Zm7 0v1h-1v1h2V7h-1Z" fill="#000"/><path d="M7 7v1h1V7H7ZM6 8v1h1V8H6Zm8-1v1h1V7h-1Zm-1 1v1h1V8h-1Z" fill="#fff" fill-opacity=".5"/></g>`,
+};

package/lib/components/glasses.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentGroup } from '../types.js';
+export declare const glasses: ComponentGroup;

package/lib/components/glasses.js

@@ -0,0 +1,9 @@
+export const glasses = {
+    variant07: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path opacity=".2" d="M5 7h3v3H5V7Zm7 0h3v3h-3V7Z" fill="#fff"/><path opacity=".2" d="M7 7h1v1H7V7Zm7 0h1v1h-1V7Z" fill="#fff"/><path d="M12 10V7h3v3h-3Zm-1-4v1H9V6H4v1H3v1h1v3h5V8h2v3h5V8h1V7h-1V6h-5Zm-6 4V7h3v3H5Z" fill="${colors.glasses.value}"/><path d="M3 7h1v1H3V7Zm6 0h2v1H9V7Zm7 0h1v1h-1V7Z" fill="#fff" fill-opacity=".2"/></g>`,
+    variant06: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path opacity=".2" d="M5 7h3v2H5V7Zm7 0h3v2h-3V7Z" fill="#fff"/><path opacity=".2" d="M7 7h1v1H7V7Zm7 0h1v1h-1V7Z" fill="#fff"/><path d="M5 7v2h3V7H5ZM4 6v1H3v1h1v1h1v1h3V9h1V8h2v1h1v1h3V9h1V8h1V7h-1V6h-5v1H9V6H4Zm8 1v2h3V7h-3Z" fill="${colors.glasses.value}"/><path d="M3 7h1v1H3V7Zm6 0h2v1H9V7Zm7 0h1v1h-1V7Z" fill="#fff" fill-opacity=".2"/></g>`,
+    variant05: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path opacity=".2" d="M5 8h3v1H5V8Zm7 0h3v1h-3V8Z" fill="#fff"/><path opacity=".2" d="M7 8h1v1H7V8Zm7 0h1v1h-1V8Z" fill="#fff"/><path d="M5 8v1h3V8H5ZM3 7v1h1v1h1v1h3V9h1V8h2v1h1v1h3V9h1V8h1V7H3Zm9 1v1h3V8h-3Z" fill="${colors.glasses.value}"/><path d="M3 7v1h1V7H3Zm6 0v1h2V7H9Zm7 0v1h1V7h-1Z" fill="#fff" fill-opacity=".2"/></g>`,
+    variant04: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path opacity=".2" d="M5 7h3v2H5V7Zm7 0h3v2h-3V7Z" fill="#fff"/><path opacity=".2" d="M7 7h1v1H7V7Zm7 0h1v1h-1V7Z" fill="#fff"/><path d="M12 7v2h3V7h-3ZM8 6H5v1H3v1h1v1h1v1h3V9h1V8h2v1h1v1h3V9h1V8h1V7h-2V6h-3v1H8V6ZM5 7v2h3V7H5Z" fill="${colors.glasses.value}"/><path d="M3 7h1v1H3V7Zm6 0h2v1H9V7Zm7 0h1v1h-1V7Z" fill="#fff" fill-opacity=".2"/></g>`,
+    variant03: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M4 8H3V7h1V6h5v1h2V6h5v1h1v1h-1v2h-5V8H9v2H4V8Zm1 0V7h3v2H5V8Zm7-1v2h3V7h-3Z" fill="${colors.glasses.value}"/><path opacity=".2" d="M5 7h3v2H5V7Zm7 0h3v2h-3V7Z" fill="#fff"/><path opacity=".2" d="M14 7h1v1h-1V7ZM7 7h1v1H7V7Z" fill="#fff"/><path d="M3 8V7h1v1H3Zm6-1v1h2V7H9Zm7 0v1h1V7h-1Z" fill="#fff" fill-opacity=".2"/></g>`,
+    variant02: (components, colors) => `<g fill-rule="evenodd" clip-rule="evenodd"><path d="M4 8H3V7h14v1h-1v2h-5V8H9v2H4V8Zm1 0h3v1H5V8Zm7 0h3v1h-3V8Z" fill="${colors.glasses.value}"/><path opacity=".2" d="M7 8v1h1V8H7Zm7 0v1h1V8h-1Z" fill="#fff"/><path opacity=".2" d="M5 8h3v1H5V8Zm7 0h3v1h-3V8Z" fill="#fff"/><path d="M3 7v1h1V7H3Zm13 0v1h1V7h-1ZM9 7v1h2V7H9Z" fill="#fff" fill-opacity=".2"/></g>`,
+    variant01: (components, colors) => `<path d="M3 8V7h1V6h2v1h1V6h2v1h2V6h2v1h1V6h2v1h1v1h-1v1h-1v1h-1v1h-1v-1h-1V9h-1V8H9v1H8v1H7v1H6v-1H5V9H4V8H3Z" fill="${colors.glasses.value}"/><path fill-rule="evenodd" clip-rule="evenodd" d="M3 7v1h1V7h1V6H4v1H3Zm5-1v1h1v1h2V7h1V6h-1v1H9V6H8Zm7 0v1h1v1h1V7h-1V6h-1Z" fill="#fff" fill-opacity=".2"/>`,
+};

package/lib/components/index.d.ts

@@ -0,0 +1,4 @@
+export { eyes } from './eyes.js';
+export { eyebrows } from './eyebrows.js';
+export { mouth } from './mouth.js';
+export { glasses } from './glasses.js';

package/lib/components/index.js

@@ -0,0 +1,4 @@
+export { eyes } from './eyes.js';
+export { eyebrows } from './eyebrows.js';
+export { mouth } from './mouth.js';
+export { glasses } from './glasses.js';

package/lib/components/mouth.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentGroup } from '../types.js';
+export declare const mouth: ComponentGroup;

package/lib/components/mouth.js

@@ -0,0 +1,22 @@
+export const mouth = {
+    surprised03: (components, colors) => `<path d="M9 12v2h2v-2H9Z" fill="${colors.mouth.value}"/>`,
+    surprised02: (components, colors) => `<path d="M9 13v1h1v-1H9Z" fill="${colors.mouth.value}"/>`,
+    happy09: (components, colors) => `<path d="M7 12v1h1v1h4v-1H8v-1H7Z" fill="${colors.mouth.value}"/>`,
+    happy08: (components, colors) => `<path d="M10 12v1H9v1h2v-2h-1Z" fill="${colors.mouth.value}"/>`,
+    happy07: (components, colors) => `<path d="M8 13v1h4v-1h1v-1h-1v1H8Z" fill="${colors.mouth.value}"/>`,
+    happy06: (components, colors) => `<path d="M9 12v2h2v-1h-1v-1H9Z" fill="${colors.mouth.value}"/><path d="M11 14v-1h-1v-1H9v1h1v1h1Z" fill="#fff" fill-opacity=".2"/>`,
+    happy05: (components, colors) => `<path d="M8 12v1h1v1h2v-1h1v-1H8Z" fill="${colors.mouth.value}"/>`,
+    happy04: (components, colors) => `<path d="M9 13v1h2v-1h1v-1h-1v1H9Z" fill="${colors.mouth.value}"/>`,
+    happy03: (components, colors) => `<path d="M8 12v1h1v1h2v-1H9v-1H8Z" fill="${colors.mouth.value}"/>`,
+    happy02: (components, colors) => `<path d="M8 12v1h1v1h2v-1h1v-1h-1v-1H9v1H8Z" fill="${colors.mouth.value}"/><path d="M9 12v1h2v-1H9Z" fill="#fff"/>`,
+    happy01: (components, colors) => `<path d="M8 12v1h1v1h2v-1h1v-1h-1v-1H9v1H8Z" fill="${colors.mouth.value}"/><path d="M9 12v1h2v-1H9Z" fill="#fff" fill-opacity=".2"/>`,
+    sad08: (components, colors) => `<path d="M9 12v1H8v1h4v-1h-1v-1H9Z" fill="${colors.mouth.value}"/>`,
+    sad07: (components, colors) => `<path d="M11 12v1H9v1H8v-1h1v-1h2Z" fill="${colors.mouth.value}"/>`,
+    sad06: (components, colors) => `<path d="M8 12h3v1H8v-1Z" fill="${colors.mouth.value}"/>`,
+    sad05: (components, colors) => `<path d="M8 12h4v1H8v-1Z" fill="${colors.mouth.value}"/>`,
+    sad04: (components, colors) => `<path d="M9 12h2v1H9v-1Z" fill="${colors.mouth.value}"/>`,
+    sad03: (components, colors) => `<path d="M8 12v1h3v1h1v-1h-1v-1H8Z" fill="${colors.mouth.value}"/>`,
+    sad02: (components, colors) => `<path d="M8 13v1h1v-1h3v-1H9v1H8Z" fill="${colors.mouth.value}"/>`,
+    sad01: (components, colors) => `<path d="M10 12v1h1v1h1v-2h-2Z" fill="${colors.mouth.value}"/>`,
+    surprised01: (components, colors) => `<path d="M8 12v2h4v-2H8Z" fill="#fff"/>`,
+};

package/{dist → lib}/core.d.ts

@@ -1,3 +1,3 @@
-import type { Style } from '@dicebear/core';
-import type { Options } from './options';
-export declare const style: Style<Options>;
+import type { Style } from '@dicebear/core';
+import type { Options } from './types.js';
+export declare const style: Style<Options>;

package/lib/core.js

@@ -0,0 +1,65 @@
+import { schema } from './schema.js';
+import { getComponents } from './utils/getComponents.js';
+import { getColors } from './utils/getColors.js';
+import { onPreCreate } from './hooks/onPreCreate.js';
+import { onPostCreate } from './hooks/onPostCreate.js';
+import { dimensions } from './meta/components.js';
+export const style = {
+    meta: {
+        title: 'Pixel Art - Neutral',
+        creator: 'Plastic Jam',
+        license: {
+            name: 'MIT',
+            url: 'https://github.com/dicebear/dicebear/blob/main/packages/%40dicebear/pixel-art-neutral/LICENSE',
+        },
+    },
+    schema: schema,
+    create: ({ prng, options }) => {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        onPreCreate({ prng, options, preview: false });
+        const components = getComponents({ prng, options });
+        const colors = getColors({ prng, options });
+        onPostCreate({ prng, options, components, colors, preview: false });
+        options.backgroundColor = [colors.background.value];
+        return {
+            attributes: {
+                viewBox: '0 0 14 14',
+                fill: 'none',
+                'shape-rendering': 'auto',
+            },
+            body: `<g transform="translate(-3 -3)">${(_b = (_a = components.eyes) === null || _a === void 0 ? void 0 : _a.value(components, colors)) !== null && _b !== void 0 ? _b : ''}</g><g transform="translate(-3 -3)">${(_d = (_c = components.eyebrows) === null || _c === void 0 ? void 0 : _c.value(components, colors)) !== null && _d !== void 0 ? _d : ''}</g><g transform="translate(-3 -2)">${(_f = (_e = components.mouth) === null || _e === void 0 ? void 0 : _e.value(components, colors)) !== null && _f !== void 0 ? _f : ''}</g><g transform="translate(-3 -3)">${(_h = (_g = components.glasses) === null || _g === void 0 ? void 0 : _g.value(components, colors)) !== null && _h !== void 0 ? _h : ''}</g>`,
+        };
+    },
+    preview: ({ prng, options, property }) => {
+        var _a, _b;
+        const componentGroup = property.toString();
+        const colorGroup = property.toString().replace(/Color$/, '');
+        onPreCreate({ prng, options, preview: true });
+        const components = getComponents({ prng, options });
+        const colors = getColors({ prng, options });
+        onPostCreate({ prng, options, components, colors, preview: true });
+        options.backgroundColor = [colors.background.value];
+        if (componentGroup in components) {
+            const { width, height } = dimensions[componentGroup];
+            return {
+                attributes: {
+                    viewBox: `0 0 ${width} ${height}`,
+                    fill: 'none',
+                    'shape-rendering': 'auto',
+                },
+                body: (_b = (_a = components[componentGroup]) === null || _a === void 0 ? void 0 : _a.value(components, colors)) !== null && _b !== void 0 ? _b : '',
+            };
+        }
+        if (colorGroup in colors) {
+            return {
+                attributes: {
+                    viewBox: `0 0 1 1`,
+                    fill: 'none',
+                    'shape-rendering': 'auto',
+                },
+                body: `<rect width="1" height="1" fill="${colors[colorGroup].value}" />`,
+            };
+        }
+        return undefined;
+    },
+};

package/{dist → lib}/hooks/onPostCreate.d.ts

@@ -1,12 +1,11 @@
-import { Prng, StyleOptions } from '@dicebear/core';
-import { Options } from '../options';
-import { ColorPickCollection, ComponentPickCollection } from '../static-types';
-declare type Props = {
-    prng: Prng;
-    options: StyleOptions<Options>;
-    components: ComponentPickCollection;
-    colors: ColorPickCollection;
-    preview: boolean;
-};
-export declare function onPostCreate({ prng, options, components, colors, preview, }: Props): void;
-export {};
+import { Prng, StyleOptions } from '@dicebear/core';
+import { Options, ColorPickCollection, ComponentPickCollection } from '../types.js';
+declare type Props = {
+    prng: Prng;
+    options: StyleOptions<Options>;
+    components: ComponentPickCollection;
+    colors: ColorPickCollection;
+    preview: boolean;
+};
+export declare function onPostCreate({ prng, options, components, colors, preview, }: Props): void;
+export {};

package/lib/hooks/onPostCreate.js

@@ -0,0 +1,3 @@
+export function onPostCreate({ prng, options, components, colors, preview, }) {
+    // Write your modifications here
+}

package/{dist → lib}/hooks/onPreCreate.d.ts

@@ -1,9 +1,9 @@
-import { Prng, StyleOptions } from '@dicebear/core';
-import { Options } from '../options';
-declare type Props = {
-    prng: Prng;
-    options: StyleOptions<Options>;
-    preview: boolean;
-};
-export declare function onPreCreate({ prng, options, preview }: Props): void;
-export {};
+import { Prng, StyleOptions } from '@dicebear/core';
+import { Options } from '../types.js';
+declare type Props = {
+    prng: Prng;
+    options: StyleOptions<Options>;
+    preview: boolean;
+};
+export declare function onPreCreate({ prng, options, preview }: Props): void;
+export {};

package/lib/hooks/onPreCreate.js

@@ -0,0 +1,3 @@
+export function onPreCreate({ prng, options, preview }) {
+    // Write your modifications here
+}

package/{dist → lib}/index.d.ts

@@ -1,13 +1,13 @@
-/*!
- * Pixel Art - Neutral (@dicebear/pixel-art-neutral)
- *
- * Code licensed under MIT License.
- * Copyright (c) 2021 Florian Körner
- * Copyright (c) 2021 Plastic Jam
- *
- * Design "Pixel Art - Neutral" by Plastic Jam licensed under MIT.
- * License: https://github.com/dicebear/dicebear/blob/main/packages/%40dicebear/pixel-art-neutral/LICENSE
- */
-declare let create: import("@dicebear/core").StyleCreate<import("./options").Options>, preview: import("@dicebear/core").StylePreview<import("./options").Options> | undefined, meta: import("@dicebear/core").StyleMeta, schema: import("json-schema").JSONSchema7;
-export { create, preview, meta, schema };
-export { Options } from './options';
+/*!
+ * Pixel Art - Neutral (@dicebear/pixel-art-neutral)
+ *
+ * Code licensed under MIT License.
+ * Copyright (c) 2021 Florian Körner
+ * Copyright (c) 2021 Plastic Jam
+ *
+ * Design "Pixel Art - Neutral" by Plastic Jam licensed under MIT.
+ * License: https://github.com/dicebear/dicebear/blob/main/packages/%40dicebear/pixel-art-neutral/LICENSE
+ */
+declare const create: import("@dicebear/core").StyleCreate<import("./types.js").Options>, preview: import("@dicebear/core").StylePreview<import("./types.js").Options> | undefined, meta: import("@dicebear/core").StyleMeta, schema: import("json-schema").JSONSchema7;
+export { create, preview, meta, schema };
+export type { Options } from './types.js';

package/lib/index.js

@@ -0,0 +1,13 @@
+/*!
+ * Pixel Art - Neutral (@dicebear/pixel-art-neutral)
+ *
+ * Code licensed under MIT License.
+ * Copyright (c) 2021 Florian Körner
+ * Copyright (c) 2021 Plastic Jam
+ *
+ * Design "Pixel Art - Neutral" by Plastic Jam licensed under MIT.
+ * License: https://github.com/dicebear/dicebear/blob/main/packages/%40dicebear/pixel-art-neutral/LICENSE
+ */
+import { style } from './core.js';
+const { create, preview, meta, schema } = style;
+export { create, preview, meta, schema };

package/{dist → lib}/meta/components.d.ts

@@ -1,4 +1,4 @@
-export declare const dimensions: Record<string, {
-    width: number;
-    height: number;
-}>;
+export declare const dimensions: Record<string, {
+    width: number;
+    height: number;
+}>;

package/lib/meta/components.js

@@ -0,0 +1,18 @@
+export const dimensions = {
+    eyes: {
+        width: 20,
+        height: 20,
+    },
+    eyebrows: {
+        width: 20,
+        height: 20,
+    },
+    mouth: {
+        width: 20,
+        height: 20,
+    },
+    glasses: {
+        width: 20,
+        height: 20,
+    },
+};

package/lib/schema.d.ts

@@ -0,0 +1,2 @@
+import type { StyleSchema } from '@dicebear/core';
+export declare const schema: StyleSchema;