@dicebear/micah 5.0.0-alpha.16 → 5.0.0-alpha.21

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2021 Florian Körner
+Copyright (c) 2022 Florian Körner
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/lib/colors/{eyebrow.d.ts → eyebrows.d.ts}

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

package/lib/colors/{eyebrow.js → eyebrows.js}

@@ -1,4 +1,4 @@
-export const eyebrow = {
+export const eyebrows = {
     apricot: 'rgba(249, 201, 182, 1)',
     azure: 'rgba(210, 239, 243, 1)',
     black: 'rgba(0, 0, 0, 1)',

package/lib/colors/index.d.ts

@@ -1,7 +1,7 @@
 export { base } from './base.js';
 export { earring } from './earring.js';
 export { eyeShadow } from './eyeShadow.js';
-export { eyebrow } from './eyebrow.js';
+export { eyebrows } from './eyebrows.js';
 export { facialHair } from './facialHair.js';
 export { glasses } from './glasses.js';
 export { hair } from './hair.js';

package/lib/colors/index.js

@@ -1,7 +1,7 @@
 export { base } from './base.js';
 export { earring } from './earring.js';
 export { eyeShadow } from './eyeShadow.js';
-export { eyebrow } from './eyebrow.js';
+export { eyebrows } from './eyebrows.js';
 export { facialHair } from './facialHair.js';
 export { glasses } from './glasses.js';
 export { hair } from './hair.js';

package/lib/components/eyebrows.js

@@ -1,6 +1,6 @@
 export const eyebrows = {
-    up: (components, colors) => `<path d="M99 10.21c5.67-2.66 19-5.1 27 6.5M23.58 35.52c2.07-5.9 9.68-17.12 23.56-14.7" stroke="${colors.eyebrow.value}" stroke-width="4" stroke-linecap="round"/>`,
-    down: (components, colors) => `<path d="M27 26.5c6.17 2.5 21.1 3 31.5-15M94 4c5.17 5.33 18.1 12.8 28.5 0" stroke="${colors.eyebrow.value}" stroke-width="4" stroke-linecap="round"/>`,
-    eyelashesUp: (components, colors) => `<path d="M99 10.21c5.67-2.66 19-5.1 27 6.5M23.58 35.52c2.07-5.9 9.68-17.12 23.56-14.7M26.07 29.46l-6.14-5.43M122.96 11.16l6.15-5.43M32.52 23.81l-4.04-7.13M115.51 7.51l4.05-7.13M40.6 20.2l-2.2-7.9M106.44 6.9l2.2-7.9" stroke="${colors.eyebrow.value}" stroke-width="4" stroke-linecap="round"/>`,
-    eyelashesDown: (components, colors) => `<path d="M27 26.5c6.17 2.5 21.1 3 31.5-15M94 4c5.17 5.33 18.1 12.8 28.5 0M37.15 26.46 31 21.03M116.22 9.44l1.78-8M45.6 22.81l-4.05-7.13M108.14 9.02l.94-8.15M52.67 17.2l-2.2-7.9M100 8.03l-.78-8.16" stroke="${colors.eyebrow.value}" stroke-width="4" stroke-linecap="round"/>`,
+    up: (components, colors) => `<path d="M99 10.21c5.67-2.66 19-5.1 27 6.5M23.58 35.52c2.07-5.9 9.68-17.12 23.56-14.7" stroke="${colors.eyebrows.value}" stroke-width="4" stroke-linecap="round"/>`,
+    down: (components, colors) => `<path d="M27 26.5c6.17 2.5 21.1 3 31.5-15M94 4c5.17 5.33 18.1 12.8 28.5 0" stroke="${colors.eyebrows.value}" stroke-width="4" stroke-linecap="round"/>`,
+    eyelashesUp: (components, colors) => `<path d="M99 10.21c5.67-2.66 19-5.1 27 6.5M23.58 35.52c2.07-5.9 9.68-17.12 23.56-14.7M26.07 29.46l-6.14-5.43M122.96 11.16l6.15-5.43M32.52 23.81l-4.04-7.13M115.51 7.51l4.05-7.13M40.6 20.2l-2.2-7.9M106.44 6.9l2.2-7.9" stroke="${colors.eyebrows.value}" stroke-width="4" stroke-linecap="round"/>`,
+    eyelashesDown: (components, colors) => `<path d="M27 26.5c6.17 2.5 21.1 3 31.5-15M94 4c5.17 5.33 18.1 12.8 28.5 0M37.15 26.46 31 21.03M116.22 9.44l1.78-8M45.6 22.81l-4.05-7.13M108.14 9.02l.94-8.15M52.67 17.2l-2.2-7.9M100 8.03l-.78-8.16" stroke="${colors.eyebrows.value}" stroke-width="4" stroke-linecap="round"/>`,
 };

package/lib/core.js

@@ -3,7 +3,6 @@ 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: 'Avatar Illustration System',
@@ -17,10 +16,10 @@ export const style = {
     schema: schema,
     create: ({ prng, options }) => {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
-        onPreCreate({ prng, options, preview: false });
+        onPreCreate({ prng, options });
         const components = getComponents({ prng, options });
         const colors = getColors({ prng, options });
-        onPostCreate({ prng, options, components, colors, preview: false });
+        onPostCreate({ prng, options, components, colors });
         return {
             attributes: {
                 viewBox: '0 0 360 360',
@@ -30,35 +29,4 @@ export const style = {
             body: `<g transform="translate(80 23)">${(_b = (_a = components.base) === null || _a === void 0 ? void 0 : _a.value(components, colors)) !== null && _b !== void 0 ? _b : ''}</g><g transform="translate(170 183)">${(_d = (_c = components.mouth) === null || _c === void 0 ? void 0 : _c.value(components, colors)) !== null && _d !== void 0 ? _d : ''}</g><g transform="translate(110 102)">${(_f = (_e = components.eyebrows) === null || _e === void 0 ? void 0 : _e.value(components, colors)) !== null && _f !== void 0 ? _f : ''}</g><g transform="translate(49 11)">${(_h = (_g = components.hair) === null || _g === void 0 ? void 0 : _g.value(components, colors)) !== null && _h !== void 0 ? _h : ''}</g><g transform="translate(142 119)">${(_k = (_j = components.eyes) === null || _j === void 0 ? void 0 : _j.value(components, colors)) !== null && _k !== void 0 ? _k : ''}</g><g transform="rotate(-8 1149.44 -1186.92)">${(_m = (_l = components.nose) === null || _l === void 0 ? void 0 : _l.value(components, colors)) !== null && _m !== void 0 ? _m : ''}</g><g transform="translate(84 154)">${(_p = (_o = components.ears) === null || _o === void 0 ? void 0 : _o.value(components, colors)) !== null && _p !== void 0 ? _p : ''}</g><g transform="translate(53 272)">${(_r = (_q = components.shirt) === null || _q === void 0 ? void 0 : _q.value(components, colors)) !== null && _r !== void 0 ? _r : ''}</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 });
-        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/lib/hooks/onPostCreate.d.ts

@@ -5,7 +5,6 @@ declare type Props = {
     options: StyleOptions<Options>;
     components: ComponentPickCollection;
     colors: ColorPickCollection;
-    preview: boolean;
 };
-export declare function onPostCreate({ prng, options, components, colors, preview, }: Props): void;
+export declare function onPostCreate({ prng, options, components, colors }: Props): void;
 export {};

package/lib/hooks/onPostCreate.js

@@ -1,4 +1,4 @@
-export function onPostCreate({ prng, options, components, colors, preview, }) {
+export function onPostCreate({ prng, options, components, colors }) {
     // Ensure that the mouth remains visible. #132
     if (components.facialHair && colors.facialHair.value === colors.mouth.value) {
         colors.mouth.value = 'rgba(255, 255, 255, .2)';

package/lib/hooks/onPreCreate.d.ts

@@ -3,7 +3,6 @@ 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 declare function onPreCreate({ prng, options }: Props): void;
 export {};

package/lib/hooks/onPreCreate.js

@@ -1,4 +1,4 @@
-export function onPreCreate({ prng, options, preview }) {
+export function onPreCreate({ prng, options }) {
     var _a;
     // Prevent baseColor from being used a second time if possible.
     options.baseColor =

package/lib/index.d.ts

@@ -2,12 +2,12 @@
  * Micah (@dicebear/micah)
  *
  * Code licensed under MIT License.
- * Copyright (c) 2021 Florian Körner
+ * Copyright (c) 2022 Florian Körner
  *
  * Design "Avatar Illustration System" by Micah Lanier licensed under CC BY 4.0.
  * Source: https://www.figma.com/community/file/829741575478342595
  * License: https://creativecommons.org/licenses/by/4.0/
  */
-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 };
+declare const create: import("@dicebear/core").StyleCreate<import("./types.js").Options>, meta: import("@dicebear/core").StyleMeta, schema: import("json-schema").JSONSchema7;
+export { create, meta, schema };
 export type { Options } from './types.js';

package/lib/index.js

@@ -2,12 +2,12 @@
  * Micah (@dicebear/micah)
  *
  * Code licensed under MIT License.
- * Copyright (c) 2021 Florian Körner
+ * Copyright (c) 2022 Florian Körner
  *
  * Design "Avatar Illustration System" by Micah Lanier licensed under CC BY 4.0.
  * Source: https://www.figma.com/community/file/829741575478342595
  * License: https://creativecommons.org/licenses/by/4.0/
  */
 import { style } from './core.js';
-const { create, preview, meta, schema } = style;
-export { create, preview, meta, schema };
+const { create, meta, schema } = style;
+export { create, meta, schema };

package/lib/schema.js

@@ -109,13 +109,36 @@ export const schema = {
                 ['white'],
             ],
         },
-        eyebrowColor: {
+        eyebrows: {
+            type: 'array',
+            items: {
+                type: 'string',
+                enum: ['up', 'down', 'eyelashesUp', 'eyelashesDown'],
+            },
+            default: ['up', 'down', 'eyelashesUp', 'eyelashesDown'],
+            examples: [['up'], ['down'], ['eyelashesUp'], ['eyelashesDown']],
+        },
+        eyebrowsColor: {
             type: 'array',
             items: {
                 type: 'string',
                 pattern: '^([0-9a-zA-Z]+|#[a-fA-F0-9]{3}|#[a-fA-F0-9]{4}|#[a-fA-F0-9]{6}|#[a-fA-F0-9]{8})$',
             },
-            default: ['black'],
+            default: [
+                'apricot',
+                'azure',
+                'black',
+                'calm',
+                'canary',
+                'coast',
+                'lavender',
+                'mellow',
+                'salmon',
+                'seashell',
+                'sky',
+                'topaz',
+                'white',
+            ],
             examples: [
                 ['apricot'],
                 ['azure'],
@@ -132,15 +155,6 @@ export const schema = {
                 ['white'],
             ],
         },
-        eyebrows: {
-            type: 'array',
-            items: {
-                type: 'string',
-                enum: ['up', 'down', 'eyelashesUp', 'eyelashesDown'],
-            },
-            default: ['up', 'down', 'eyelashesUp', 'eyelashesDown'],
-            examples: [['up'], ['down'], ['eyelashesUp'], ['eyelashesDown']],
-        },
         eyes: {
             type: 'array',
             items: {

package/lib/types.d.ts

@@ -17,7 +17,7 @@ export interface Options {
     baseColor?: string[];
     earringColor?: string[];
     eyeShadowColor?: string[];
-    eyebrowColor?: string[];
+    eyebrowsColor?: string[];
     facialHairColor?: string[];
     glassesColor?: string[];
     hairColor?: string[];

package/lib/utils/getColors.js

@@ -16,10 +16,10 @@ export function getColors({ prng, options }) {
             group: 'eyeShadow',
             values: options.eyeShadowColor,
         }),
-        eyebrow: pickColor({
+        eyebrows: pickColor({
             prng,
-            group: 'eyebrow',
-            values: options.eyebrowColor,
+            group: 'eyebrows',
+            values: options.eyebrowsColor,
         }),
         facialHair: pickColor({
             prng,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dicebear/micah",
-  "version": "5.0.0-alpha.16",
+  "version": "5.0.0-alpha.21",
   "description": "Avatar style for DiceBear",
   "keywords": [
     "dicebear"
@@ -28,21 +28,20 @@
     "test": "uvu tests"
   },
   "devDependencies": {
-    "@dicebear/core": "^5.0.0-alpha.16",
-    "@tsconfig/recommended": "^1.0.0",
-    "@types/jest": "^26.0.22",
+    "@dicebear/core": "^5.0.0-alpha.21",
+    "@tsconfig/recommended": "^1.0.1",
     "del-cli": "^4.0.1",
-    "typescript": "^4.5.2",
-    "uvu": "^0.5.2"
+    "typescript": "^4.6.3",
+    "uvu": "^0.5.3"
   },
   "peerDependencies": {
-    "@dicebear/core": "^5.0.0-alpha.10"
+    "@dicebear/core": "^5.0.0-alpha.16"
   },
   "engines": {
-    "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+    "node": "^14.13.1 || >=16.0.0"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "149a4a22c3a4d48dd5552bd22a49db0f853e0b5e"
+  "gitHead": "40b7190a19ba3c6c355178f1ae6c422229634e06"
 }

package/lib/meta/components.d.ts

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

package/lib/meta/components.js

@@ -1,46 +0,0 @@
-export const dimensions = {
-    base: {
-        width: 200,
-        height: 320,
-    },
-    mouth: {
-        width: 64,
-        height: 64,
-    },
-    eyebrows: {
-        width: 149,
-        height: 48,
-    },
-    hair: {
-        width: 240,
-        height: 200,
-    },
-    eyes: {
-        width: 96,
-        height: 48,
-    },
-    nose: {
-        width: 32,
-        height: 40,
-    },
-    ears: {
-        width: 48,
-        height: 48,
-    },
-    shirt: {
-        width: 258,
-        height: 90.8974609375,
-    },
-    earrings: {
-        width: 48,
-        height: 48,
-    },
-    glasses: {
-        width: 150.5,
-        height: 65,
-    },
-    facialHair: {
-        width: 163.72164916992188,
-        height: 153.0578155517578,
-    },
-};