@pixygon/avatar 1.0.0

package/dist/components/index.mjs

@@ -0,0 +1,277 @@
+import {
+  EYE_COLOR_PRESETS,
+  HAIR_COLOR_PRESETS,
+  SKIN_PRESETS,
+  STYLE_COUNTS,
+  useAvatarEditor
+} from "../chunk-5QZCUXJW.mjs";
+
+// src/components/AvatarEditor.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var TABS = [
+  { key: "body", label: "Body" },
+  { key: "head", label: "Head" },
+  { key: "eyes", label: "Eyes" },
+  { key: "brows", label: "Brows" },
+  { key: "nose", label: "Nose" },
+  { key: "mouth", label: "Mouth" },
+  { key: "hair", label: "Hair" },
+  { key: "extras", label: "Extras" }
+];
+function AvatarEditor({
+  initial,
+  onChange,
+  onDone,
+  onCancel,
+  className
+}) {
+  const { appearance, tab, setTab, update, randomize, reset } = useAvatarEditor(initial);
+  const handleUpdate = (path, value) => {
+    update(path, value);
+    setTimeout(() => onChange?.(appearance), 0);
+  };
+  return /* @__PURE__ */ jsxs("div", { className, style: rootStyle, children: [
+    /* @__PURE__ */ jsxs("div", { style: headerStyle, children: [
+      /* @__PURE__ */ jsx("span", { style: { fontWeight: 700, fontSize: 18 }, children: "Avatar Editor" }),
+      /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 8 }, children: [
+        /* @__PURE__ */ jsx("button", { style: btnStyle, onClick: randomize, children: "Randomize" }),
+        /* @__PURE__ */ jsx("button", { style: btnStyle, onClick: reset, children: "Reset" }),
+        onCancel && /* @__PURE__ */ jsx("button", { style: btnStyle, onClick: onCancel, children: "Cancel" }),
+        onDone && /* @__PURE__ */ jsx("button", { style: { ...btnStyle, background: "#3b6" }, onClick: () => onDone(appearance), children: "Done" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { style: tabBarStyle, children: TABS.map((t) => /* @__PURE__ */ jsx(
+      "button",
+      {
+        onClick: () => setTab(t.key),
+        style: {
+          ...tabStyle,
+          ...tab === t.key ? tabActiveStyle : {}
+        },
+        children: t.label
+      },
+      t.key
+    )) }),
+    /* @__PURE__ */ jsxs("div", { style: contentStyle, children: [
+      tab === "body" && /* @__PURE__ */ jsx(BodyTab, { appearance, onUpdate: handleUpdate }),
+      tab === "head" && /* @__PURE__ */ jsx(HeadTab, { appearance, onUpdate: handleUpdate }),
+      tab === "eyes" && /* @__PURE__ */ jsx(EyesTab, { appearance, onUpdate: handleUpdate }),
+      tab === "brows" && /* @__PURE__ */ jsx(BrowsTab, { appearance, onUpdate: handleUpdate }),
+      tab === "nose" && /* @__PURE__ */ jsx(NoseTab, { appearance, onUpdate: handleUpdate }),
+      tab === "mouth" && /* @__PURE__ */ jsx(MouthTab, { appearance, onUpdate: handleUpdate }),
+      tab === "hair" && /* @__PURE__ */ jsx(HairTab, { appearance, onUpdate: handleUpdate }),
+      tab === "extras" && /* @__PURE__ */ jsx(ExtrasTab, { appearance, onUpdate: handleUpdate })
+    ] })
+  ] });
+}
+function BodyTab({ appearance, onUpdate }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(SectionLabel, { children: "Body" }),
+    /* @__PURE__ */ jsx(Slider, { label: "Height", value: appearance.body.height, onChange: (v) => onUpdate("body.height", v) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Build", value: appearance.body.build, onChange: (v) => onUpdate("body.build", v) }),
+    /* @__PURE__ */ jsx(SectionLabel, { children: "Skin Colour" }),
+    /* @__PURE__ */ jsx(ColourPresets, { current: appearance.skin_color, presets: SKIN_PRESETS, onPick: (c) => onUpdate("skin_color", c) })
+  ] });
+}
+function HeadTab({ appearance, onUpdate }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(SectionLabel, { children: "Head Shape" }),
+    /* @__PURE__ */ jsx(Slider, { label: "Width", value: appearance.head.width, min: 0.5, max: 1.5, onChange: (v) => onUpdate("head.width", v) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Height", value: appearance.head.height, min: 0.5, max: 1.5, onChange: (v) => onUpdate("head.height", v) })
+  ] });
+}
+function EyesTab({ appearance, onUpdate }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(SectionLabel, { children: "Eyes" }),
+    /* @__PURE__ */ jsx(StyleSelector, { label: "Style", value: appearance.head.eye_style, count: STYLE_COUNTS.eye, onChange: (v) => onUpdate("head.eye_style", v) }),
+    /* @__PURE__ */ jsx(ColourPresets, { current: appearance.head.eye_color, presets: EYE_COLOR_PRESETS, onPick: (c) => onUpdate("head.eye_color", c) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Vertical Pos", value: appearance.head.eye_y, onChange: (v) => onUpdate("head.eye_y", v) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Spacing", value: appearance.head.eye_spacing, onChange: (v) => onUpdate("head.eye_spacing", v) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Size", value: appearance.head.eye_size, onChange: (v) => onUpdate("head.eye_size", v) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Rotation", value: appearance.head.eye_rotation, onChange: (v) => onUpdate("head.eye_rotation", v) })
+  ] });
+}
+function BrowsTab({ appearance, onUpdate }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(SectionLabel, { children: "Eyebrows" }),
+    /* @__PURE__ */ jsx(StyleSelector, { label: "Style", value: appearance.head.brow_style, count: STYLE_COUNTS.brow, onChange: (v) => onUpdate("head.brow_style", v) }),
+    /* @__PURE__ */ jsx(ColourPresets, { current: appearance.head.brow_color, presets: HAIR_COLOR_PRESETS, onPick: (c) => onUpdate("head.brow_color", c) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Vertical Pos", value: appearance.head.brow_y, onChange: (v) => onUpdate("head.brow_y", v) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Spacing", value: appearance.head.brow_spacing, onChange: (v) => onUpdate("head.brow_spacing", v) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Size", value: appearance.head.brow_size, onChange: (v) => onUpdate("head.brow_size", v) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Rotation", value: appearance.head.brow_rotation, onChange: (v) => onUpdate("head.brow_rotation", v) })
+  ] });
+}
+function NoseTab({ appearance, onUpdate }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(SectionLabel, { children: "Nose" }),
+    /* @__PURE__ */ jsx(StyleSelector, { label: "Style", value: appearance.head.nose_style, count: STYLE_COUNTS.nose, onChange: (v) => onUpdate("head.nose_style", v) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Vertical Pos", value: appearance.head.nose_y, onChange: (v) => onUpdate("head.nose_y", v) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Size", value: appearance.head.nose_size, onChange: (v) => onUpdate("head.nose_size", v) })
+  ] });
+}
+function MouthTab({ appearance, onUpdate }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(SectionLabel, { children: "Mouth" }),
+    /* @__PURE__ */ jsx(StyleSelector, { label: "Style", value: appearance.head.mouth_style, count: STYLE_COUNTS.mouth, onChange: (v) => onUpdate("head.mouth_style", v) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Vertical Pos", value: appearance.head.mouth_y, onChange: (v) => onUpdate("head.mouth_y", v) }),
+    /* @__PURE__ */ jsx(Slider, { label: "Size", value: appearance.head.mouth_size, onChange: (v) => onUpdate("head.mouth_size", v) })
+  ] });
+}
+function HairTab({ appearance, onUpdate }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(SectionLabel, { children: "Hair" }),
+    /* @__PURE__ */ jsx(StyleSelector, { label: "Style", value: appearance.head.hair_style, count: STYLE_COUNTS.hair, onChange: (v) => onUpdate("head.hair_style", v) }),
+    /* @__PURE__ */ jsx(SectionLabel, { children: "Colour" }),
+    /* @__PURE__ */ jsx(ColourPresets, { current: appearance.head.hair_color, presets: HAIR_COLOR_PRESETS, onPick: (c) => onUpdate("head.hair_color", c) })
+  ] });
+}
+function ExtrasTab({ appearance, onUpdate }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(SectionLabel, { children: "Facial Hair" }),
+    /* @__PURE__ */ jsx(StyleSelector, { label: "Style", value: appearance.head.facial_hair_style, count: STYLE_COUNTS.facial_hair, onChange: (v) => onUpdate("head.facial_hair_style", v) }),
+    appearance.head.facial_hair_style > 0 && /* @__PURE__ */ jsx(ColourPresets, { current: appearance.head.facial_hair_color, presets: HAIR_COLOR_PRESETS, onPick: (c) => onUpdate("head.facial_hair_color", c) }),
+    /* @__PURE__ */ jsx(SectionLabel, { children: "Glasses" }),
+    /* @__PURE__ */ jsx(StyleSelector, { label: "Style", value: appearance.head.glasses_style, count: STYLE_COUNTS.glasses, onChange: (v) => onUpdate("head.glasses_style", v) })
+  ] });
+}
+function SectionLabel({ children }) {
+  return /* @__PURE__ */ jsx("div", { style: { color: "#ccc", fontWeight: 600, fontSize: 13, margin: "8px 0 4px" }, children });
+}
+function Slider({
+  label,
+  value,
+  min = 0,
+  max = 1,
+  onChange
+}) {
+  return /* @__PURE__ */ jsxs("label", { style: sliderRowStyle, children: [
+    /* @__PURE__ */ jsx("span", { style: { minWidth: 90, color: "#aab" }, children: label }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "range",
+        min,
+        max,
+        step: 0.01,
+        value,
+        onChange: (e) => onChange(parseFloat(e.target.value)),
+        style: { flex: 1 }
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { style: { minWidth: 40, textAlign: "right", color: "#889", fontSize: 12 }, children: value.toFixed(2) })
+  ] });
+}
+function StyleSelector({
+  label,
+  value,
+  count,
+  onChange
+}) {
+  return /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 8, margin: "4px 0" }, children: [
+    /* @__PURE__ */ jsx("span", { style: { color: "#aab", minWidth: 50 }, children: label }),
+    /* @__PURE__ */ jsx("button", { style: smallBtnStyle, onClick: () => onChange(Math.max(0, value - 1)), disabled: value <= 0, children: "<" }),
+    /* @__PURE__ */ jsxs("span", { style: { color: "#fff", minWidth: 40, textAlign: "center" }, children: [
+      value + 1,
+      "/",
+      count
+    ] }),
+    /* @__PURE__ */ jsx("button", { style: smallBtnStyle, onClick: () => onChange(Math.min(count - 1, value + 1)), disabled: value >= count - 1, children: ">" })
+  ] });
+}
+function ColourPresets({
+  current,
+  presets,
+  onPick
+}) {
+  return /* @__PURE__ */ jsx("div", { style: { display: "flex", flexWrap: "wrap", gap: 4, margin: "4px 0" }, children: presets.map((p, i) => {
+    const selected = Math.abs(current[0] - p[0]) < 0.01 && Math.abs(current[1] - p[1]) < 0.01 && Math.abs(current[2] - p[2]) < 0.01;
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        onClick: () => onPick([...p]),
+        style: {
+          width: selected ? 26 : 22,
+          height: selected ? 26 : 22,
+          borderRadius: 4,
+          border: selected ? "2px solid #fff" : "1px solid #555",
+          background: `rgb(${p[0] * 255}, ${p[1] * 255}, ${p[2] * 255})`,
+          cursor: "pointer",
+          padding: 0
+        }
+      },
+      i
+    );
+  }) });
+}
+var rootStyle = {
+  display: "flex",
+  flexDirection: "column",
+  background: "#1e1e2a",
+  color: "#ddd",
+  borderRadius: 8,
+  overflow: "hidden",
+  fontFamily: "system-ui, sans-serif",
+  fontSize: 14
+};
+var headerStyle = {
+  display: "flex",
+  justifyContent: "space-between",
+  alignItems: "center",
+  padding: "10px 14px",
+  background: "#16161f"
+};
+var tabBarStyle = {
+  display: "flex",
+  gap: 2,
+  padding: "0 8px",
+  background: "#1a1a26",
+  overflowX: "auto"
+};
+var tabStyle = {
+  padding: "8px 12px",
+  background: "transparent",
+  border: "none",
+  color: "#99a",
+  cursor: "pointer",
+  fontSize: 13,
+  whiteSpace: "nowrap"
+};
+var tabActiveStyle = {
+  color: "#fff",
+  fontWeight: 700,
+  borderBottom: "2px solid #6af"
+};
+var contentStyle = {
+  padding: "8px 14px 14px",
+  overflowY: "auto",
+  flex: 1
+};
+var btnStyle = {
+  padding: "6px 14px",
+  border: "none",
+  borderRadius: 4,
+  background: "#333",
+  color: "#ddd",
+  cursor: "pointer",
+  fontSize: 13
+};
+var smallBtnStyle = {
+  width: 28,
+  height: 28,
+  border: "1px solid #444",
+  borderRadius: 4,
+  background: "#2a2a36",
+  color: "#ccc",
+  cursor: "pointer",
+  fontSize: 14
+};
+var sliderRowStyle = {
+  display: "flex",
+  alignItems: "center",
+  gap: 8,
+  margin: "4px 0"
+};
+export {
+  AvatarEditor
+};

