react-native-playful-avatar/lib/module/PlayfulAvatar.js

Make Playful Avatar for your React Native apps

"use strict";

import { useMemo } from 'react';
import SimpleComposer from "./composers/SimpleComposer.js";
import { EyesComposer } from "./avatarElements/Eyes.js";
import { OutfitsComposer } from "./avatarElements/Outfits.js";
import { AccessoriesComposer } from "./avatarElements/Accessories.js";
import { MouthComposer } from "./avatarElements/Mouth.js";
import ColoredComposer from "./composers/ColoredComposer.js";
import { FaceComposer } from "./avatarElements/Face.js";
import { HairComposer } from "./avatarElements/Hair.js";
import { genConfig } from "./utils/avatarUtils.js";
import { View } from 'react-native';
import Svg, { Rect } from 'react-native-svg';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const PlayfulAvatar = ({
  style,
  backgroundColor,
  backgroundShape,
  accessory,
  eyes,
  face,
  faceColor,
  mouth,
  outfit,
  haircut,
  haircutColor
}) => {
  const config = useMemo(() => {
    return genConfig({
      backgroundColor: backgroundColor,
      backgroundShape: backgroundShape,
      accessory: accessory,
      eyes: eyes,
      face: face,
      faceColor: faceColor,
      mouth: mouth,
      outfit: outfit,
      haircut: haircut,
      haircutColor: haircutColor
    });
  }, [backgroundColor, backgroundShape, accessory, eyes, face, faceColor, mouth, outfit, haircut, haircutColor]);
  return /*#__PURE__*/_jsx(View, {
    style: style,
    children: /*#__PURE__*/_jsxs(Svg, {
      height: "100%",
      width: "100%",
      viewBox: "0 0 1300 1300",
      children: [/*#__PURE__*/_jsx(Rect, {
        height: 1300,
        width: 1300,
        fill: config.backgroundColor,
        rx: config.backgroundShapeRadius
      }), /*#__PURE__*/_jsx(ColoredComposer, {
        elementID: config.faceID,
        composer: FaceComposer,
        color: config.faceColor
      }), /*#__PURE__*/_jsx(SimpleComposer, {
        elementID: config.outfitID,
        composer: OutfitsComposer
      }), /*#__PURE__*/_jsx(SimpleComposer, {
        elementID: config.eyesID,
        composer: EyesComposer
      }), /*#__PURE__*/_jsx(SimpleComposer, {
        elementID: config.mouthID,
        composer: MouthComposer
      }), /*#__PURE__*/_jsx(ColoredComposer, {
        elementID: config.haircutID,
        composer: HairComposer,
        color: config.haircutColor
      }), /*#__PURE__*/_jsx(SimpleComposer, {
        elementID: config.accessoryID,
        composer: AccessoriesComposer
      })]
    })
  });
};
export default PlayfulAvatar;
//# sourceMappingURL=PlayfulAvatar.js.map