@pixygon/avatar 1.0.0

package/dist/chunk-5QZCUXJW.mjs

@@ -0,0 +1,187 @@
+// src/types/index.ts
+var STYLE_COUNTS = {
+  eye: 12,
+  brow: 8,
+  nose: 8,
+  mouth: 8,
+  hair: 16,
+  facial_hair: 8,
+  glasses: 6
+};
+
+// src/presets.ts
+var SKIN_PRESETS = [
+  [0.98, 0.89, 0.78],
+  // Porcelain
+  [0.96, 0.84, 0.71],
+  // Fair
+  [0.92, 0.78, 0.63],
+  // Light
+  [0.87, 0.72, 0.55],
+  // Medium-light
+  [0.78, 0.62, 0.46],
+  // Medium
+  [0.68, 0.51, 0.36],
+  // Olive
+  [0.58, 0.42, 0.3],
+  // Tan
+  [0.47, 0.33, 0.22],
+  // Brown
+  [0.36, 0.24, 0.16],
+  // Dark
+  [0.26, 0.17, 0.11]
+  // Deep
+];
+var EYE_COLOR_PRESETS = [
+  [0.1, 0.1, 0.1],
+  // Black
+  [0.35, 0.22, 0.1],
+  // Brown
+  [0.55, 0.35, 0.15],
+  // Hazel
+  [0.25, 0.5, 0.25],
+  // Green
+  [0.2, 0.4, 0.7],
+  // Blue
+  [0.45, 0.45, 0.5],
+  // Gray
+  [0.55, 0.25, 0.25],
+  // Red
+  [0.5, 0.3, 0.6]
+  // Violet
+];
+var HAIR_COLOR_PRESETS = [
+  [0.08, 0.06, 0.05],
+  // Black
+  [0.22, 0.14, 0.08],
+  // Dark brown
+  [0.4, 0.26, 0.14],
+  // Brown
+  [0.58, 0.42, 0.24],
+  // Light brown
+  [0.78, 0.62, 0.34],
+  // Dirty blonde
+  [0.9, 0.78, 0.48],
+  // Blonde
+  [0.72, 0.26, 0.12],
+  // Red
+  [0.88, 0.52, 0.22],
+  // Ginger
+  [0.6, 0.6, 0.62],
+  // Gray
+  [0.92, 0.92, 0.94]
+  // White
+];
+
+// src/defaults.ts
+function defaultAppearance() {
+  return {
+    body: { height: 0.5, build: 0.5 },
+    head: {
+      width: 1,
+      height: 1,
+      eye_style: 0,
+      eye_color: [...EYE_COLOR_PRESETS[1]],
+      eye_y: 0.5,
+      eye_spacing: 0.5,
+      eye_size: 0.5,
+      eye_rotation: 0.5,
+      brow_style: 0,
+      brow_color: [...HAIR_COLOR_PRESETS[0]],
+      brow_y: 0.5,
+      brow_spacing: 0.5,
+      brow_size: 0.5,
+      brow_rotation: 0.5,
+      nose_style: 0,
+      nose_y: 0.5,
+      nose_size: 0.5,
+      mouth_style: 0,
+      mouth_y: 0.5,
+      mouth_size: 0.5,
+      mouth_color: [0.75, 0.35, 0.35],
+      hair_style: 0,
+      hair_color: [...HAIR_COLOR_PRESETS[2]],
+      facial_hair_style: 0,
+      facial_hair_color: [...HAIR_COLOR_PRESETS[0]],
+      glasses_style: 0,
+      glasses_color: [0.1, 0.1, 0.1]
+    },
+    skin_color: [...SKIN_PRESETS[2]]
+  };
+}
+function randomAppearance() {
+  const rng = (min, max) => min + Math.random() * (max - min);
+  const rngInt = (max) => Math.floor(Math.random() * max);
+  const pick = (arr) => arr[rngInt(arr.length)];
+  const hairColor = pick(HAIR_COLOR_PRESETS);
+  return {
+    body: {
+      height: rng(0.2, 0.8),
+      build: rng(0.2, 0.8)
+    },
+    head: {
+      width: rng(0.7, 1.3),
+      height: rng(0.7, 1.3),
+      eye_style: rngInt(STYLE_COUNTS.eye),
+      eye_color: [...pick(EYE_COLOR_PRESETS)],
+      eye_y: rng(0.3, 0.7),
+      eye_spacing: rng(0.3, 0.7),
+      eye_size: rng(0.3, 0.7),
+      eye_rotation: 0.5,
+      brow_style: rngInt(STYLE_COUNTS.brow),
+      brow_color: [...hairColor],
+      brow_y: rng(0.3, 0.7),
+      brow_spacing: rng(0.3, 0.7),
+      brow_size: rng(0.3, 0.7),
+      brow_rotation: 0.5,
+      nose_style: rngInt(STYLE_COUNTS.nose),
+      nose_y: rng(0.3, 0.7),
+      nose_size: rng(0.3, 0.7),
+      mouth_style: rngInt(STYLE_COUNTS.mouth),
+      mouth_y: rng(0.3, 0.7),
+      mouth_size: rng(0.3, 0.7),
+      mouth_color: [0.75, 0.35, 0.35],
+      hair_style: rngInt(STYLE_COUNTS.hair),
+      hair_color: [...hairColor],
+      facial_hair_style: Math.random() < 0.3 ? 1 + rngInt(STYLE_COUNTS.facial_hair - 1) : 0,
+      facial_hair_color: [...hairColor],
+      glasses_style: Math.random() < 0.2 ? 1 + rngInt(STYLE_COUNTS.glasses - 1) : 0,
+      glasses_color: [0.1, 0.1, 0.1]
+    },
+    skin_color: [...pick(SKIN_PRESETS)]
+  };
+}
+
+// src/hooks/useAvatarEditor.ts
+import { useCallback, useState } from "react";
+function useAvatarEditor(initial) {
+  const [appearance, setAppearance] = useState(
+    () => initial ?? defaultAppearance()
+  );
+  const [tab, setTab] = useState("body");
+  const update = useCallback((path, value) => {
+    setAppearance((prev) => {
+      const next = structuredClone(prev);
+      const parts = path.split(".");
+      let obj = next;
+      for (let i = 0; i < parts.length - 1; i++) {
+        obj = obj[parts[i]];
+      }
+      obj[parts[parts.length - 1]] = value;
+      return next;
+    });
+  }, []);
+  const randomize = useCallback(() => setAppearance(randomAppearance()), []);
+  const reset = useCallback(() => setAppearance(initial ?? defaultAppearance()), [initial]);
+  return { appearance, tab, setTab, update, randomize, reset };
+}
+
+export {
+  STYLE_COUNTS,
+  SKIN_PRESETS,
+  EYE_COLOR_PRESETS,
+  HAIR_COLOR_PRESETS,
+  defaultAppearance,
+  randomAppearance,
+  useAvatarEditor
+};