package/dist/index-DwPxw0AI.d.mts

@@ -0,0 +1,77 @@
+/**
+ * Avatar type definitions — mirrors the Rust AvatarAppearance from infinite-game.
+ *
+ * Keep in sync with: crates/infinite-game/src/avatar/mod.rs
+ */
+/** RGB colour triplet (0.0 – 1.0 per channel). */
+type Colour3 = [number, number, number];
+/** Complete avatar appearance. */
+interface AvatarAppearance {
+    body: AvatarBody;
+    head: AvatarHead;
+    skin_color: Colour3;
+}
+/** Body shape parameters. */
+interface AvatarBody {
+    /** 0.0 = short, 1.0 = tall */
+    height: number;
+    /** 0.0 = thin, 1.0 = heavy */
+    build: number;
+}
+/** Head & facial feature parameters. */
+interface AvatarHead {
+    /** Head width scale (0.5 – 1.5, default 1.0) */
+    width: number;
+    /** Head height scale (0.5 – 1.5, default 1.0) */
+    height: number;
+    eye_style: number;
+    eye_color: Colour3;
+    eye_y: number;
+    eye_spacing: number;
+    eye_size: number;
+    eye_rotation: number;
+    brow_style: number;
+    brow_color: Colour3;
+    brow_y: number;
+    brow_spacing: number;
+    brow_size: number;
+    brow_rotation: number;
+    nose_style: number;
+    nose_y: number;
+    nose_size: number;
+    mouth_style: number;
+    mouth_y: number;
+    mouth_size: number;
+    mouth_color: Colour3;
+    hair_style: number;
+    hair_color: Colour3;
+    facial_hair_style: number;
+    facial_hair_color: Colour3;
+    glasses_style: number;
+    glasses_color: Colour3;
+}
+/** One bone segment for the capsule-body renderer. */
+interface BoneSegment {
+    start: [number, number, number];
+    end: [number, number, number];
+    radius: number;
+}
+/** Head transform — position + ellipsoid radii. */
+interface HeadInfo {
+    center: [number, number, number];
+    radius_x: number;
+    radius_y: number;
+    radius_z: number;
+}
+/** Style count constants — keep in sync with Rust. */
+declare const STYLE_COUNTS: {
+    readonly eye: 12;
+    readonly brow: 8;
+    readonly nose: 8;
+    readonly mouth: 8;
+    readonly hair: 16;
+    readonly facial_hair: 8;
+    readonly glasses: 6;
+};
+
+export { type AvatarAppearance as A, type BoneSegment as B, type Colour3 as C, type HeadInfo as H, STYLE_COUNTS as S, type AvatarBody as a, type AvatarHead as b };

