trepur_components 2.3.4 → 2.3.6

package/storybook-build/assets/AlertBar.stories-BkzNXFBh.js

@@ -1,202 +0,0 @@
-var _a, _b, _c;
-import { i as idAndClassName } from "./controls-DJSGrQKd.js";
-import { j as jsxRuntimeExports } from "./jsx-runtime-D2-sc1j1.js";
-import { r as reactExports } from "./index-DM9bPmif.js";
-import { c as classNames } from "./index-CpyNLP69.js";
-import "./_commonjsHelpers-LQfde5yM.js";
-const AlertBar = ({
-  id,
-  className,
-  type = "warning",
-  text,
-  // leftIconProps,
-  // rightIconProps,
-  textCenter = false,
-  isDismissable = false,
-  onDismissClick
-}) => {
-  const [alertBarStatus, setAlertBarStatus] = reactExports.useState({
-    state: "open",
-    display: true
-  });
-  const bgColor = classNames({
-    "bg-success": type === "success",
-    "bg-warning": type === "warning",
-    "bg-error": type === "error",
-    "bg-info-light": type === "info"
-  });
-  const alertBarState = classNames({
-    "opacity-100": alertBarStatus.state === "open",
-    "opacity-0": alertBarStatus.state === "closed",
-    hidden: !alertBarStatus.display
-  });
-  const classList = classNames(
-    className,
-    bgColor,
-    alertBarState,
-    "flex py-2 text-white duration-700 theme-local w-parent transition-opactiy"
-  );
-  const textClassList = classNames(
-    {
-      "text-center": textCenter
-      // 'pl-20': !textCenter && leftIconProps !== null,
-      // 'pl-4': !textCenter && leftIconProps === null,
-    },
-    "w-full py-3"
-  );
-  classNames(
-    {
-      "hover:cursor-pointer": isDismissable
-    },
-    "absolute right-0 pr-8 pt-3"
-  );
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { id, className: classList, children: /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: textClassList, children: text }) });
-};
-try {
-  AlertBar.displayName = "AlertBar";
-  AlertBar.__docgenInfo = { "description": "", "displayName": "AlertBar", "props": { "id": { "defaultValue": null, "description": "", "name": "id", "required": false, "type": { "name": "string" } }, "className": { "defaultValue": null, "description": "", "name": "className", "required": false, "type": { "name": "string" } }, "type": { "defaultValue": { value: "warning" }, "description": "", "name": "type", "required": false, "type": { "name": "enum", "value": [{ "value": '"success"' }, { "value": '"warning"' }, { "value": '"error"' }, { "value": '"info"' }] } }, "text": { "defaultValue": null, "description": "", "name": "text", "required": false, "type": { "name": "string" } }, "textCenter": { "defaultValue": { value: "false" }, "description": "", "name": "textCenter", "required": false, "type": { "name": "boolean" } }, "isDismissable": { "defaultValue": { value: "false" }, "description": "", "name": "isDismissable", "required": false, "type": { "name": "boolean" } }, "onDismissClick": { "defaultValue": null, "description": "", "name": "onDismissClick", "required": false, "type": { "name": "MouseEventHandler" } } } };
-} catch (__react_docgen_typescript_loader_error) {
-}
-const meta = {
-  title: "Components/Alert Bar",
-  component: AlertBar,
-  argTypes: {
-    ...idAndClassName,
-    type: {
-      type: {
-        name: "string",
-        required: false
-      },
-      options: ["success", "warning", "error", "info"],
-      description: "The type of alert to render",
-      table: {
-        type: {
-          summary: "warning"
-        },
-        defaultValue: {
-          summary: "warning"
-        }
-      },
-      defaultValue: "warning",
-      control: {
-        type: "radio"
-      }
-    },
-    text: {
-      type: {
-        name: "string",
-        required: false
-      },
-      description: "The text to display in the component",
-      table: {
-        type: {
-          summary: "string"
-        },
-        defaultValue: {
-          summary: "undefined"
-        }
-      }
-    },
-    leftIconProps: {
-      description: "The icon props for the icon to display aligned to the left",
-      table: {
-        category: "",
-        type: {
-          summary: "string"
-        },
-        defaultValue: {
-          summary: "undefined"
-        }
-      }
-    },
-    rightIconProps: {
-      description: "The icon props for the icon to display aligned to the right",
-      table: {
-        category: "",
-        type: {
-          summary: "string"
-        },
-        defaultValue: {
-          summary: "undefined"
-        }
-      }
-    },
-    textCenter: {
-      type: {
-        name: "boolean",
-        required: false
-      },
-      description: "Aligns the text in the center of the component",
-      table: {
-        type: {
-          summary: "boolean"
-        },
-        defaultValue: {
-          summary: "false"
-        }
-      },
-      defaultValue: "false"
-    },
-    isDismissable: {
-      type: {
-        name: "boolean",
-        required: false
-      },
-      description: "Enables the component to be closed when set to true",
-      table: {
-        type: {
-          summary: "boolean"
-        },
-        defaultValue: {
-          summary: "false"
-        }
-      },
-      defaultValue: "false"
-    },
-    onDismissClick: {
-      type: {
-        name: "function",
-        required: false
-      },
-      description: "The action to perform when the component is closed",
-      action: "onClick",
-      table: {
-        type: {
-          summary: "function"
-        },
-        defaultValue: {
-          summary: "undefined"
-        }
-      }
-    }
-  },
-  args: {
-    text: "This is an alert bar message",
-    leftIconProps: {
-      type: "heart",
-      colour: "white",
-      hollow: true
-    },
-    rightIconProps: {
-      type: "heart",
-      colour: "white"
-    }
-  }
-};
-const Default = {};
-Default.parameters = {
-  ...Default.parameters,
-  docs: {
-    ...(_a = Default.parameters) == null ? void 0 : _a.docs,
-    source: {
-      originalSource: "{}",
-      ...(_c = (_b = Default.parameters) == null ? void 0 : _b.docs) == null ? void 0 : _c.source
-    }
-  }
-};
-const __namedExportsOrder = ["Default"];
-export {
-  Default,
-  __namedExportsOrder,
-  meta as default
-};