package/dist/components/index.d.mts

@@ -0,0 +1,18 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { A as AvatarAppearance } from '../index-DwPxw0AI.mjs';
+
+interface AvatarEditorProps {
+    /** Initial appearance (uses default if omitted). */
+    initial?: AvatarAppearance;
+    /** Called whenever the appearance changes. */
+    onChange?: (appearance: AvatarAppearance) => void;
+    /** Called when the user clicks "Done". */
+    onDone?: (appearance: AvatarAppearance) => void;
+    /** Called when the user clicks "Cancel". */
+    onCancel?: () => void;
+    /** Optional class name for the root container. */
+    className?: string;
+}
+declare function AvatarEditor({ initial, onChange, onDone, onCancel, className, }: AvatarEditorProps): react_jsx_runtime.JSX.Element;
+
+export { AvatarEditor, type AvatarEditorProps };

package/dist/components/index.d.ts

@@ -0,0 +1,18 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { A as AvatarAppearance } from '../index-DwPxw0AI.js';
+
+interface AvatarEditorProps {
+    /** Initial appearance (uses default if omitted). */
+    initial?: AvatarAppearance;
+    /** Called whenever the appearance changes. */
+    onChange?: (appearance: AvatarAppearance) => void;
+    /** Called when the user clicks "Done". */
+    onDone?: (appearance: AvatarAppearance) => void;
+    /** Called when the user clicks "Cancel". */
+    onCancel?: () => void;
+    /** Optional class name for the root container. */
+    className?: string;
+}
+declare function AvatarEditor({ initial, onChange, onDone, onCancel, className, }: AvatarEditorProps): react_jsx_runtime.JSX.Element;
+
+export { AvatarEditor, type AvatarEditorProps };