package/dist/index-DwPxw0AI.d.ts

@@ -0,0 +1,77 @@
+/**
+ * Avatar type definitions — mirrors the Rust AvatarAppearance from infinite-game.
+ *
+ * Keep in sync with: crates/infinite-game/src/avatar/mod.rs
+ */
+/** RGB colour triplet (0.0 – 1.0 per channel). */
+type Colour3 = [number, number, number];
+/** Complete avatar appearance. */
+interface AvatarAppearance {
+    body: AvatarBody;
+    head: AvatarHead;
+    skin_color: Colour3;
+}
+/** Body shape parameters. */
+interface AvatarBody {
+    /** 0.0 = short, 1.0 = tall */
+    height: number;
+    /** 0.0 = thin, 1.0 = heavy */
+    build: number;
+}
+/** Head & facial feature parameters. */
+interface AvatarHead {
+    /** Head width scale (0.5 – 1.5, default 1.0) */
+    width: number;
+    /** Head height scale (0.5 – 1.5, default 1.0) */
+    height: number;
+    eye_style: number;
+    eye_color: Colour3;
+    eye_y: number;
+    eye_spacing: number;
+    eye_size: number;
+    eye_rotation: number;
+    brow_style: number;
+    brow_color: Colour3;
+    brow_y: number;
+    brow_spacing: number;
+    brow_size: number;
+    brow_rotation: number;
+    nose_style: number;
+    nose_y: number;
+    nose_size: number;
+    mouth_style: number;
+    mouth_y: number;
+    mouth_size: number;
+    mouth_color: Colour3;
+    hair_style: number;
+    hair_color: Colour3;
+    facial_hair_style: number;
+    facial_hair_color: Colour3;
+    glasses_style: number;
+    glasses_color: Colour3;
+}
+/** One bone segment for the capsule-body renderer. */
+interface BoneSegment {
+    start: [number, number, number];
+    end: [number, number, number];
+    radius: number;
+}
+/** Head transform — position + ellipsoid radii. */
+interface HeadInfo {
+    center: [number, number, number];
+    radius_x: number;
+    radius_y: number;
+    radius_z: number;
+}
+/** Style count constants — keep in sync with Rust. */
+declare const STYLE_COUNTS: {
+    readonly eye: 12;
+    readonly brow: 8;
+    readonly nose: 8;
+    readonly mouth: 8;
+    readonly hair: 16;
+    readonly facial_hair: 8;
+    readonly glasses: 6;
+};
+
+export { type AvatarAppearance as A, type BoneSegment as B, type Colour3 as C, type HeadInfo as H, STYLE_COUNTS as S, type AvatarBody as a, type AvatarHead as b };