package/storybook-build/assets/Avatar.stories-CpH6xVwM.js

@@ -1,418 +0,0 @@
-var _a, _b, _c;
-import { i as idAndClassName } from "./controls-DJSGrQKd.js";
-import { j as jsxRuntimeExports } from "./jsx-runtime-D2-sc1j1.js";
-import { r as reactExports } from "./index-DM9bPmif.js";
-import "./_commonjsHelpers-LQfde5yM.js";
-let Snap;
-if (typeof window !== "undefined") {
-  Snap = require("snapsvg-cjs");
-}
-const Avatar = () => {
-  const [s, setS] = reactExports.useState(null);
-  let rightEyeWhite, rightEyePupil, leftEyeWhite, leftEyePupil, avatar, armless, torso, face, legs, rightArm, leftArm, rightHand, leftHand, arms, straps, hands, leftThigh, rightThigh, leftShoe, rightShoe;
-  const leftShoulderRotationPoints = "175, 202";
-  const rightShoulderRotationPoints = "94, 202";
-  const svgContainerHeight = 400;
-  const svgContainerWidth = 265;
-  const skinColour = "#FFCC9A";
-  const zipColour = "#315107";
-  const eyeColour = "#1389BF";
-  const hairColour = "#F1B452";
-  const beardColour = "#F1B452";
-  const rucksackColour = "#072765";
-  const trouserColour = "#D3D3D3";
-  const jacketColour = "#416E0A";
-  const mouthColour = "#DC7144";
-  const shoeColour = "#000000";
-  const eyebrowColour = "#F1B452";
-  const noseColour = "#F1B452";
-  const createAvatar = (s2, callBack) => {
-    var _a2, _b2, _c2, _d;
-    if (typeof window === "undefined")
-      return;
-    const head = s2 == null ? void 0 : s2.rect(103, 90, 68, 87, 50).attr({ fill: skinColour });
-    const leftEyebrow = s2 == null ? void 0 : s2.rect(146, 122, 12, 3, 2);
-    const rightEyebrow = s2 == null ? void 0 : s2.rect(115, 122, 12, 3, 2);
-    leftEyeWhite = s2 == null ? void 0 : s2.ellipse(152, 132, 6, 4);
-    rightEyeWhite = s2 == null ? void 0 : s2.ellipse(121, 132, 6, 4);
-    leftEyePupil = s2 == null ? void 0 : s2.ellipse(152, 132, 3, 3).attr({ fill: eyeColour });
-    rightEyePupil = s2 == null ? void 0 : s2.ellipse(121, 132, 3, 3).attr({ fill: eyeColour });
-    const leftEye = s2 == null ? void 0 : s2.group(leftEyeWhite, leftEyePupil);
-    const rightEye = s2 == null ? void 0 : s2.group(rightEyeWhite, rightEyePupil);
-    const outerBeard = s2 == null ? void 0 : s2.rect(103, 90, 68, 87, 50).attr({ fill: "white" });
-    const innerBeard = s2 == null ? void 0 : s2.rect(106, 105, 62, 62, 50);
-    const beardGroup = s2 == null ? void 0 : s2.group(outerBeard, innerBeard);
-    const beard = s2 == null ? void 0 : s2.rect(103, 140, 68, 60).attr({
-      mask: beardGroup,
-      fill: beardColour,
-      opacity: 0.6
-    });
-    const outerHair = s2 == null ? void 0 : s2.rect(103, 90, 68, 60, 25).attr({ fill: "white" });
-    const innerHair = s2 == null ? void 0 : s2.rect(109, 105, 56, 40, 10);
-    const hairGroup = s2 == null ? void 0 : s2.group(outerHair, innerHair);
-    const baseHair = s2 == null ? void 0 : s2.rect(103, 90, 68, 40).attr({
-      mask: hairGroup,
-      fill: hairColour
-    });
-    const hairLevel1 = s2 == null ? void 0 : s2.rect(113, 88, 50, 16, 10).attr({ fill: hairColour }).transform("r0");
-    const hair = s2 == null ? void 0 : s2.group(baseHair, hairLevel1);
-    const outerNose = (_a2 = s2 == null ? void 0 : s2.rect(129, 140, 12, 10, 30)) == null ? void 0 : _a2.attr({ fill: "white" });
-    const innerNose = s2 == null ? void 0 : s2.rect(130, 142, 10, 12, 30);
-    const noseGroup = s2 == null ? void 0 : s2.group(outerNose, innerNose);
-    const nose = (_b2 = s2 == null ? void 0 : s2.rect(129, 140, 12, 10)) == null ? void 0 : _b2.attr({
-      mask: noseGroup,
-      fill: noseColour
-    });
-    const leftEar = (_c2 = s2 == null ? void 0 : s2.circle(103, 135, 5)) == null ? void 0 : _c2.attr({ fill: "white" });
-    const leftEarMask = s2 == null ? void 0 : s2.rect(89, 120, 15, 30).attr({
-      mask: leftEar,
-      fill: skinColour
-    }).transform("r-2");
-    const rightEar = (_d = s2 == null ? void 0 : s2.circle(171, 135, 5)) == null ? void 0 : _d.attr({ fill: "white" });
-    const rightEarMask = s2 == null ? void 0 : s2.rect(170, 120, 15, 30).attr({
-      mask: rightEar,
-      fill: skinColour
-    }).transform("r2");
-    const body = s2 == null ? void 0 : s2.rect(100, 188, 73, 105, 16, 16).attr({ fill: jacketColour });
-    const hood = s2 == null ? void 0 : s2.ellipse(136, 182, 24, 10).attr({ fill: jacketColour });
-    const rightShoulder = s2 == null ? void 0 : s2.rect(87, 190, 27, 14, 10);
-    rightArm = s2 == null ? void 0 : s2.rect(84, 195, 16, 90, 10, 10);
-    const leftShoulder = s2 == null ? void 0 : s2.rect(155, 190, 27, 14, 10);
-    leftArm = s2 == null ? void 0 : s2.rect(170, 195, 16, 90, 10, 10);
-    leftHand = s2 == null ? void 0 : s2.circle(178, 278, 8);
-    rightHand = s2 == null ? void 0 : s2.circle(92, 278, 8);
-    const wasteBand = s2 == null ? void 0 : s2.rect(98, 277, 74, 33, 0, 0);
-    leftThigh = s2 == null ? void 0 : s2.rect(142, 300, 30, 90, 0, 0);
-    rightThigh = s2 == null ? void 0 : s2.rect(98, 300, 30, 90, 0, 0);
-    const bag = s2 == null ? void 0 : s2.rect(99, 180, 74, 78, 10);
-    const rightStrap = s2 == null ? void 0 : s2.rect(101, 185, 5, 100, 10).transform("r4.5");
-    const leftStrap = s2 == null ? void 0 : s2.rect(163, 185, 5, 100, 10).transform("r-4.5");
-    const mouth = s2 == null ? void 0 : s2.circle(136, 155, 10).attr({ fill: "white" });
-    const mouthCutOff = s2 == null ? void 0 : s2.rect(120, 155, 30, 15).attr({ fill: mouthColour });
-    const leftShoeTop = s2 == null ? void 0 : s2.rect(142, 370, 30, 20, 10);
-    const leftShoeSole = s2 == null ? void 0 : s2.rect(142, 378, 30, 12);
-    const rightShoeTop = s2 == null ? void 0 : s2.rect(98, 370, 30, 20, 10);
-    const rightShoeSole = s2 == null ? void 0 : s2.rect(98, 378, 30, 12);
-    const mainZip = s2 == null ? void 0 : s2.rect(135, 199, 3, 94);
-    const leftZip = s2 == null ? void 0 : s2.rect(141, 188, 2, 15).transform("r44.5");
-    const rightZip = s2 == null ? void 0 : s2.rect(130, 188, 2, 15).transform("r-44.5");
-    const centerNeck = s2 == null ? void 0 : s2.rect(128, 170, 17, 21);
-    const leftNeck = s2 == null ? void 0 : s2.rect(139, 181, 10, 10).transform("r-33");
-    const rightNeck = s2 == null ? void 0 : s2.rect(124, 181, 10, 10).transform("r33");
-    const frontNeck = s2 == null ? void 0 : s2.rect(129, 182, 15, 15).transform("r45");
-    const neck = s2 == null ? void 0 : s2.group(centerNeck, leftNeck, rightNeck, frontNeck).attr({ fill: skinColour });
-    const zip = s2 == null ? void 0 : s2.group(mainZip, leftZip, rightZip).attr({ fill: zipColour });
-    leftShoe = s2 == null ? void 0 : s2.group(leftShoeTop, leftShoeSole);
-    rightShoe = s2 == null ? void 0 : s2.group(rightShoeTop, rightShoeSole);
-    const rucksack = s2 == null ? void 0 : s2.group(leftStrap, rightStrap, bag).attr({ fill: rucksackColour });
-    const eyes = s2 == null ? void 0 : s2.group(leftEye, rightEye).attr({ fill: "white" });
-    const eyebrows = s2 == null ? void 0 : s2.group(leftEyebrow, rightEyebrow).attr({ fill: eyebrowColour });
-    const shoes = s2 == null ? void 0 : s2.group(leftShoe, rightShoe).attr({ fill: shoeColour });
-    const ears = s2 == null ? void 0 : s2.group(leftEarMask, rightEarMask);
-    arms = s2 == null ? void 0 : s2.group(rightShoulder, leftShoulder, leftArm, rightArm).attr({ fill: jacketColour });
-    hands = s2 == null ? void 0 : s2.group(leftHand, rightHand).attr({ fill: skinColour });
-    straps = s2 == null ? void 0 : s2.group(leftStrap, rightStrap).attr({ fill: rucksackColour });
-    face = s2 == null ? void 0 : s2.group(
-      head,
-      eyes,
-      eyebrows,
-      nose,
-      mouth,
-      mouthCutOff,
-      ears,
-      hair,
-      beard
-    );
-    torso = s2 == null ? void 0 : s2.group(rucksack, hood, body, neck, zip);
-    legs = s2 == null ? void 0 : s2.group(leftThigh, rightThigh, wasteBand, shoes).attr({ fill: trouserColour });
-    armless = s2 == null ? void 0 : s2.group(legs, torso, face);
-    avatar = s2 == null ? void 0 : s2.group(armless, arms, straps, hands);
-    mouthCutOff == null ? void 0 : mouthCutOff.attr({
-      mask: mouth
-    });
-    callBack(avatar);
-  };
-  const nextFrame = (s2, frameArray, frame) => {
-    if (frame >= frameArray.length) {
-      return;
-    }
-    Snap.animate(
-      frameArray[frame].from,
-      frameArray[frame].to,
-      frameArray[frame].funct,
-      frameArray[frame].dur,
-      null,
-      nextFrame.bind(null, Snap, frameArray, frame + 1)
-    );
-  };
-  const rightWave = [
-    {
-      funct: function(val) {
-        rightArm.transform(`r${val},${rightShoulderRotationPoints}`);
-        rightHand.transform(`r${val},${rightShoulderRotationPoints}`);
-      },
-      from: 0,
-      to: 170,
-      dur: 100
-    },
-    {
-      funct: function(val) {
-        rightArm.transform(`r${val},${rightShoulderRotationPoints}`);
-        rightHand.transform(`r${val},${rightShoulderRotationPoints}`);
-      },
-      from: 170,
-      to: 120,
-      dur: 100
-    },
-    {
-      funct: function(val) {
-        rightArm.transform(`r${val},${rightShoulderRotationPoints}`);
-        rightHand.transform(`r${val},${rightShoulderRotationPoints}`);
-      },
-      from: 120,
-      to: 170,
-      dur: 100
-    },
-    {
-      funct: function(val) {
-        rightArm.transform(`r${val},${rightShoulderRotationPoints}`);
-        rightHand.transform(`r${val},${rightShoulderRotationPoints}`);
-      },
-      from: 170,
-      to: 120,
-      dur: 100
-    },
-    {
-      funct: function(val) {
-        rightArm.transform(`r${val},${rightShoulderRotationPoints}`);
-        rightHand.transform(`r${val},${rightShoulderRotationPoints}`);
-      },
-      from: 120,
-      to: 170,
-      dur: 100
-    },
-    {
-      funct: function(val) {
-        rightArm.transform(`r${val},${rightShoulderRotationPoints}`);
-        rightHand.transform(`r${val},${rightShoulderRotationPoints}`);
-      },
-      from: 170,
-      to: 120,
-      dur: 100
-    },
-    {
-      funct: function(val) {
-        rightArm.transform(`r${val},${rightShoulderRotationPoints}`);
-        rightHand.transform(`r${val},${rightShoulderRotationPoints}`);
-      },
-      from: 120,
-      to: 0,
-      dur: 100
-    }
-  ];
-  const leftWave = [
-    {
-      funct: function(val) {
-        leftArm.transform(`r${val},${leftShoulderRotationPoints}`);
-        leftHand.transform(`r${val},${leftShoulderRotationPoints}`);
-      },
-      from: 0,
-      to: -150,
-      dur: 100
-    },
-    {
-      funct: function(val) {
-        leftArm.transform(`r${val},${leftShoulderRotationPoints}`);
-        leftHand.transform(`r${val},${leftShoulderRotationPoints}`);
-      },
-      from: -150,
-      to: -120,
-      dur: 100
-    },
-    {
-      funct: function(val) {
-        leftArm.transform(`r${val},${leftShoulderRotationPoints}`);
-        leftHand.transform(`r${val},${leftShoulderRotationPoints}`);
-      },
-      from: -120,
-      to: -150,
-      dur: 100
-    },
-    {
-      funct: function(val) {
-        leftArm.transform(`r${val},${leftShoulderRotationPoints}`);
-        leftHand.transform(`r${val},${leftShoulderRotationPoints}`);
-      },
-      from: -150,
-      to: -120,
-      dur: 100
-    },
-    {
-      funct: function(val) {
-        leftArm.transform(`r${val},${leftShoulderRotationPoints}`);
-        leftHand.transform(`r${val},${leftShoulderRotationPoints}`);
-      },
-      from: -120,
-      to: -150,
-      dur: 100
-    },
-    {
-      funct: function(val) {
-        leftArm.transform(`r${val},${leftShoulderRotationPoints}`);
-        leftHand.transform(`r${val},${leftShoulderRotationPoints}`);
-      },
-      from: -150,
-      to: -120,
-      dur: 100
-    },
-    {
-      funct: function(val) {
-        leftArm.transform(`r${val},${leftShoulderRotationPoints}`);
-        leftHand.transform(`r${val},${leftShoulderRotationPoints}`);
-      },
-      from: -120,
-      to: 0,
-      dur: 100
-    }
-  ];
-  const jump = () => {
-    torso.animate({ transform: "t0,20" }, 500);
-    arms.animate({ transform: "t0,20" }, 500);
-    straps.animate({ transform: "t0,20" }, 500);
-    hands.animate({ transform: "t0,20" }, 500);
-    face.animate({ transform: "t0,20" }, 500, function() {
-      face.animate({ transform: "t0,-70" }, 200);
-      torso.animate({ transform: "t0,-70" }, 200);
-      arms.animate({ transform: "t0,-70" }, 200);
-      straps.animate({ transform: "t0,-70" }, 200);
-      hands.animate({ transform: "t0,-70" }, 200);
-      legs.animate({ transform: "t0,-70" }, 200, function() {
-        face.animate({ transform: "t0,0" }, 200);
-        torso.animate({ transform: "t0,0" }, 200);
-        arms.animate({ transform: "t0,0" }, 200);
-        straps.animate({ transform: "t0,0" }, 200);
-        hands.animate({ transform: "t0,0" }, 200);
-        legs.animate({ transform: "t0,0" }, 200);
-      });
-    });
-  };
-  const eyesLeft = (duration) => {
-    leftEyePupil.animate({ transform: "t2,0" }, duration);
-    rightEyePupil.animate({ transform: "t2,0" }, duration);
-  };
-  const eyesRight = (duration) => {
-    leftEyePupil.animate({ transform: "t-2,0" }, duration);
-    rightEyePupil.animate({ transform: "t-2,0" }, duration);
-  };
-  const eyesCenter = (duration) => {
-    leftEyePupil.animate({ transform: "t0,0" }, duration);
-    rightEyePupil.animate({ transform: "t0,0" }, duration);
-  };
-  const blink = (times) => {
-    if (times < 1)
-      return;
-    [...Array(times)].forEach((_) => {
-      leftEyeWhite == null ? void 0 : leftEyeWhite.animate({ ry: 0 }, 120);
-      leftEyePupil.animate({ ry: 0 }, 120);
-      rightEyeWhite == null ? void 0 : rightEyeWhite.animate({ ry: 0 }, 120);
-      rightEyePupil.animate({ ry: 0 }, 120, function() {
-        leftEyeWhite == null ? void 0 : leftEyeWhite.animate({ ry: 4 }, 200);
-        leftEyePupil == null ? void 0 : leftEyePupil.animate({ ry: 3 }, 200);
-        rightEyeWhite == null ? void 0 : rightEyeWhite.animate({ ry: 4 }, 200);
-        rightEyePupil == null ? void 0 : rightEyePupil.animate({ ry: 3 }, 200, () => {
-          blink(times - 1);
-        });
-      });
-    });
-  };
-  const animate = (s2, animation) => {
-    nextFrame(s2, animation, 0);
-  };
-  reactExports.useEffect(() => {
-    if (typeof window === "undefined")
-      return;
-    if (Snap) {
-      setS(Snap("#svg"));
-    }
-    const makeBlinkHappen = () => {
-      const randNum = Math.floor(Math.random() * 2) + 1;
-      blink(randNum);
-    };
-    const loadActions = () => {
-      if (!avatar)
-        return;
-      setTimeout(() => {
-        animate(s, leftWave);
-      }, 1e3);
-      setInterval(makeBlinkHappen, 3500);
-      rightArm == null ? void 0 : rightArm.click(() => animate(s, rightWave));
-      rightHand == null ? void 0 : rightHand.click(() => animate(s, rightWave));
-      leftArm == null ? void 0 : leftArm.click(() => animate(s, leftWave));
-      leftHand == null ? void 0 : leftHand.click(() => animate(s, leftWave));
-      armless == null ? void 0 : armless.click(jump);
-      leftArm == null ? void 0 : leftArm.hover(() => {
-        eyesLeft(200);
-      });
-      leftThigh == null ? void 0 : leftThigh.hover(() => {
-        eyesLeft(200);
-      });
-      leftShoe == null ? void 0 : leftShoe.hover(() => {
-        eyesLeft(200);
-      });
-      torso == null ? void 0 : torso.hover(() => {
-        eyesCenter(200);
-      });
-      rightArm == null ? void 0 : rightArm.hover(() => {
-        eyesRight(200);
-      });
-      rightThigh == null ? void 0 : rightThigh.hover(() => {
-        eyesRight(200);
-      });
-      rightShoe == null ? void 0 : rightShoe.hover(() => {
-        eyesRight(200);
-      });
-    };
-    createAvatar(s, loadActions);
-  }, [s]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    "svg",
-    {
-      id: "svg",
-      className: "mx-auto",
-      height: `${svgContainerHeight.toString()}px`,
-      width: `${svgContainerWidth.toString()}px`,
-      version: "1.1",
-      xmlns: "http://www.w3.org/2000/svg"
-    }
-  );
-};
-try {
-  Avatar.displayName = "Avatar";
-  Avatar.__docgenInfo = { "description": "", "displayName": "Avatar", "props": {} };
-} catch (__react_docgen_typescript_loader_error) {
-}
-const meta = {
-  title: "Components/Avatar",
-  component: Avatar,
-  argTypes: {
-    ...idAndClassName
-  },
-  args: {}
-};
-const Default = {};
-Default.parameters = {
-  ...Default.parameters,
-  docs: {
-    ...(_a = Default.parameters) == null ? void 0 : _a.docs,
-    source: {
-      originalSource: "{}",
-      ...(_c = (_b = Default.parameters) == null ? void 0 : _b.docs) == null ? void 0 : _c.source
-    }
-  }
-};
-const __namedExportsOrder = ["Default"];
-export {
-  Default,
-  __namedExportsOrder,
-  meta as default
-};