package/dist/index.d.mts

@@ -0,0 +1,52 @@
+import { C as Colour3, A as AvatarAppearance, a as AvatarBody, B as BoneSegment, H as HeadInfo } from './index-DwPxw0AI.mjs';
+export { b as AvatarHead, S as STYLE_COUNTS } from './index-DwPxw0AI.mjs';
+
+/**
+ * Colour presets — mirrors the Rust constants from infinite-game/src/avatar/mod.rs.
+ */
+
+/** 10 skin colour presets (light to dark). */
+declare const SKIN_PRESETS: readonly Colour3[];
+/** 8 eye colour presets. */
+declare const EYE_COLOR_PRESETS: readonly Colour3[];
+/** 10 hair colour presets. */
+declare const HAIR_COLOR_PRESETS: readonly Colour3[];
+
+/**
+ * Default avatar appearance + randomiser.
+ */
+
+/** Default avatar (matches Rust Default impl). */
+declare function defaultAppearance(): AvatarAppearance;
+/** Generate a random avatar appearance. */
+declare function randomAppearance(): AvatarAppearance;
+
+/**
+ * Humanoid skeleton builder — TypeScript port of
+ * infinite-game/src/avatar/mod.rs `build_skeleton()`.
+ */
+
+/**
+ * Build a humanoid capsule skeleton from body parameters.
+ *
+ * Returns 16 bone segments (4 torso + 6 arm + 6 leg) and a head ellipsoid.
+ * The character stands at the origin with feet on y = 0.
+ */
+declare function buildSkeleton(body: AvatarBody): {
+    bones: BoneSegment[];
+    head: HeadInfo;
+};
+
+type AvatarEditorTab = 'body' | 'head' | 'eyes' | 'brows' | 'nose' | 'mouth' | 'hair' | 'extras';
+interface UseAvatarEditorReturn {
+    appearance: AvatarAppearance;
+    tab: AvatarEditorTab;
+    setTab: (tab: AvatarEditorTab) => void;
+    /** Update a nested field.  path examples: 'body.height', 'head.eye_y', 'skin_color' */
+    update: (path: string, value: number | Colour3) => void;
+    randomize: () => void;
+    reset: () => void;
+}
+declare function useAvatarEditor(initial?: AvatarAppearance): UseAvatarEditorReturn;
+
+export { AvatarAppearance, AvatarBody, type AvatarEditorTab, BoneSegment, Colour3, EYE_COLOR_PRESETS, HAIR_COLOR_PRESETS, HeadInfo, SKIN_PRESETS, type UseAvatarEditorReturn, buildSkeleton, defaultAppearance, randomAppearance, useAvatarEditor };

package/dist/index.d.ts

@@ -0,0 +1,52 @@
+import { C as Colour3, A as AvatarAppearance, a as AvatarBody, B as BoneSegment, H as HeadInfo } from './index-DwPxw0AI.js';
+export { b as AvatarHead, S as STYLE_COUNTS } from './index-DwPxw0AI.js';
+
+/**
+ * Colour presets — mirrors the Rust constants from infinite-game/src/avatar/mod.rs.
+ */
+
+/** 10 skin colour presets (light to dark). */
+declare const SKIN_PRESETS: readonly Colour3[];
+/** 8 eye colour presets. */
+declare const EYE_COLOR_PRESETS: readonly Colour3[];
+/** 10 hair colour presets. */
+declare const HAIR_COLOR_PRESETS: readonly Colour3[];
+
+/**
+ * Default avatar appearance + randomiser.
+ */
+
+/** Default avatar (matches Rust Default impl). */
+declare function defaultAppearance(): AvatarAppearance;
+/** Generate a random avatar appearance. */
+declare function randomAppearance(): AvatarAppearance;
+
+/**
+ * Humanoid skeleton builder — TypeScript port of
+ * infinite-game/src/avatar/mod.rs `build_skeleton()`.
+ */
+
+/**
+ * Build a humanoid capsule skeleton from body parameters.
+ *
+ * Returns 16 bone segments (4 torso + 6 arm + 6 leg) and a head ellipsoid.
+ * The character stands at the origin with feet on y = 0.
+ */
+declare function buildSkeleton(body: AvatarBody): {
+    bones: BoneSegment[];
+    head: HeadInfo;
+};
+
+type AvatarEditorTab = 'body' | 'head' | 'eyes' | 'brows' | 'nose' | 'mouth' | 'hair' | 'extras';
+interface UseAvatarEditorReturn {
+    appearance: AvatarAppearance;
+    tab: AvatarEditorTab;
+    setTab: (tab: AvatarEditorTab) => void;
+    /** Update a nested field.  path examples: 'body.height', 'head.eye_y', 'skin_color' */
+    update: (path: string, value: number | Colour3) => void;
+    randomize: () => void;
+    reset: () => void;
+}
+declare function useAvatarEditor(initial?: AvatarAppearance): UseAvatarEditorReturn;
+
+export { AvatarAppearance, AvatarBody, type AvatarEditorTab, BoneSegment, Colour3, EYE_COLOR_PRESETS, HAIR_COLOR_PRESETS, HeadInfo, SKIN_PRESETS, type UseAvatarEditorReturn, buildSkeleton, defaultAppearance, randomAppearance, useAvatarEditor };